2015-04-15 4 views
28

Я не мог найти лучшего примера для использования RecyclerView с StaggeredGridLayoutManager. Даже в Android Docs.Нет хорошего примера о RecyclerView и StaggeredGridLayoutManager в Android Docs

Q1. Мне нужны некоторые примеры, которые могут дать правильное объяснение того, как использовать RecyclerView с StaggeredGridLayoutManager.

Q2. Может кто-нибудь сказать мне, если можно создать следующую структуру, используя RecyclerView с StaggeredGridLayoutManager

example

До сих пор я нашел этот link, который не совсем полезно.

Я также нашел это link для cardlib, но он слишком сложный в реализации и имеет слишком много зависимостей, что излишне увеличит размер моего приложения.

+0

Вы можете найти этот пример полезным: https://github.com/dbleicher/recyclerview-grid-quickreturn – MojoTosh

+0

Мне нравится этот пример как RecyclerView и StaggeredGridLayoutManager: https: // направляющие .codepath.com/Android/Использование-The-RecyclerView – Muz

ответ

3

Предполагая, что вы уже создали адаптер и инициализировали RecyclerView, следующий код должен делать то, что вы ищете.

StaggeredGridLayoutManager staggeredGridLayoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL); 
recyclerView.setLayoutManager(staggeredGridLayoutManager); 

Для получения дополнительной справки и документации, пожалуйста, проверьте по следующей ссылке: https://developer.android.com/reference/android/support/v7/widget/StaggeredGridLayoutManager.html

29

Для тех, кто до сих пор посадки на этот вопрос.

Вы можете изменить следующий код в соответствии с вашими потребностями:
Сначала добавьте библиотеки зависимостей для Android RecyclerView и CardView

compile 'com.android.support:appcompat-v7:23.4.0' 
compile 'com.android.support:cardview-v7:23.4.0' 
compile 'com.android.support:recyclerview-v7:23.4.0' 

Ваш основной макет деятельности activity_main.xml будет просто как

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:padding="7dp" 
    tools:context=".MainActivity"> 

    <android.support.v7.widget.RecyclerView 
     android:id="@+id/recycler_view" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:scrollbars="vertical" /> 

</RelativeLayout> 


Определить компоновку карты в файле макета с именем book_list_item.xml

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:card_view="http://schemas.android.com/apk/res-auto" 
android:id="@+id/card_view" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
card_view:cardUseCompatPadding="true"> 

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="@android:color/white" 
    android:orientation="vertical"> 

    <TextView 
     android:id="@+id/BookName" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:padding="5dp" 
     android:textColor="@android:color/black" 
     android:textSize="16sp" /> 

    <TextView 
     android:id="@+id/AuthorName" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:layout_below="@+id/country_photo" 
     android:background="#1976D2" 
     android:gravity="center_horizontal" 
     android:paddingBottom="8dp" 
     android:paddingTop="8dp" 
     android:text="@string/hello_world" 
     android:textColor="#ffffff" 
     android:textSize="13sp" /> 
</LinearLayout> 

</android.support.v7.widget.CardView> 


Определите эту раскладку как класс ItemObject.java

public class ItemObject 
{ 
    private String _name; 
    private String _author; 

    public ItemObject(String name, String auth) 
    { 
     this._name = name; 
     this._author = auth; 
    } 

    public String getName() 
    { 
     return _name; 
    } 

    public void setName(String name) 
    { 
     this._name = name; 
    } 

    public String getAuthor() 
    { 
     return _author; 
    } 

    public void setAuthor(String auth) 
    { 
     this._author = auth; 
    } 
} 


Определение пользовательского адаптера SampleRecyclerViewAdapter для заполнения карты

public class SampleRecyclerViewAdapter extends RecyclerView.Adapter<SampleViewHolders> 
{ 
    private List<ItemObject> itemList; 
    private Context context; 

    public SampleRecyclerViewAdapter(Context context, 
     List<ItemObject> itemList) 
    { 
     this.itemList = itemList; 
     this.context = context; 
    } 

