[英]How to automatically determine item fit count for RecyclerView grid
Is it possible to use a specified width (100dp) to equally space out items in a Grid (as many as possible) for a RecyclerView rather than using an exact number of columns? 是否可以使用指定的宽度(100dp)为RecyclerView均匀分布网格中的项目(尽可能多),而不是使用确切的列数? int numberOfColumns = 3;
, int numberOfColumns = 4;
, int numberOfColumns = 4;
, etc. will not do the job as this will lead to plenty of empty space being present on larger screens. 等等将无法完成工作,因为这会导致较大的屏幕上存在大量空白空间。
portrait orientation 纵向
landscape orientation 景观取向
RecyclerView-related code in Fragment 片段中与RecyclerView相关的代码
static final String[] frenchVowels = new String[]{
"a", "e", "i", "o", "u", "y"
};
RecyclerViewAdapter rvAdapterGL;
final RecyclerView rvGL = viewHolder.itemView.findViewById(R.id.rv);
int numberOfColumns = 2;
rvGL.setLayoutManager(new GridLayoutManager(getActivity(), numberOfColumns));
rvAdapterGL = new RecyclerViewAdapter(getActivity(), frenchVowels);
rvGL.setAdapter(rvAdapterGL);
RecyclerView adapter class RecyclerView适配器类
public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerViewAdapter.ViewHolder> {
private String[] mData;
private LayoutInflater mInflater;
// data is passed into the constructor
public RecyclerViewAdapter(Context context, String[] data) {
this.mInflater = LayoutInflater.from(context);
this.mData = data;
}
// inflates the cell layout from xml when needed
@Override
@NonNull
public RecyclerViewAdapter.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = mInflater.inflate(R.layout.gridview_item, parent, false);
return new RecyclerViewAdapter.ViewHolder(view);
}
// binds the data to the TextView in each cell
@Override
public void onBindViewHolder(@NonNull RecyclerViewAdapter.ViewHolder holder, int position) {
holder.myTextView.setText(mData[position]);
}
// total number of cells
@Override
public int getItemCount() {
return mData.length;
}
// stores and recycles views as they are scrolled off screen
public class ViewHolder extends RecyclerView.ViewHolder {
TextView myTextView;
ViewHolder(View itemView) {
super(itemView);
myTextView = itemView.findViewById(R.id.item_gridview);
}
}
}
XML XML
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true"
android:focusable="true"
android:id="@+id/cv_gv"
android:layout_marginBottom="20dp"
>
<LinearLayout
android:id="@+id/cardview_gv_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="10dp"
android:animateLayoutChanges="true">
<LinearLayout
android:id="@+id/cardview_gv_titlerow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginBottom="2dp"
android:weightSum="100">
<TextView
android:id="@+id/tv_gv_A"
android:layout_weight="90"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textColor="?android:attr/textColorPrimary"
style="@android:style/TextAppearance.Medium" />
<TextView
android:id="@+id/tv_gv_expandcollapse"
android:importantForAccessibility="no"
android:clickable="true"
android:focusable="true"
android:layout_weight="10"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:textColor="?android:attr/textColorPrimary"
style="@android:style/TextAppearance.Large" />
</LinearLayout>
<RelativeLayout
android:id="@+id/relativelayout_gv"
android:animateLayoutChanges="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<GridView
android:id="@+id/gv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:columnWidth="100dp"
android:numColumns="auto_fit"
android:layout_marginBottom="20dp"
android:stretchMode="columnWidth" />
</RelativeLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
There are a few different ways to handle this. 有几种不同的方法可以解决此问题。 One thing you could do is get the screen width and divide it by your desired cell width to get the number of columns. 您可以做的一件事是获取屏幕宽度,然后将其除以所需的单元格宽度,以获取列数。
You could also use the Resources framework to set different column counts for different screen sizes. 您也可以使用资源框架为不同的屏幕尺寸设置不同的列数。 For example, you could have a res/values/integers.xml
that sets the column count to 3, and also a res/values-sw400dp/integers.xml
that sets the column count to 5, and so on. 例如,您可能有一个res/values/integers.xml
将列数设置为3,还有一个res/values-sw400dp/integers.xml
将列数设置为5,依此类推。
res/values/integers.xml RES /值/ integers.xml
<resources>
<integer name=“column_count”>3</integer>
</resources>
res/values-sw400dp/integers.xml RES /值-sw400dp / integers.xml
<resources>
<integer name=“column_count”>5</integer>
</resources>
Now you can replace 现在您可以更换
int numberOfColumns = 2;
with 同
int numberOfColumns = getResources().getInteger(R.integer.column_count);
And you can use any number of values-swXXXdp/integers.xml
files with lots of different values for XXX
to have lots of different column counts for lots of different screen sizes. 而且,您可以使用任意数量的values-swXXXdp/integers.xml
文件,其中XXX
具有很多不同的值,以针对许多不同的屏幕尺寸具有许多不同的列数。
If you use GridView layout, this question is answered here . 如果使用GridView布局,请在此处回答此问题。
Or, if you want to use GridLayoutManager, do it like this 或者,如果您想使用GridLayoutManager,请按以下步骤进行操作
if(getActivity().getResources().getConfiguration().orientation == Configuration.ORIENTATION_PORTRAIT){
mRecycler.setLayoutManager(new GridLayoutManager(mContext, 2));
}
else{
mRecycler.setLayoutManager(new GridLayoutManager(mContext, 4));
}
You should use flexbox-layout library. 您应该使用flexbox-layout库。 It's open source library design by Google, Which will auto set column count based on the Row Width, You don't need to specify the column count. 它是Google的开放源代码库设计,它将根据行宽自动设置列数,您无需指定列数。
And Its usage is also simple: 而且它的用法也很简单:
RecyclerView recyclerView = (RecyclerView) context.findViewById(R.id.recyclerview);
FlexboxLayoutManager layoutManager = new FlexboxLayoutManager(context);
recyclerView.setLayoutManager(layoutManager);
Gradle: 摇篮:
dependencies {
implementation 'com.google.android:flexbox:1.0.0'
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.