Android RelativeLayout上添加蒙层

一、前言

今天要做一个图片上的蒙层，返回按钮和下方的文字和按钮都在蒙层上

图片.png

二、解决方法：

1.代码

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".ui.activity.MasterClass.LoadingClassActivity">
    
    <RelativeLayout
        android:id="@+id/rl_background"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="@drawable/class_load"
        android:orientation="vertical"
        >
        
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:alpha="0.29"
            android:background="@color/color_FF000000"
            >
            <ImageView
                android:id="@+id/iv_back"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="@dimen/dp_15"
                android:layout_marginTop="@dimen/dp_15"
                android:src="@drawable/class_back" />


            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="@dimen/dp_40"
                android:layout_alignParentBottom="true"
                android:layout_marginBottom="@dimen/dp_80">

                <TextView
                    android:id="@+id/tv_title"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_centerHorizontal="true"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:text="大师课 第一节"
                    android:textColor="@color/qmui_config_color_white"
                    android:textSize="@dimen/sp_16" />

            </RelativeLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="@dimen/dp_40"
                android:layout_alignParentBottom="true"
                android:layout_marginBottom="@dimen/dp_50">


                <TextView
                    android:id="@+id/tv_time"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="bottom"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:text="90分钟"
                    android:textColor="@color/qmui_config_color_white"
                    android:textSize="@dimen/sp_16" />

                <TextView
                    android:id="@+id/tv_name"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="bottom"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:text="燕子"
                    android:textColor="@color/qmui_config_color_white"
                    android:textSize="@dimen/sp_16" />

                <TextView
                    android:id="@+id/tv_kcal"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="bottom"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:text="126千卡"
                    android:textColor="@color/qmui_config_color_white"
                    android:textSize="@dimen/sp_16" />
            </LinearLayout>


            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="@dimen/dp_50"
                android:layout_alignParentBottom="true">


                <TextView
                    android:id="@+id/tv_time_title"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_vertical"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:text="时长"
                    android:textColor="@color/qmui_config_color_white"
                    android:textSize="@dimen/sp_12" />

                <TextView
                    android:id="@+id/tv_name_title"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_vertical"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:text="教练"
                    android:textColor="@color/qmui_config_color_white"
                    android:textSize="@dimen/sp_12" />

                <TextView
                    android:id="@+id/tv_kcal_title"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_vertical"
                    android:layout_weight="1"
                    android:gravity="center"
                    android:text="燃脂"
                    android:textColor="@color/qmui_config_color_white"
                    android:textSize="@dimen/sp_12" />
            </LinearLayout>
        </RelativeLayout>
    </RelativeLayout>

    <TextView
        android:id="@+id/tv_start"
        android:layout_width="match_parent"
        android:layout_height="@dimen/dp_80"
        android:gravity="center"
        android:text="开始缓存课程"
        android:textColor="@color/color_FF666666"
        android:textSize="@dimen/sp_20" />
</LinearLayout>

2.解析：

<RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:alpha="0.29"
            android:background="@color/color_FF000000"
            >
...这是蒙层，蒙层上控件在这里写
</RelativeLayout>

主要是alpha设定透明度的值， android:alpha="0.29"。
设置背景色 android:background="@color/color_FF000000"。
Alpha值主要控制图像的透明度(0-1)，0代表透明。1代表不透明。

通过以上就可以完成蒙层效果。