android为ImageView使用蒙层

实现的大概效果如上图所示，点击变色按钮可以实现按照按钮下部的四种提示颜色蒙层切换。

主要实现原理是使用了ImgeView的setColorFilter()方法。

该方法总共有3个重载：

a、public final void setColorFilter(int color, PorterDuff.Mode mode)

b、public void setColorFilter(ColorFilter cf)

c、public final void setColorFilter(int color)

我这里主要用到了b、c方法，值得一提的是b方法使用的时候使用到ColorMatrix，并调用了

colorMatrix.setSaturation(0) //setSaturation方法参数为0是代表灰色，为1代表原图，其他还有很多值代表不同色值

在没有接触到这个方法之前，我一直以为要实现这种效果，需要经过复杂的色值计算，然后重绘来实现，但今天偶然看到这个方法，才发现幸福来的那么突然。

1、这是我的activity代码

package com.example.walljiang.piececode;

import android.app.Activity;
import android.content.Context;
import android.content.Intent;
import android.graphics.ColorMatrix;
import android.graphics.ColorMatrixColorFilter;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;

public class ColorFilterActivity extends Activity implements View.OnClickListener {
    private ImageView iv1, iv2;

    private Button btn1;

    private int clickControl = 0;

    public static Intent createIntent(Context context) {
        Intent intent = new Intent(context, ColorFilterActivity.class);
        return intent;
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_color_filter);
        iv1 = (ImageView) findViewById(R.id.iv1);
        iv2 = (ImageView) findViewById(R.id.iv2);
        btn1 = (Button) findViewById(R.id.btn1);
        btn1.setOnClickListener(this);
        ColorMatrix colorMatrix = new ColorMatrix();
        colorMatrix.setSaturation(0);
        ColorMatrixColorFilter colorFilter = new ColorMatrixColorFilter(colorMatrix);
        iv2.setColorFilter(colorFilter);
    }

    @Override
    public void onClick(View v) {
        if (clickControl % 4 == 0) {
            iv1.setColorFilter(getResources().getColor(R.color.blue_sky2));
        } else if (clickControl % 4 == 1) {
            iv1.setColorFilter(getResources().getColor(R.color.green_light2));
        } else if (clickControl % 4 == 2) {
            iv1.setColorFilter(getResources().getColor(R.color.pink_light2));
        } else if (clickControl % 4 == 3) {
            iv1.setColorFilter(getResources().getColor(R.color.orange_dark2));
        }
        clickControl++;
    }
}

2、这是R.layout.activity_color_filter的中的布局代码，控件比较多，代码有点长，不过都是很简单的东西

<RelativeLayout 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:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context="com.example.walljiang.piececode.ColorFilterActivity">

    <ImageView
        android:id="@+id/iv1"
        android:layout_width="150dp"
        android:layout_height="200dp"
        android:src="@mipmap/dongman" />

    <Button
        android:id="@+id/btn1"
        android:layout_width="100dp"
        android:layout_height="40dp"
        android:text="点击变色"
        android:layout_toRightOf="@id/iv1" />

    <View
        android:id="@+id/v1"
        android:layout_width="10dp"
        android:layout_height="10dp"
        android:layout_margin="10dp"
        android:background="@color/blue_sky2"
        android:layout_below="@id/btn1"
        android:layout_toRightOf="@id/iv1" />

    <View
        android:id="@+id/v2"
        android:layout_width="10dp"
        android:layout_height="10dp"
        android:layout_margin="10dp"
        android:background="@color/green_light2"
        android:layout_below="@id/btn1"
        android:layout_toRightOf="@id/v1" />

    <View
        android:id="@+id/v3"
        android:layout_width="10dp"
        android:layout_height="10dp"
        android:background="@color/pink_light2"
        android:layout_below="@id/btn1"
        android:layout_margin="10dp"
        android:layout_toRightOf="@id/v2" />

    <View
        android:id="@+id/v4"
        android:layout_width="10dp"
        android:layout_height="10dp"
        android:layout_margin="10dp"
        android:background="@color/orange_dark2"
        android:layout_below="@id/btn1"
        android:layout_toRightOf="@id/v3" />

    <ImageView
        android:id="@+id/iv3"
        android:layout_width="150dp"
        android:layout_height="200dp"
        android:src="@mipmap/dongman"
        android:layout_below="@id/iv1"
        android:layout_marginTop="10dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/picture_nature"
        android:textColor="@android:color/black"
        android:layout_below="@id/iv3" />

    <ImageView
        android:id="@+id/iv2"
        android:layout_width="150dp"
        android:layout_height="200dp"
        android:src="@mipmap/dongman"
        android:layout_below="@id/iv1"
        android:layout_toRightOf="@id/iv3"
        android:layout_marginTop="10dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/picture_gray"
        android:textColor="@android:color/black"
        android:layout_toRightOf="@id/iv3"
        android:layout_below="@id/iv2" />

</RelativeLayout>