如何制作覆盖 recyclerView 的背景?

How can I make a background overlaying the recyclerView?

我有一个水平的图像回收视图。我想设置一个覆盖recyclerView的背景颜色。

我想:

我用 xml 代码制作:

我已将视图添加到 RecyclerView 区域。背景颜色给了它。我在代码中这样写的时候,背景色在recyclerView下面:

渐变背景:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <gradient
        android:angle="0"
        android:centerColor="#f1f1f1"
        android:endColor="#FFF8F8F6"
        android:startColor="@color/white" />

</shape>

xml布局:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

 <androidx.appcompat.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:layout_alignParentTop="true"
        android:background="@color/colorAccent" />

    <FrameLayout
        android:id="@+id/fragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@+id/bottomView"
        android:layout_margin="5dp"
        android:layout_below="@+id/toolbar"
        android:layout_gravity="bottom" />

        <View
        android:id="@+id/bottomView"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_alignStart="@+id/images"
        android:layout_alignLeft="@+id/images"
        android:layout_alignTop="@+id/images"
        android:layout_alignEnd="@+id/images"
        android:layout_alignRight="@+id/images"
        android:layout_alignBottom="@+id/images"
        android:layout_alignParentBottom="true"
        android:background="@drawable/gradient_white"  />

        <ImageView
            android:id="@+id/sendButton"
            android:layout_width="55dp"
            android:layout_height="55dp"
            android:layout_alignParentBottom="true"
            android:layout_alignParentEnd="true"
            android:layout_alignParentRight="true"
            android:adjustViewBounds="true"
            android:contentDescription="@null"
            android:elevation="5dp"
            android:gravity="center"
            android:padding="14dp"
            android:scaleType="center"
            app:srcCompat="@drawable/ic_baseline_send_24" />

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/images"
            android:layout_width="match_parent"
            android:layout_height="110dp"
            android:layout_gravity="bottom"
            android:layout_marginStart="5dp"
            android:layout_marginLeft="5dp"
            android:layout_alignParentBottom="true"
            android:layout_marginEnd="5dp"
            android:layout_marginRight="5dp"
            android:layout_marginBottom="10dp" />
</RelativeLayout>

首先重新排列您的 View 的顺序 - 首先应该是 RecyclerView,然后覆盖背景,然后发送图标。放置在 XML 中的 View 是按声明顺序绘制的,在您的情况下将它们视为图层(以及将来:注意 translationZelevation XML属性)

并放置覆盖“背景”View(实际上这是前景,“上方”RecyclerView)使用此:

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/images" ....

<View
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:background="#80FFFFFF"
    android:layout_alignBottom="@id/images"
    android:layout_alignTop="@id/images"
    android:layout_alignLeft="@id/images"
    android:layout_alignRight="@id/images"/>

<ImageView
    android:id="@+id/sendButton" ...

"covering" View 可能有 0dp 大小以获得更好的测量性能,仍然所有 android:layout_align... 声明使其拉伸到 RecyclerView 的大小(以及以后-声明此 View 将在 RecyclerView 之后绘制,因此在其之上)

只需调整您的 android:background,使用一些 gradient drawable with transparency

编辑:渐变可绘制文件(放在drawable文件夹中)

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
    android:startColor="#00ffffff"
    android:centerColor="#00ffffff"
    android:centerY="80%"
    android:endColor="#fff"
    android:angle="0"
    android:dither="true"/>
</shape>

设置为

android:background="@drawable/your_file_name_of_above_shape"