I'm trying to display a shadow under items of a RecyclerView but there is no space between items.
I'm trying to reproduce something like that :
I've implemented a RecyclerView and a FlexboxLayout so items takes the whole place in the screen.
Here is the recycler view declaration:
<android.support.v7.widget.RecyclerView
android:id="@+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:listitem="@layout/category_item"
android:clipToPadding="false"
android:paddingEnd="20dp"
android:paddingBottom="20dp"/>
Here is the item layout :
<?xml version="1.0" encoding="utf-8"?>
<com.google.android.flexbox.FlexboxLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/itemContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:justifyContent="center"
android:elevation="8dp"
>
<TextView
android:id="@+id/itemTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawablePadding="20dp"
android:gravity="center"
android:textSize="16sp" />
</com.google.android.flexbox.FlexboxLayout>
And the onBindViewHolder
method from the adapter:
@Override
public void onBindViewHolder(final CategoryViewHolder holder, int position) {
if (categories != null) {
Category category = categories.get(position);
holder.itemTitle.setText("Lorem ipsum");
ViewGroup.LayoutParams lp = holder.itemContainer.getLayoutParams();
holder.itemContainer.setBackgroundResource(category.getColor());
if (lp instanceof FlexboxLayoutManager.LayoutParams) {
FlexboxLayoutManager.LayoutParams flexboxLp =
(FlexboxLayoutManager.LayoutParams) holder.itemContainer.getLayoutParams();
flexboxLp.setFlexGrow(1.0f);
}
}
}
Here is what i get:
As you can see, i put a padding so we can see the shadow behind but since there is no space between items, the shadow isn't displayed. I'd like the shadow to be displayed on top of other items.
I don't know how to make a good looking separation between items otherwise, i've tried with DividerItemDecoration
but it doesn't work as expected.
I found a solution here : https://stackoverflow.com/a/35406689/9434800
I've created a gradient resource:
<shape xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:angle="90"
android:centerColor="@color/c1"
android:centerY="90%"
android:endColor="@color/c1_darker"
android:startColor="@color/c1"
android:type="linear" />
</shape>
And i set it as background of my item, this way the top of my items are darker and it seems like it's the shadow of items above them.