如何将 recyclerview 的项目居中?

How to center items of a recyclerview?

我需要将每一行的元素居中,这样它们就会像这个模型中那样。 我一直在寻找是否有任何布局可以在不看的情况下以这种方式工作。 项目在它们的行中居中。

这就是它现在在我的代码中的样子。

我假设您使用 LinearLayoutManagerRecyclerView 来实现 ListView 风格的效果。在这种情况下,对每一行使用 horizontal LinearLayout,并使用 android:gravity="center" 使其内容居中。

LinearLayout 放入 RecyclerView 的项目行布局中,然后将 android:layout_gravity="center" 交给 LinearLayout

对于每行图像,您必须拍摄不同的 LinearLayout

示例代码如下:

 <LinearLayout
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_gravity="center"
         android:orientation="horizontal">

            <ImageView
                android:id="@+id/image1"
                android:layout_width="64dp"
                android:layout_height="64dp"
                android:layout_marginRight="10dp"
                android:layout_weight="1"
                android:src="@drawable/image1" />

            <ImageView
                android:id="@+id/image2"
                android:layout_width="64dp"
                android:layout_height="64dp"
                android:layout_marginLeft="10dp"
                android:layout_marginRight="10dp"
                android:layout_weight="1"
                android:src="@drawable/image2" />

           <ImageView
                android:id="@+id/image3"
                android:layout_width="64dp"
                android:layout_height="64dp"
                android:layout_marginLeft="10dp"
                android:layout_marginRight="10dp"
                android:layout_weight="1"
                android:src="@drawable/image3" />

  </LinearLayout>

您可以动态添加一些布局,例如:

  • 适配器对象可以是水平的 LinearLayout

1- 在 java 代码中创建一个 LinearLayout 并自定义它(重力,...)

2- 向 linearLayout 添加一些图标

3- 将 linearLayout 添加到您的适配器

4- 重复 1,2,3


    // : declare new horizontal linearLayout
    ImageView myIcons[nomOfIcons];
    // : add all icons to myIcons
    for(int i=1; i<=nomOfIcons; i++){
        linearLayout.addView(myIcons[i - 1]);
        if(i%numOfIconsInOneHorizontalLinearLayout==0) {
            results.add(linearLayout); // add linearLayout to adapter dataSet
            // : declare new horizontal linearLayout
        }
    }
    if(n%numOfIconsInOneHorizontalLinearLayout!=0) // add last linearLayout if not added in the loop
        results.add(linearLayout);
    mAdapter.notifyDataSetChanged(); // update adapter

使用 gridLayoutManager = new GridLayoutManager(context,6) 并覆盖 setSpanSizeLookup

示例:

int totalSize=list.size();
gridLayoutManager.setSpanSizeLookup(new GridLayoutManager.SpanSizeLookup() {
                    @Override
                    public int getSpanSize(int position) {
                        int span;
                        span = totalSize % 3;
                        if (totalSize < 3) {
                            return 6;
                        } else if (span == 0 || (position <= ((totalSize - 1) - span))) {
                            return 2;
                        } else if (span == 1) {
                            return 6;
                        } else {
                            return 3;
                        }
                    }
                });

如果您想连续显示 3 个项目并保持在网格中央,这将起作用。

根据您的要求更改网格布局管理器跨度计数。

将 recyclerview width 变为 wrap_content 并将其容器的 layout_gravity 变为 center_horizontal

 <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:orientation="vertical">

      <android.support.v7.widget.RecyclerView
           android:id="@+id/recycrer_view"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_gravity="center_horizontal"
           android:paddingLeft="16dp"
           android:paddingRight="16dp" />
 </LinearLayout>

您可以使用 google FlexLayoutManager 中的新布局管理器 它将为您提供对 recyclerView 项目的大量控制和灵活性

使用 com.google.android:flexbox 库中的 FlexboxLayout。请注意 flexwrapjustifyContent 属性 值。然后,在要换行之前的项目的视图上设置 layout_wrapBefore = true

    <com.google.android.flexbox.FlexboxLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:flexWrap="wrap"
        app:justifyContent="center">

        <View ... />

        <View app:layout_wrapBefore="true" ... />

        <View ... />

    </com.google.android.flexbox.FlexboxLayout>

目前,我认为我们需要为其编写自己的自定义视图,因为Android还没有像我们预期的那样支持此功能。

这是我制作的示例,以备不时之需: https://github.com/mttdat/utils

(通过调整 Manifest 文件尝试 CenterGridActivity.kt 以默认启动此 activity)

达成:

recyclerView.adapter = MyAdapter()
val layoutManager = FlexboxLayoutManager(context).apply {
    justifyContent = JustifyContent.CENTER
    alignItems = AlignItems.CENTER
    flexDirection = FlexDirection.ROW 
    flexWrap = FlexWrap.WRAP
}
recyclerView.layoutManager = layoutManager

相信我,这会成功的。 在放置回收器视图的主 xml 文件中,复制我的代码。

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="@dimen/_50sdp"
        android:gravity="center">

        <androidx.recyclerview.widget.RecyclerView
            android:layout_width="wrap_content"
            android:layout_height="@dimen/_50sdp"/>

    </LinearLayout>