recyclerview - Margen entre elementos en la vista de reciclador Android

recyclerview android studio ejemplo

Question

Hola, estoy siguiendo este tutorial

http://www.journaldev.com/10024/android-recyclerview-and-cardview-example-tutorial

Ahora me estoy enfrentando a un problema extraño: el margen entre cada elemento de vista de tarjeta dentro de la vista de reciclador es demasiado.

PROBLEMA

Cómo reducir el margen entre cada elemento de cardview colocado dentro de la vista de reciclador.

Answer 1

1. Encuentre el atributo card_view:cardUseCompatPadding="true" en cards_layout.xml y elimínelo. Inicie la aplicación y verá que no hay margen entre cada elemento de la vista de tarjeta.

2. Agrega atributos de margen que te gusten. Ex:

   android:layout_marginTop="5dp"
   android:layout_marginBottom="5dp" 

Answer 2

En lugar de usar XML para agregar margen entre los elementos en RecyclerView, es una mejor manera de usar RecyclerView.ItemDecoration que proporciona el marco de android.

Entonces, creo una biblioteca para resolver este problema.

https://github.com/TheKhaeng/recycler-view-margin-decoration

enter image description here

Answer 3

Hice una clase para gestionar este problema. Esta clase establece márgenes diferentes para los artículos dentro del recyclerView: solo la primera fila tendrá un margen superior y solo la primera columna tendrá margen izquierdo.

public class RecyclerViewMargin extends RecyclerView.ItemDecoration {
private final int columns;
private int margin;

/**
 * constructor
 * @param margin desirable margin size in px between the views in the recyclerView
 * @param columns number of columns of the RecyclerView
 */
public RecyclerViewMargin(@IntRange(from=0)int margin ,@IntRange(from=0) int columns ) {
    this.margin = margin;
    this.columns=columns;

}

/**
 * Set different margins for the items inside the recyclerView: no top margin for the first row
 * and no left margin for the first column.
 */
@Override
public void getItemOffsets(Rect outRect, View view,
                           RecyclerView parent, RecyclerView.State state) {

    int position = parent.getChildLayoutPosition(view);
    //set right margin to all
    outRect.right = margin;
    //set bottom margin to all
    outRect.bottom = margin;
    //we only add top margin to the first row
    if (position <columns) {
        outRect.top = margin;
    }
    //add left margin only to the first column
    if(position%columns==0){
        outRect.left = margin;
    }
}

}

puede configurarlo en su vista de reciclador de esta manera

 RecyclerViewMargin decoration = new RecyclerViewMargin(itemMargin, numColumns);
 recyclerView.addItemDecoration(decoration);

Answer 4

Intenta agregar RecyclerView.ItemDecoration

Para saber cómo hacer eso: ¿Cómo agregar divisores y espacios entre los elementos en RecyclerView?

Answer 5

Me enfrenté a un problema similar, con RelativeLayout como elemento raíz para cada fila en la vista de reciclador.

Para resolver el problema, busque el archivo xml que contiene cada fila y asegúrese de que la altura del elemento raíz sea wrap_content NOT match_parent .

Answer 6

Si quieres hacerlo en XML , jus establece paddingTop y paddingLeft en tu RecyclerView y la misma cantidad de layoutMarginBottom y layoutMarginRight en el elemento que inflas en tu RecyclerView (o viceversa).

Answer 7

Use CardView en Recyclerview Disposición de elementos de la siguiente manera:

 <android.support.v7.widget.CardView
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:card_view="http://schemas.android.com/tools"
        card_view:cardCornerRadius="10dp"
        app:cardBackgroundColor="#ACACAC"
        card_view:cardElevation="5dp"
        app:contentPadding="10dp"
        card_view:cardUseCompatPadding="true">

Answer 8

cambio en la vista Recycler match_parent para wrap_content :

<android.support.v7.widget.RecyclerView
    android:id="@+id/recycleView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

Cambia también en el diseño del elemento xml

Establecer la altura de diseño principal match_parent para wrap_content

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
    />