wake-up-neo.net

Android - RecyclerView-Abstand zwischen Elementen in einem Raster

In meiner Android-App verwende ich eine RecyclerView zur Anzeige von Elementen in einem Raster mithilfe einer GridLayoutManager. Um den Abstand zwischen Elementen festzulegen, würde ich in einer GridView die Eigenschaften horizontalSpacing und verticalSpacing festlegen.

Wie kann ich dasselbe bei einer RecyclerView tun?

14
Ernestina Juan

Ich habe es nicht mit einem GridLayout getestet, aber für ein LinearLayout habe ich einfach einen Rand für das Root-Layout jedes Listenelements festgelegt. Ich denke, wenn Sie den gleichen Abstand zwischen allen Elementen wünschen (sagen wir 8dp), müssten Sie Folgendes tun:

  1. Legen Sie layout_padding 4 dp für RecyclerView fest.
  2. Legen Sie layout_margin 4 dp für jedes Listenelement fest.

Auf diese Weise hätten Sie konstant 8 dp um jedes Element.


Der folgende Code ist eine horizontale RecyclerView, die Bilder mit einem korrekten Abstand von 8 dp anzeigt:

<!-- fragment_layout.xml -->
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    xmlns:tools="http://schemas.Android.com/tools"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:padding="4dp">

    <Android.support.v7.widget.RecyclerView
        Android:id="@+id/recycler_view"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:orientation="horizontal"
        app:layoutManager="Android.support.v7.widget.LinearLayoutManager"
        tools:listitem="@layout/list_item" />

</LinearLayout>

<!-- list_item.xml -->
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content" 
    Android:layout_margin="4dp">

    <ImageView
        Android:layout_width="@dimen/thumbnail_size"
        Android:layout_height="@dimen/thumbnail_size"
        Android:contentDescription="@string/image_content_desc" />

</LinearLayout>

BEARBEITEN: Ich habe festgestellt, dass die Elementansicht eine übergeordnete ViewGroup haben muss, daher wurde das Snippet aktualisiert.

15
josemigallas

sie müssen dafür einen ItemDecorator verwenden:

so was:

public class EqualSpaceItemDecoration extends RecyclerView.ItemDecoration {

private final int mSpaceHeight;

public EqualSpaceItemDecoration(int mSpaceHeight) {
    this.mSpaceHeight = mSpaceHeight;
}

@Override
public void getItemOffsets(Rect outRect, View view, RecyclerView parent,
        RecyclerView.State state) {
    outRect.bottom = mSpaceHeight;
outRect.top = mSpaceHeight;
outRect.left = mSpaceHeight;
outRect.right = mSpaceHeight;
}
4
Cold Fire
public class EqualSpaceItemDecoration extends RecyclerView.ItemDecoration {

private final int mSpaceHeight;

public EqualSpaceItemDecoration(int mSpaceHeight) {
    this.mSpaceHeight = mSpaceHeight;
}

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

Die obige Antwort erzeugt ungleiche Randbreiten, wenn sich die Bilder treffen.

Die untenstehende Lösung erzeugt gleichmäßige Margen 


 public void getItemOffsets (Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {        
        int position= parent.getChildAdapterPosition (view);
        int column = position% numberOfColumns;       
            outRect.left= margin-column*spacingPx/numberOfColumns;
            outRect.right= (column+1)* margin/numberOfColumns;
            outRect.top= margin;           

        }

    }
0
Thejashwini Dev