☰

RecyclerView でアイテム間に区切り線とスペースを追加する方法 質問する

tag-icon • tag-icon android android-recyclerview divider
RecyclerView でアイテム間に区切り線とスペースを追加する方法 質問する

これは、 dividerおよびdivisionrHeightパラメータListViewを使用して、クラス内で以前に実行できた方法の例です。

<ListView
    android:id="@+id/activity_home_list_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:divider="@android:color/transparent"
    android:dividerHeight="8dp"/>

しかし、私はそのクラスにそのような可能性を見いだせませんRecyclerView。

<android.support.v7.widget.RecyclerView
    android:id="@+id/activity_home_recycler_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scrollbars="vertical"/>

その場合、余白を定義したり、カスタム区切りビューをリスト項目のレイアウトに直接追加したりしても問題ありませんか、それとも目標を達成するためのより良い方法がありますか?

ベストアンサー1

2016年10月更新

Androidサポートライブラリのバージョン25.0.0では、DividerItemDecorationクラス：

DividerItemDecoration は、 のアイテム間の区切りとして使用できる RecyclerView.ItemDecoration ですLinearLayoutManager。HORIZONTALと の両方のVERTICAL方向をサポートします。

使用法：

DividerItemDecoration dividerItemDecoration = new DividerItemDecoration(recyclerView.getContext(),
    layoutManager.getOrientation());
recyclerView.addItemDecoration(dividerItemDecoration);

前の回答

いくつかの回答では、すでに廃止された方法が使用されていたり、完全な解決策が提供されていなかったりするため、短く最新の内容をまとめてみました。

とは異なりListView、RecyclerViewクラスには区切り線関連のパラメータはありません。代わりに、ItemDecoration、 aRecyclerViewの内部クラス:

を使用すると、ItemDecorationアプリケーションは、アダプタのデータ セットから特定のアイテム ビューに特別な描画とレイアウト オフセットを追加できます。これは、アイテム間の区切り線、ハイライト、視覚的なグループ化の境界などを描画する場合に役立ちます。

すべてはItemDecorations、追加された順序で、アイテム ビューの前 ( onDraw()) とアイテムの後 (onDrawOver( Canvas、RecyclerView、 )に描画されますRecyclerView.State)。

Vertical間隔ItemDecoration

を拡張し、スペースをパラメータとしてItemDecoration受け取るカスタム コンストラクターを追加して、メソッドをオーバーライドします。heightgetItemOffsets()

public class VerticalSpaceItemDecoration extends RecyclerView.ItemDecoration {

    private final int verticalSpaceHeight;

    public VerticalSpaceItemDecoration(int verticalSpaceHeight) {
        this.verticalSpaceHeight = verticalSpaceHeight;
    }

    @Override
    public void getItemOffsets(Rect outRect, View view, RecyclerView parent,
            RecyclerView.State state) {
        outRect.bottom = verticalSpaceHeight;
    }
}

最後の項目の下にスペースを挿入したくない場合は、次の条件を追加します。

if (parent.getChildAdapterPosition(view) != parent.getAdapter().getItemCount() - 1) {
            outRect.bottom = verticalSpaceHeight;
}

注:目的の効果を得るために、、および プロパティoutRect.topをoutRect.left変更することもできます。outRect.right

区切り線ItemDecoration

メソッドを拡張しItemDecorationてオーバーライドしますonDraw()。

public class DividerItemDecoration extends RecyclerView.ItemDecoration {

    private static final int[] ATTRS = new int[]{android.R.attr.listDivider};

    private Drawable divider;

    /**
     * Default divider will be used
     */
    public DividerItemDecoration(Context context) {
        final TypedArray styledAttributes = context.obtainStyledAttributes(ATTRS);
        divider = styledAttributes.getDrawable(0);
        styledAttributes.recycle();
    }

    /**
     * Custom divider will be used
     */
    public DividerItemDecoration(Context context, int resId) {
        divider = ContextCompat.getDrawable(context, resId);
    }

    @Override
    public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
        int left = parent.getPaddingLeft();
        int right = parent.getWidth() - parent.getPaddingRight();

        int childCount = parent.getChildCount();
        for (int i = 0; i < childCount; i++) {
            View child = parent.getChildAt(i);

            RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child.getLayoutParams();

            int top = child.getBottom() + params.bottomMargin;
            int bottom = top + divider.getIntrinsicHeight();

            divider.setBounds(left, top, right, bottom);
            divider.draw(c);
        }
    }
}

デフォルトの Android 区切り線属性を使用する最初のコンストラクターを呼び出すことも、独自の描画可能オブジェクト (例: drawable/divider.xml)を使用する 2 番目のコンストラクターを呼び出すこともできます。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">
    <size android:height="1dp" />
    <solid android:color="#ff992900" />
</shape>

注:アイテムの上に区切り線を描画したい場合は、onDrawOver()代わりにメソッドをオーバーライドします。

使用法

新しいクラスを使用するには、フラグメントの メソッドなどでVerticalSpaceItemDecorationまたはDividerSpaceItemDecorationを追加します。RecyclerViewonCreateView()

private static final int VERTICAL_ITEM_SPACE = 48;
private RecyclerView recyclerView;
private LinearLayoutManager linearLayoutManager;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
        Bundle savedInstanceState) {
    View rootView = inflater.inflate(R.layout.fragment_feed, container, false);

    recyclerView = (RecyclerView) rootView.findViewById(R.id.fragment_home_recycler_view);
    linearLayoutManager = new LinearLayoutManager(getActivity());
    recyclerView.setLayoutManager(linearLayoutManager);

    //add ItemDecoration
    recyclerView.addItemDecoration(new VerticalSpaceItemDecoration(VERTICAL_ITEM_SPACE));
    //or
    recyclerView.addItemDecoration(new DividerItemDecoration(getActivity()));
    //or
    recyclerView.addItemDecoration(
            new DividerItemDecoration(getActivity(), R.drawable.divider));

    recyclerView.setAdapter(...);

    return rootView;
}

また、ルーカス・ロシャの図書館これはアイテムの装飾プロセスを簡素化するはずです。ただし、試したことはありません。

その中でも特徴は：

  • 以下を含む在庫アイテムの装飾のコレクション:
  • アイテム間隔の水平/垂直の区切り線。
  • リスト項目

おすすめ記事