具有多行和多列的 Recycler 视图 - 类似 Flow Layout [Android] 的 AutoFit答案

【问题标题】：Recycler View with multiple rows and columns - AutoFit like Flow Layout [Android]具有多行和多列的 Recycler 视图 - 类似 Flow Layout [Android] 的 AutoFit
【发布时间】：2015-08-20 04:38:51
【问题描述】：

我在构建这样的布局时遇到了挑战：

我的第一个想法是使用带有适配器的 RecyclerView，该适配器可以处理每个项目并扩大其布局。

到目前为止，还不是很好。

到目前为止我得到了这个布局：

我觉得我快到了，但真的……我花了一周时间思考如何让它变得更好，或者就像 UI 建议的那样。

我的一些尝试是

使用网格布局并根据列表中的项目数更改最大列数
StaggeredGridLayoutManager 听起来像是修复它并让我开心的强大候选者，但不幸的是，当我尝试使用它时，我意识到我们需要在构造函数上传递一些 spanCount（列），我找到了一些解决此问题的方法限制更改每行的列数，但我不喜欢最终结果，这与我在设置兴趣时在 Foursquare 等其他应用中看到的不同。
我查看了这个库Flow Layout，但我什至没有开始使用它，因为我不想失去整个回收站视图的权力，我相信有办法让它工作！ .....即使知道图书馆完全符合我的需要。

伙计们，我不是在这里寻找一些已经完成的代码和平或有人来完成我的工作。其实我在寻找隧道尽头的光。

【问题讨论】：

交错的网格视图效果......这就是你在这里所缺少的吗？还是还有更多？
交错网格视图构造函数在我们实例化时需要一个跨度计数，我不想固定列数，我想根据项目宽度逐行调整布局
试试这个。 public final void onBindViewHolder(RecyclerView.ViewHolder viewHolder, int position) { StaggeredGridLayoutManager.LayoutParams layoutParams = (StaggeredGridLayoutManager.LayoutParams) viewHolder.itemView.getLayoutParams(); layoutParams.setFullSpan(true); }
我现在不在笔记本电脑上，但我之前尝试过这种方法，我意识到每个项目都适合整个行宽
你试过横向交错吗？

标签： android layout-manager android-recyclerview flowlayout gridlayoutmanager

【解决方案1】：

您好，如果您不想使用 recyclerview，还有另一个使用 custom Library 的示例，其作用类似于 List GitHubLibrary TagLayout

示例代码：

mFlowLayout.setAdapter(new TagAdapter<String>(mVals)
   {
       @Override
       public View getView(FlowLayout parent, int position, String s)
       {
           TextView tv = (TextView) mInflater.inflate(R.layout.tv,
                   mFlowLayout, false);
           tv.setText(s);
           return tv;
       }
   });

使用以下代码，您可以预先设置您想要的选择：

mAdapter.setSelectedList(1,3,5,7,8,9);

将显示如下结果：-

【讨论】：

【解决方案2】：

使用包含名为芯片的组件的新谷歌材料设计库很容易做到这一点。所以你不必使用 RecyclerView。

Chip 表示一个小块中的复杂实体，例如一个接触。它是一个圆形按钮，由一个标签、一个可选芯片图标和一个可选的关闭图标。芯片可以被点击或如果它是可检查的，则切换。

如何使用组件：

1.导入库

implementation 'com.google.android.material:material:1.1.0'

2。使用下面的代码

 <com.google.android.material.chip.ChipGroup
      android:layout_width="match_parent"
      android:layout_height="wrap_content">

 <!-- Your items here -->

     <com.google.android.material.chip.Chip
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="Item 1"/>

     <com.google.android.material.chip.Chip
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="Item 2"/>

     <com.google.android.material.chip.Chip
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="Item 3"/>

 <!-- End -->

</com.google.android.material.chip.ChipGroup>

您可以在这里找到更多详细信息：Material components

【讨论】：

【解决方案3】：

现在可能为时已晚，不过你也可以用google的FlexBoxLayout

Demo

【讨论】：

您应该添加示例或更多详细信息，而不仅仅是发布链接。