【问题标题】:No good example about RecyclerView and StaggeredGridLayoutManager in Android DocsAndroid Docs 中没有关于 RecyclerView 和 StaggeredGridLayoutManager 的好例子
【发布时间】:2015-06-20 22:49:52
【问题描述】:

我找不到任何更好的例子来使用RecyclerViewStaggeredGridLayoutManager。甚至在Android Docs 中也没有。

Q1.我需要一些例子来正确解释如何使用RecyclerViewStaggeredGridLayoutManager

Q2.谁能告诉我是否可以使用RecyclerViewStaggeredGridLayoutManager创建以下布局

到目前为止,我发现这个link 一点用都没有。

我还为 cardlib 找到了这个 link,但它的实现太复杂了,并且依赖项太多,这会不必要地增加我的应用程序大小。

【问题讨论】:

标签: android android-recyclerview staggered-gridview


【解决方案1】:

对于那些仍在回答这个问题的人。

您可以根据需要修改以下代码:
首先为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;
    }
}

输出看起来像这样

根据您的要求,您可以在 book_list_item.xml 中合并一个 ImageView 并在 SampleViewHolders 中相应地填充它
另请注意,要将列数从 2 更改为 3。

您可以将 MainActivity 中的声明更改为

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

这将给出这样的输出

这里是another simple tutorial

【讨论】:

  • 完美,易于理解的示例。 OP 应该接受这个作为答案。谢谢! :)
  • 感谢您的评论 :)
【解决方案2】:

假设您已经创建了一个适配器并初始化了 RecyclerView,下面的代码应该可以满足您的需求。

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

如需更多参考和文档,请查看以下链接: https://developer.android.com/reference/android/support/v7/widget/StaggeredGridLayoutManager.html

【讨论】:

    【解决方案3】:

    我们的朋友“Henry”有一个很好的简单解释here

    我认为下面的构造函数适合大多数用途:

    StaggeredGridLayoutManager(num , LinearLayoutManager.VERTICAL)
    // where 'num' is your columns count
    // LinearLayoutManager.VERTICAL = 1
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-01-07
      • 2011-05-29
      • 1970-01-01
      • 2011-01-10
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多