Aplicar offset a elementos GridLayout y conservar el mismo tamaño entre todos los elementos

Quiero crear un espacio entre los elementos de la cuadrícula. Todos los artículos deben tener igual anchura / altura.

Lo que he intentado:

Cree un GridLayoutOffsetDecorator que aplique un desplazamiento a todos los elementos de la cuadrícula:

 class GridLayoutOffsetDecorator(var offset: Int) : RecyclerView.ItemDecoration() { override fun getItemOffsets( outRect: Rect, view: View, parent: RecyclerView, state: RecyclerView.State?) { super.getItemOffsets(outRect, view, parent, state) outRect.set(offset, offset, offset, offset) } } 

Tener un desplazamiento de 8dp crea un espacio de 16dp entre los elementos. Así que todavía tenemos que aplicar 8dp de relleno a los bordes exteriores:

 <android.support.v7.widget.RecyclerView android:id="@+id/productList" android:layout_width="match_parent" android:layout_height="match_parent" android:clipToPadding="false" android:padding="8dp" /> 

El resultado es:

Introduzca aquí la descripción de la imagen

Problema: los elementos no son iguales en tamaño:

Introduzca aquí la descripción de la imagen

Observa una ligera diferencia de altura cuando miras la línea azul. Esta diferencia aparece sólo después de rellenar la vista de reciclaje. Este relleno parece cambiar ligeramente el tamaño de algunos de los elementos. ¿Tienen ustedes alguna experiencia con este problema? ¿Alguna idea de cómo se puede resolver esto?


Al eliminar la imagen de los elementos, la diferencia de altura desaparece. Así se establece la imagen:

 <SquareImageView android:id="@+id/image" android:layout_width="match_parent" android:layout_height="wrap_content" android:scaleType="centerCrop" app:imageResource="@{product.image}" /> 

SquareImageView:

 class SquareImageView : ImageView { constructor(context: Context) : super(context) constructor(context: Context, attributeSet: AttributeSet) : super(context, attributeSet) constructor(context: Context, attributeSet: AttributeSet, defStyleAttr: Int) : super(context, attributeSet, defStyleAttr) override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) { super.onMeasure(widthMeasureSpec, widthMeasureSpec) } } 

Así que el problema puede ser causado por la propia imagen.

2 Solutions collect form web for “Aplicar offset a elementos GridLayout y conservar el mismo tamaño entre todos los elementos”

Tuve el mismo problema al trabajar con GridLayoutManager . Resuelto por el ajuste de ancho y altura de la imagen en el adaptador. Aquí está mi solución, espero que ayude.

Así es como puse ImageView en mi diseño.

 <LinearLayout android:id="@+id/layoutImageProduct" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" tools:minHeight="100dp" tools:minWidth="150dp"> <ImageView android:id="@+id/imageProduct" android:layout_width="wrap_content" android:layout_height="wrap_content" android:scaleType="fitCenter" android:src="@drawable/placeholder_product"/> </LinearLayout> 

Y luego aplicar LayoutParams en el diseño de los padres y ImageView

 //Setting View width/height LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) holder.layoutImageProduct.getLayoutParams(); params.width = (int) ResourcesUtils.getColumnWidth(context); params.height = ((int) (ResourcesUtils.getColumnWidth(context))); holder.layoutImageProduct.setLayoutParams(params); params = (LinearLayout.LayoutParams) holder.imageProduct.getLayoutParams(); params.width = (int) ResourcesUtils.getColumnWidth(context); params.height = (int) ResourcesUtils.getColumnWidth(context); holder.imageProduct.setLayoutParams(params); 

Este es el método getWidth.

 public static float getColumnWidth(Context context) { if (GRID_COLUMN_WIDTH == -1) { int screenWidth = getDisplayMetrics(context).widthPixels; float horizontalPadding = getDimensInPixel(context, R.dimen.activity_horizontal_margin); // NUM OF COLUMN = 2 GRID_COLUMN_WIDTH = screenWidth / 2 - horizontalPadding * 2; } return GRID_COLUMN_WIDTH; } 

Vea la captura de pantalla, una con marcador de posición y otra con imagen. Una con marcador de posición y otra con imagen.

¿Puedes intentar con la altura de la imagen como fijo.

  • Problema de desplazamiento Infinito Infinito de RecyclerView
  • Fragmento con RecyclerView: java.lang.IllegalArgumentException: Las vistas desechadas o adjuntas no se pueden reciclar. IsScrap: false isAttached: true
  • RecyclerView está cortando el último elemento
  • Android - Implementación del filtro de búsqueda en un RecyclerView
  • Pasar la posición en el ListView al niño RecyclerView Adapter
  • ¿Cómo puedo añadir un RecyclerView horizontal dentro de un elemento de lista
  • Tipos incompatibles: no se puede emitir el visor a imageviewholder
  • Cómo implementar filtrado en RealmRecyclerViewAdapter
  • Evento de toque de la manija para los artículos dentro de Recyclerview - android
  • NotifyDataSetChanged no funciona en RecyclerView
  • Recyclerview + Proveedor de contenido + CursorLoader
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.