RecyclerView中的Android中心项目

时间:2015-03-18 09:10:23

标签: java android android-recyclerview

我是android的新手。我不知道为什么我不能将我的物品放在RecyclerView中。

我想要的就像下图: -

Actual

图片下方的android呈现方式如下: -

Reality

有没有办法将RecyclerView中的项目推送到中心?所以它看起来像这样: -

i want like this

我还提供如下布局文件: -

recycler_item.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content" android:layout_height="wrap_content"
    android:id="@+id/calendar_itemContainer">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="April"
        android:id="@+id/calendar_txtMonth"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:textColor="#ff58636d"
        android:textSize="16sp"
        android:gravity="center|center_vertical|center_horizontal"
        android:paddingTop="8dp"
        android:paddingLeft="12dp"
        android:paddingRight="12dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="21"
        android:id="@+id/calendar_txtDay"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_below="@+id/calendar_txtMonth"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:textColor="#ff58636d"
        android:textSize="40sp"
        android:layout_marginTop="-10dp"
        android:paddingLeft="10dp"
        android:paddingRight="10dp"
        android:paddingBottom="5dp"
        android:gravity="center|center_vertical|center_horizontal" />
</RelativeLayout>

fragment_calendar.xml

<?xml version="1.0" encoding="utf-8"?>
<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.support.v7.widget.RecyclerView
        android:id="@+id/calendar_recycler_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:scrollbars="horizontal"
        android:background="#ff2c3e50" />
</RelativeLayout>

和java代码: -

CalendarAdapter mAdapter = new CalendarAdapter(mDataset);
mLayoutManager = new LinearLayoutManager(getActivity(), LinearLayoutManager.HORIZONTAL, false);
mRecyclerView.setLayoutManager(mLayoutManager);
mAdapter.setCalendarCallbacks(this);
mRecyclerView.setAdapter(mAdapter);
mRecyclerView.setItemAnimator(new DefaultItemAnimator());
selectItem(mCurrentSelectedPosition);

9 个答案:

答案 0 :(得分:18)

当我遇到这篇文章时,我试图做我认为是你所问的同样的事情。这是我最终使用的解决方案。

创建自己的LinearLayoutManager子类并覆盖getPaddingLeft()和getPaddingRight(),如下所示。

public class CustomLayoutManager extends LinearLayoutManager {
    private int mParentWidth;
    private int mItemWidth;

    public CustomLayoutManager(Context context, int parentWidth, int itemWidth) {
        super(context);
        mParentWidth = parentWidth;
        mItemWidth = itemWidth;
    }

    @Override
    public int getPaddingLeft() {
        return Math.round(mParentWidth / 2f - mItemWidth / 2f);
    }

    @Override
    public int getPaddingRight() {
        return getPaddingLeft();
    }
}

parentWidth应该是RecyclerView的宽度,itemWidth应该是每个子视图的宽度,以像素为单位。显然,这只有在您知道所有子视图宽度相同的情况下才有效。

然后,只需将此布局管理器与RecyclerView

一起使用即可

答案 1 :(得分:14)

将recyclerview设置为:

android:layout_width="wrap_content"
android:layout_gravity="center_horizontal"

为我修好了

答案 2 :(得分:5)

@majormajors答案很接近,但会以列表中第一项为中心开始,而不是像图片中所示那样将项目(整体)居中。需要进行额外的计算以检查项目总宽度。我修改了@majormajors发布的代码。

public class CenterItemLayoutManager extends LinearLayoutManager {
  private final int parentWidth;
  private final int itemWidth;
  private final int numItems;

  public CenterItemLayoutManager(
      final Context context,
      final int orientation,
      final int parentWidth,
      final int itemWidth,
      final int numItems) {
    super(context, orientation, false);
    this.parentWidth = parentWidth;
    this.itemWidth = itemWidth;
    this.numItems = numItems;
  }

  @Override
  public int getPaddingLeft() {
    final int totalItemWidth = itemWidth * numItems;
    if (totalItemWidth >= parentWidth) {
      return super.getPaddingLeft(); // do nothing
    } else {
      return Math.round(parentWidth / 2f - totalItemWidth / 2f);
    }
  }

