1. 程式人生 > >安卓實現區域性介面遮罩效果

安卓實現區域性介面遮罩效果

背景

列表展示資料時,有些資料因為失效了,需要灰化展示。但是因為每一行資料裡面包含多個view(如包含使用者姓名、性別等等資訊),不方便對每個view進行灰化設定,所以需要一個遮罩層將整行遮蓋來達到灰化效果。大致效果如下:
image.png

解決方案

列表的item佈局採用RelativeLayout或者ConstraintLayout,在layout中增加一個空的view(遮罩層),剛好能蓋住其他view,預設設定為不可見。在adapter里根據資料的有效性設定是否開啟這層遮罩層。

帶遮罩的item佈局檔案樣例如下:
其中maskLayer為遮罩層view,如下幾點需要重點注意

  1. android:layout_height=“30dp” 這個高度要設定為固定的值,必須剛好和view原本高度相同,不能設定為wrap_content或match_parent。所以此方案不適用於item的高度不固定的情況。
  2. android:background="#80F9F9F9" 設定遮罩層的顏色,前兩位是透明度(00到FF,值越小越透明。)
  3. android:clickable="true"和android:focusable=“true” 是為了遮蔽點選事件,讓點選失效。
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/tv_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="8dp"
        android:textColor="@android:color/black"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="TextView" />

    <View
        android:id="@+id/maskLayer"
        android:layout_width="match_parent"
        android:layout_height="30dp"
        android:background="#80F9F9F9"
        android:clickable="true"
        android:focusable="true"
        android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

demo:

https://gitee.com/cxyzy1/mask_layer_demo

安卓開發技術分享: https://blog.csdn.net/yinxing2008/article/details/84555061