    @Override 
    public SampleViewHolders onCreateViewHolder(ViewGroup parent, int viewType) 
    { 
     View layoutView = LayoutInflater.from(parent.getContext()).inflate(
      R.layout.book_list_item, null); 
     SampleViewHolders rcv = new SampleViewHolders(layoutView); 
     return rcv; 
    } 

    @Override 
    public void onBindViewHolder(SampleViewHolders holder, int position) 
    { 
     holder.bookName.setText(itemList.get(position).getName()); 
     holder.authorName.setText(itemList.get(position).getAuthor()); 
    } 

    @Override 
    public int getItemCount() 
    { 
     return this.itemList.size(); 
    } 
} 


Нам также нужен зритель для каждого ItemObject.Таким образом, определить класс SampleViewHolders

public class SampleViewHolders extends RecyclerView.ViewHolder implements 
    View.OnClickListener 
{ 
    public TextView bookName; 
    public TextView authorName; 

    public SampleViewHolders(View itemView) 
    { 
     super(itemView); 
     itemView.setOnClickListener(this); 
     bookName = (TextView) itemView.findViewById(R.id.BookName); 
     authorName = (TextView) itemView.findViewById(R.id.AuthorName); 
    } 

    @Override 
    public void onClick(View view) 
    { 
     Toast.makeText(view.getContext(), 
      "Clicked Position = " + getPosition(), Toast.LENGTH_SHORT) 
      .show(); 
    } 
} 

Сейчас в MainActivity, назначить экземпляр StaggeredGridLayoutManager для recycler_view, чтобы определить, как будет выглядеть компоненты.
заполнить также карты с использованием экземпляра SampleRecyclerViewAdapter следующим

public class MainActivity extends AppCompatActivity 
{ 
    private StaggeredGridLayoutManager _sGridLayoutManager; 

    @Override 
    protected void onCreate(Bundle savedInstanceState) 
    { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.activity_main); 

     RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recycler_view); 
     recyclerView.setHasFixedSize(true); 

     _sGridLayoutManager = new StaggeredGridLayoutManager(2, 
      StaggeredGridLayoutManager.VERTICAL); 
     recyclerView.setLayoutManager(_sGridLayoutManager); 

     List<ItemObject> sList = getListItemData(); 

     SampleRecyclerViewAdapter rcAdapter = new SampleRecyclerViewAdapter(
      MainActivity.this, sList); 
     recyclerView.setAdapter(rcAdapter); 
    } 

    private List<ItemObject> getListItemData() 
    { 
     List<ItemObject> listViewItems = new ArrayList<ItemObject>(); 
     listViewItems.add(new ItemObject("1984", "George Orwell")); 
     listViewItems.add(new ItemObject("Pride and Prejudice", "Jane Austen")); 
     listViewItems.add(new ItemObject("One Hundred Years of Solitude", "Gabriel Garcia Marquez")); 
     listViewItems.add(new ItemObject("The Book Thief", "Markus Zusak")); 
     listViewItems.add(new ItemObject("The Hunger Games", "Suzanne Collins")); 
     listViewItems.add(new ItemObject("The Hitchhiker's Guide to the Galaxy", "Douglas Adams")); 
     listViewItems.add(new ItemObject("The Theory Of Everything", "Dr Stephen Hawking")); 

     return listViewItems; 
    } 
} 

Вывод будет выглядеть примерно так Two Colums Output

Для вашего требования, вы можете включить в ImageView в book_list_item.xml и заполнить его соответственно в SampleViewHolders
Также обратите внимание, чтобы изменить количество столбцов от 2 до 3.

Вы можете изменить объявление в MainActivity в

_sGridLayoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL); 
recyclerView.setLayoutManager(_sGridLayoutManager); 

который даст выход, как этот Three Column Output

Вот another simple tutorial

0

Наши друзья «Генри» есть хороший и простой объяснить here.

И я думаю, что ниже конструктор подходит для большинства применений:

StaggeredGridLayoutManager(num , LinearLayoutManager.VERTICAL) 
// where 'num' is your columns count 
// LinearLayoutManager.VERTICAL = 1 
Смежные вопросы