web-dev-qa-db-fra.com

Marge entre les éléments de la vue recycleur Android

Bonjour, je suis ce tutoriel

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

Maintenant, je suis confronté à un problème étrange: la marge entre chaque élément de Cardview dans la vue Recycler est beaucoup trop.

ISSUE

Comment réduire la marge entre chaque élément de cardview placé dans la vue du recycleur.

enter image description here

41
Tushar Narang

J'ai rencontré un problème similaire, avec RelativeLayout en tant qu'élément racine pour chaque ligne de la vue recyclée.

Pour résoudre le problème, recherchez le fichier XML contenant chaque ligne et assurez-vous que la hauteur de l'élément racine est wrap_content NOT match_parent.

83
Maher Nabil

J'ai fait un cours pour gérer ce problème. Cette classe définit des marges différentes pour les éléments à l'intérieur de recyclerView: seule la première ligne aura une marge supérieure et seule la première colonne aura une marge gauche.

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;
        }
    }
}

vous pouvez le définir dans votre recyclerview de cette façon

 RecyclerViewMargin decoration = new RecyclerViewMargin(itemMargin, numColumns);
 recyclerView.addItemDecoration(decoration);
33
Victor
  1. Recherchez l'attribut card_view:cardUseCompatPadding="true" dans cards_layout.xml et supprimez-le. Lancez l'application et vous constaterez qu'il n'y a pas de marge entre chaque élément de cardview.

  2. Ajoutez les attributs de marge que vous aimez. Ex:

    Android:layout_marginTop="5dp"
    Android:layout_marginBottom="5dp" 
    
28
Jing

Au lieu d'utiliser XML pour ajouter une marge entre les éléments de RecyclerView, il est préférable d'utiliser RecyclerView.ItemDecoration qui fournit un cadre Android.

Donc, je crée une bibliothèque pour résoudre ce problème.

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

enter image description here

4
The Khaeng

Utilisez CardView dans la présentation d'éléments de Recyclerview comme ceci:

 <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">
2

Utiliser CompatPadding dans un élément CardView

2

Si vous voulez le faire dans XML, ajustez paddingTopet paddingLeft à votre RecyclerView et un nombre égal de layoutMarginBottom et layoutMarginRight à l'élément que vous gonflez dans votre RecyclerView (ou inversement).

1
Vlad

changement dans la vue Recycler match_parent à wrap_content:

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

Changement également dans la disposition des éléments xml

Définit la hauteur de la présentation parent match_parent à 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"
    />
0
mohit
0
Tarek360