AndroidはImageViewにマスクを使用


実現の大まかな効果は上図のように、変色ボタンをクリックすると、ボタン下部の4種類のヒントカラーマスク切替が実現できます.
主な実現原理は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>