Android
RecyclerView Decoraciones
Buscar..
Sintaxis
- RecyclerView addItemDecoration (RecyclerView.ItemDecoration decoration)
- RecyclerView addItemDecoration (RecyclerView.ItemDecoration decoration, int index)
Parámetros
Parámetro | Detalles |
---|---|
decoración | la decoración del artículo para agregar al RecyclerView |
índice | El índice en la lista de decoraciones para este RecyclerView . Este es el orden en el que se getItemOffset y onDraw . Las llamadas posteriores pueden sobregirar las anteriores. |
Observaciones
Las decoraciones son estáticas.
Dado que las decoraciones solo se dibujan, no es posible agregarles escuchas de clics u otra funcionalidad de UI.
Decoraciones multiples
La adición de múltiples decoraciones a un RecyclerView
funcionará en algunos casos, pero actualmente no existe una API pública que tenga en cuenta otras decoraciones posibles al medir o dibujar. Puede obtener los límites de vista o los límites decorados de vista, donde los límites decorados son la suma de todas las compensaciones de decoración aplicadas.
Otros temas relacionados:
RecyclerView
RecyclerView onClickListeners
Oficial javadoc
https://developer.android.com/reference/android/support/v7/widget/RecyclerView.ItemDecoration.html
Dibujando un separador
Esto dibujará una línea en la parte inferior de cada vista, pero la última en actuar como un separador entre los elementos.
public class SeparatorDecoration extends RecyclerView.ItemDecoration {
private final Paint mPaint;
private final int mAlpha;
public SeparatorDecoration(@ColorInt int color, float width) {
mPaint = new Paint();
mPaint.setColor(color);
mPaint.setStrokeWidth(width);
mAlpha = mPaint.getAlpha();
}
@Override
public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
final RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) view.getLayoutParams();
// we retrieve the position in the list
final int position = params.getViewAdapterPosition();
// add space for the separator to the bottom of every view but the last one
if (position < state.getItemCount()) {
outRect.set(0, 0, 0, (int) mPaint.getStrokeWidth()); // left, top, right, bottom
} else {
outRect.setEmpty(); // 0, 0, 0, 0
}
}
@Override
public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
// a line will draw half its size to top and bottom,
// hence the offset to place it correctly
final int offset = (int) (mPaint.getStrokeWidth() / 2);
// this will iterate over every visible view
for (int i = 0; i < parent.getChildCount(); i++) {
final View view = parent.getChildAt(i);
final RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) view.getLayoutParams();
// get the position
final int position = params.getViewAdapterPosition();
// and finally draw the separator
if (position < state.getItemCount()) {
// apply alpha to support animations
mPaint.setAlpha((int) (view.getAlpha() * mAlpha));
float positionY = view.getBottom() + offset + view.getTranslationY();
// do the drawing
c.drawLine(view.getLeft() + view.getTranslationX(),
positionY,
view.getRight() + view.getTranslationX(),
positionY,
mPaint);
}
}
}
}
Márgenes por artículo con ItemDecoration
Puede usar un RecyclerView.ItemDecoration
para colocar márgenes adicionales alrededor de cada elemento en un RecyclerView. En algunos casos, esto puede limpiar tanto la implementación del adaptador como la vista de elementos XML.
public class MyItemDecoration
extends RecyclerView.ItemDecoration {
private final int extraMargin;
@Override
public void getItemOffsets(Rect outRect, View view,
RecyclerView parent, RecyclerView.State state) {
int position = parent.getChildAdapterPosition(view);
// It's easy to put extra margin on the last item...
if (position + 1 == parent.getAdapter().getItemCount()) {
outRect.bottom = extraMargin; // unit is px
}
// ...or you could give each item in the RecyclerView different
// margins based on its position...
if (position % 2 == 0) {
outRect.right = extraMargin;
} else {
outRect.left = extraMargin;
}
// ...or based on some property of the item itself
MyListItem item = parent.getAdapter().getItem(position);
if (item.isFirstItemInSection()) {
outRect.top = extraMargin;
}
}
public MyItemDecoration(Context context) {
extraMargin = context.getResources()
.getDimensionPixelOffset(R.dimen.extra_margin);
}
}
Para habilitar la decoración, simplemente agrégala a tu RecyclerView:
// in your onCreate()
RecyclerView rv = (RecyclerView) findItemById(R.id.myList);
rv.addItemDecoration(new MyItemDecoration(context));
Añadir divisor a RecyclerView
En primer lugar, debe crear una clase que amplíe RecyclerView.ItemDecoration
:
public class SimpleBlueDivider extends RecyclerView.ItemDecoration {
private Drawable mDivider;
public SimpleBlueDivider(Context context) {
mDivider = context.getResources().getDrawable(R.drawable.divider_blue);
}
@Override
public void onDrawOver(Canvas c, RecyclerView parent, RecyclerView.State state) {
//divider padding give some padding whatever u want or disable
int left =parent.getPaddingLeft()+80;
int right = parent.getWidth() - parent.getPaddingRight()-30;
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 + mDivider.getIntrinsicHeight();
mDivider.setBounds(left, top, right, bottom);
mDivider.draw(c);
}
}
}
Agregue divider_blue.xml
a su carpeta divider_blue.xml
:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<size android:width="1dp" android:height="4dp" />
<solid android:color="#AA123456" />
</shape>
Entonces úsalo como:
recyclerView.addItemDecoration(new SimpleBlueDivider(context));
El resultado será como:
Esta imagen es solo un ejemplo de cómo funcionan los separadores. Si desea seguir las especificaciones de Diseño de materiales al agregar separadores, eche un vistazo a este enlace: separadores y gracias a @Brenden Kromhout al proporcionar el enlace.
Cómo agregar divisores usando y DividerItemDecoration
DividerItemDecoration
es un RecyclerView.ItemDecoration
que se puede usar como divisor entre los elementos.
DividerItemDecoration mDividerItemDecoration = new DividerItemDecoration(context,
mLayoutManager.getOrientation());
recyclerView.addItemDecoration(mDividerItemDecoration);
Admite ambas orientaciones usando DividerItemDecoration.VERTICAL
y DividerItemDecoration.HORIZONTAL
.
ItemOffsetDecoration para GridLayoutManager en RecycleView
El siguiente ejemplo ayudará a dar el mismo espacio a un elemento en GridLayout.
ItemOffsetDecoration.java
public class ItemOffsetDecoration extends RecyclerView.ItemDecoration {
private int mItemOffset;
private int spanCount = 2;
public ItemOffsetDecoration(int itemOffset) {
mItemOffset = itemOffset;
}
public ItemOffsetDecoration(@NonNull Context context, @DimenRes int itemOffsetId) {
this(context.getResources().getDimensionPixelSize(itemOffsetId));
}
@Override
public void getItemOffsets(Rect outRect, View view, RecyclerView parent,
RecyclerView.State state) {
super.getItemOffsets(outRect, view, parent, state);
int position = parent.getChildLayoutPosition(view);
GridLayoutManager manager = (GridLayoutManager) parent.getLayoutManager();
if (position < manager.getSpanCount())
outRect.top = mItemOffset;
if (position % 2 != 0) {
outRect.right = mItemOffset;
}
outRect.left = mItemOffset;
outRect.bottom = mItemOffset;
}
}
Puede llamar a ItemDecoration como el código de abajo.
recyclerView = (RecyclerView) view.findViewById(R.id.recycler_view);
GridLayoutManager lLayout = new GridLayoutManager(getActivity(), 2);
ItemOffsetDecoration itemDecoration = new ItemOffsetDecoration(mActivity, R.dimen.item_offset);
recyclerView.addItemDecoration(itemDecoration);
recyclerView.setLayoutManager(lLayout);
y ejemplo de desplazamiento de elemento
<dimen name="item_offset">5dp</dimen>