  @Override
  public int getPaddingRight() {
    return getPaddingLeft();
  }
}

在这种情况下,只有当项目不超过recyclerview的宽度时才会居中...否则它将按照正常情况运作。

答案 3 :(得分:4)

随着新类添加到支持库中,简单易行 -    android.support.v7.widget.LinearSnapHelper

只需创建一个实例并将其附加到recyclerView,如下所示 -

LinearSnapHelper snapHelper  = new LinearSnapHelper();
snapHelper.attachToRecyclerView(recyclerView);

答案 4 :(得分:2)

这对我有用:

    LinearSnapHelper snapHelper = new LinearSnapHelper();
    snapHelper.attachToRecyclerView(mRecyclerView);

    //This is used to center first and last item on screen
    mRecyclerView.addItemDecoration(new RecyclerView.ItemDecoration() {
        @Override
        public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
            int position = parent.getChildViewHolder(view).getAdapterPosition();

            if (position == 0 || position == state.getItemCount() - 1) {

                int elementWidth = (int)getResources().getDimension(R.dimen.list_element_width);
                int elementMargin = (int)getResources().getDimension(R.dimen.list_element_margin);

                int padding = Resources.getSystem().getDisplayMetrics().widthPixels / 2 - elementWidth - elementMargin/2;

                if (position == 0) {
                    outRect.left = padding;

                } else {
                    outRect.right = padding;
                }
            }
        }
    });

在我的xml布局中使用的dimens.xml文件中,元素elementWidth和elementMargin是固定值:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="@dimen/list_element_margin"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:layout_margin="@dimen/list_element_width">
    <TextView
        android:id="@+id/day_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>
</LinearLayout>

答案 5 :(得分:1)

刚刚将android:orientation="vertical"添加到项目视图的根目录中。我们来试试吧。

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                  android:layout_width="match_parent"
                  android:layout_height="180dp"
                  android:orientation="vertical"
                  android:padding="4dp">

        <ImageView
            android:id="@+id/movie_column_photo"
            android:layout_width="80dp"
            android:layout_height="120dp"
            android:layout_gravity="center_horizontal"/>

        <TextView
            android:id="@+id/movie_column_title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"/>
    </LinearLayout>

答案 6 :(得分:1)

您需要将父级“相对布局重力”设置为“ center_horizo​​ntal”。 并且还要在RelativeLayout下设置Recylerview center_horizo​​ntal的layout_gravity。 像这样:

@media only screen and (min-width: 64rem)
 .toc-container {
 display: none;
}
 .toc-container {
 display: -webkit-box;
 display: flex;
 -webkit-box-align: right;
 align-items: left;
}

@media screen and (min-width: 768px) 
.tiktoc {
 display: none;
 }

 .tiktoc {
 position: absolute;
 top: 165px;
 left: 1150px;
 bottom: 0;
 width: 350px;
 margin-bottom: 0;
 }

答案 7 :(得分:1)

使选中的项目位于屏幕中央的最佳方式是应用

<块引用>

paddingHorizontalrecyclerView。赋予 paddingHorizontal 值,使您的项目居中,然后添加 clipToPadding = false

<块引用>

之后,当您选择 recyclerView 项时,请使用 recyclerView.smoothScrollToPosition(pos)。它会将您的项目滚动到该位置

现在您选择的项目在屏幕中央可见!

答案 8 :(得分:0)

在装饰器下面添加到回收者视图;

class CenterAlignDecorator : RecyclerView.ItemDecoration() {
    override fun getItemOffsets(outRect: Rect, view: View, parent: RecyclerView, state: RecyclerView.State) {
        parent.adapter?.let {
            if (parent.getChildAdapterPosition(view) == 0 && view.width > 0) {
                val itemSize = view.width + view.paddingStart + view.paddingEnd
                val itemLimit = (parent.width / itemSize) + 1
                if (state.itemCount <= itemLimit) {
                    val padding = (parent.width - (it.itemCount * itemSize)) / 2
                    outRect.set(padding, 0, 0, 0)
                }
            } else {
                outRect.set(0, 0, 0, 0)
            }
        }
    }
}