最近做项目，产品和UI出的一个效果图是这样的：有一个产品列表，可以购买的正常显示，已售罄的产品item被灰掉（即：看起来像是被盖上一层半透明的蒙版）。
其实要实现这个效果，想一想也不难。
基本思路：
1、ListView的每个item是一个单独的布局，给这个布局设置前景色来实现。
一般都是用LinearLayout、RelativeLayout实现，那么这两种布局有设置背景色（background）的属性，那有没有设置前景色（foreground）的属性呢？最终发现，这两种布局没有设置前景色的属性。
2、item的原始布局设置前景色走不通，就需要在原始布局上加一层新布局，且此新布局的width、height需和原始布局的width、height一致。此时，大家都会想到FrameLayout，对，没错，就是它，并且发现FrameLayout是有设置前景色（foreground）属性的。
到此，这个问题就可以实现了。
这里贴上item最终的布局：
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout android:id="@+id/fl_item"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:foreground="@color/transparent">
<LinearLayout android:id="@+id/head_contentLayout"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="vertical">
<View
android:layout_width="fill_parent"
android:layout_height="1px"
android:layout_marginTop="@dimen/dp_10"
android:background="@drawable/separation_line"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="@color/white"
android:gravity="center_vertical"
android:orientation="horizontal">
<TextView
android:id="@+id/tv_type"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:background="@drawable/img_invest_paper"
android:gravity="center"
android:paddingBottom="2dp"
android:paddingLeft="3dp"
android:paddingRight="3dp"
android:paddingTop="2dp"
android:text="@string/txt_invest_paper"
android:textColor="@color/white"
android:textSize="@dimen/sp_13"
android:visibility="gone"/>
<TextView
android:id="@+id/tv_title"
android:layout_width="1dp"
android:layout_height="wrap_content"
android:layout_marginLeft="6dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:ellipsize="end"
android:singleLine="true"
android:textColor="@color/text_514647"
android:textSize="@dimen/sp_15"/>
<TextView
android:id="@+id/tv_hint"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="@dimen/dp_15"
android:text="@string/txt_fund_hint"
android:textColor="@color/gray_9"
android:textSize="@dimen/sp_14"
android:visibility="gone"/>
<ImageView
android:id="@+id/iv_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="@drawable/img_label_dcard"
android:visibility="gone"/>
</LinearLayout>
<View
android:layout_width="fill_parent"
android:layout_height="1px"
android:background="@drawable/separation_line"/>
<LinearLayout
android:id="@+id/ll_item"
android:layout_width="match_parent"
android:layout_height="110dp"
android:background="@color/white"
android:orientation="horizontal"
android:padding="@dimen/dp_10">
<LinearLayout
android:layout_width="1dp"
android:layout_height="63dp"
android:layout_weight="1.1"
android:gravity="bottom"
android:orientation="vertical">
<TextView
android:id="@+id/tv_profit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/color_txt_red1"
android:textSize="24sp"/>
<TextView
android:id="@+id/tv_profit_tips"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/txt_prd_profit_rate"
android:textColor="@color/gray_9"
android:textSize="@dimen/sp_12"/>
</LinearLayout>
<LinearLayout
android:layout_width="1dp"
android:layout_height="63dp"
android:layout_weight="1.3"
android:gravity="bottom"
android:orientation="vertical">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal">
<TextView
android:id="@+id/tv_limit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/color_txt_red1"
android:textSize="@dimen/sp_18"/>
<TextView
android:id="@+id/tv_transfer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="4dp"
android:background="@drawable/bg_trans"
android:gravity="center"
android:text="可变现"
android:textColor="@color/default_text_color"
android:textSize="@dimen/sp_14"
android:visibility="gone"/>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="3dp"
android:text="@string/txt_prd_limit"
android:textColor="@color/gray_9"
android:textSize="@dimen/sp_12"/>
</LinearLayout>
<LinearLayout
android:id="@+id/ll_presale"
android:layout_width="1dp"
android:layout_height="60dp"
android:layout_weight="1.1"
android:gravity="center_vertical|right"
android:orientation="vertical"
android:visibility="gone">
<TextView
android:id="@+id/tv_buy_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="true"
android:textColor="@color/text_eb4a19"
android:textSize="@dimen/sp_14"
android:visibility="gone"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/dp_5"
android:orientation="horizontal">
<TextView
android:id="@+id/tv_hour"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/shape_presale_bg"
android:padding="2dp"
android:text="15"
android:textColor="@color/black6"
android:textSize="@dimen/sp_12"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="2dp"
android:text=":"
android:textColor="@color/black6"
android:textSize="@dimen/sp_12"/>
<TextView
android:id="@+id/tv_minutes"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/shape_presale_bg"
android:padding="2dp"
android:text="28"
android:textColor="@color/black6"
android:textSize="@dimen/sp_12"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="2dp"
android:text=":"
android:textColor="@color/black6"
android:textSize="@dimen/sp_12"/>
<TextView
android:id="@+id/tv_seconds"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/shape_presale_bg"
android:padding="2dp"
android:text="45"
android:textColor="@color/black6"
android:textSize="@dimen/sp_12"/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="@+id/ll_buy"
android:layout_width="1dp"
android:layout_height="75dp"
android:layout_marginRight="@dimen/dp_5"
android:layout_weight="1.1"
android:gravity="center_vertical|right"
android:orientation="vertical"
android:visibility="visible">
<Button
android:id="@+id/btn_buy"
android:layout_width="95dp"
android:layout_height="30dp"
android:background="@drawable/btn_buy_new"
android:text="@string/txt_prd_buy_now"
android:textColor="@color/white"
android:textSize="@dimen/sp_15"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</FrameLayout>
转载请注明原文地址: https://ju.6miu.com/read-1303104.html
