ImageView的Tint属性

2019-11-09 15:06:30

字体：大中小

来源：转载

供稿：网友

Tint是一个比较难以用文字来解释的属性，效果图可以参照以下一张图片

这里写图片描述

首先有一张Src图片以及一张Dst图片，然后根据这两张图片不同的层叠变化，可以组合成其它十四种图形例如 clear表示两张图片层叠后什么都不显示 SrcOver表示两张图片的相交部分显示Src的颜色 SrcIn表示只显示两张图片的相交部分，且为Src的颜色

在布局中，tint属性如下定义：

代码如下定义：

setColorFilter(int color, PorterDuff.Mode mode)

这里做个小Demo来演示效果使用到的图片有如下三张：这里写图片描述

将三张图片作为Dst，再设定一个颜色值作为Src，Src用四个SeekBar来调节颜色，观察其效果变化

布局文件：

<?xml version="1.0" encoding="utf-8"?><ScrollView xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal"> <ImageView android:id="@+id/green" android:layout_width="50dp" android:layout_height="50dp" android:src="@drawable/green" /> <ImageView android:id="@+id/red" android:layout_width="50dp" android:layout_height="50dp" android:layout_marginLeft="10dp" android:src="@drawable/red" /> <ImageView android:id="@+id/transparent" android:layout_width="50dp" android:layout_height="50dp" android:layout_marginLeft="10dp" android:src="@drawable/transparent" /> </LinearLayout> <Spinner android:id="@+id/spinner" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Alpha 透明度" /> <SeekBar android:id="@+id/alpha_seekBar" android:layout_width="match_parent" android:layout_height="wrap_content" android:max="255" android:progress="255" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Red 红色" /> <SeekBar android:id="@+id/red_seekBar" android:layout_width="match_parent" android:layout_height="wrap_content" android:max="255" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Green 绿" /> <SeekBar android:id="@+id/green_seekBar" android:layout_width="match_parent" android:layout_height="wrap_content" android:max="255" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Blue 蓝色" /> <SeekBar android:id="@+id/blue_seekBar" android:layout_width="match_parent" android:layout_height="wrap_content" android:max="255" /> <TextView android:gravity="center" android:text="图片是Dst，设置的颜色是Src" android:layout_width="match_parent" android:layout_height="wrap_content" /> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/explain" /> </LinearLayout></ScrollView>

再Strings.xml文件中声明Spinner的选项

<string-array name="modes"> <item>CLEAR</item> <item>SRC</item> <item>DST</item> <item>SRC_OVER</item> <item>DST_OVER</item> <item>SRC_IN</item> <item>DST_IN</item> <item>SRC_OUT</item> <item>DST_OUT</item> <item>SRC_ATOP</item> <item>DST_ATOP</item> <item>XOR</item> <item>DARKEN</item> <item>LIGHTEN</item> <item>MULTipLY</item> <item>SCREEN</item> <item>ADD</item> <item>OVERLAY</item> </string-array>

声明控件与Tint模式

private ImageView iv_green; private ImageView iv_red; private ImageView iv_transparent; private Spinner spinner; //透明度滑动条 private SeekBar sb_transparent; //红色滑动条 private SeekBar sb_red; //绿色滑动条 private SeekBar sb_green; //蓝色滑动条 private SeekBar sb_blue; private static final PorterDuff.Mode[] MODES = new PorterDuff.Mode[]{ PorterDuff.Mode.CLEAR, PorterDuff.Mode.SRC, PorterDuff.Mode.DST, PorterDuff.Mode.SRC_OVER, PorterDuff.Mode.DST_OVER, PorterDuff.Mode.SRC_IN, PorterDuff.Mode.DST_IN, PorterDuff.Mode.SRC_OUT, PorterDuff.Mode.DST_OUT, PorterDuff.Mode.SRC_ATOP, PorterDuff.Mode.DST_ATOP, PorterDuff.Mode.XOR, PorterDuff.Mode.DARKEN, PorterDuff.Mode.LIGHTEN, PorterDuff.Mode.MULTIPLY, PorterDuff.Mode.SCREEN, PorterDuff.Mode.ADD, PorterDuff.Mode.OVERLAY };@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); iv_green = (ImageView) findViewById(R.id.green); iv_transparent = (ImageView) findViewById(R.id.transparent); iv_red = (ImageView) findViewById(R.id.red); sb_transparent = (SeekBar) findViewById(R.id.alpha_seekBar); sb_red = (SeekBar) findViewById(R.id.red_seekBar); sb_green = (SeekBar) findViewById(R.id.green_seekBar); sb_blue = (SeekBar) findViewById(R.id.blue_seekBar); spinner = (Spinner) findViewById(R.id.spinner); SpinnerAdapter spinnerAdapter = ArrayAdapter.createFromResource(this, R.array.modes, android.R.layout.simple_list_item_1); spinner.setAdapter(spinnerAdapter); initEvent(); updateImage(getRGBColor(), getMode()); } private void initEvent() { spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() { @Override public void onItemSelected(AdapterView<?> parent, View view, int position, long id) { updateImage(getRGBColor(), getMode()); } @Override public void onNothingSelected(AdapterView<?> parent) { } }); SeekBar.OnSeekBarChangeListener seekBarChangeListener = new SeekBar.OnSeekBarChangeListener() { @Override public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) { updateImage(getRGBColor(), getMode()); } @Override public void onStartTrackingTouch(SeekBar seekBar) { } @Override public void onStopTrackingTouch(SeekBar seekBar) { } }; sb_transparent.setOnSeekBarChangeListener(seekBarChangeListener); sb_red.setOnSeekBarChangeListener(seekBarChangeListener); sb_green.setOnSeekBarChangeListener(seekBarChangeListener); sb_blue.setOnSeekBarChangeListener(seekBarChangeListener); } private PorterDuff.Mode getMode() { return MODES[spinner.getSelectedItemPosition()]; } /** * 根据ARGB值计算颜色值 * * @return 颜色值 */ private int getRGBColor() { int alpha = sb_transparent.getProgress(); int red = sb_red.getProgress(); int green = sb_green.getProgress(); int blue = sb_blue.getProgress(); return Color.argb(alpha, red, green, blue); } /** * 更新颜色与模式 * * @param color 颜色 * @param mode 模式 */ private void updateImage(int color, PorterDuff.Mode mode) { iv_red.setColorFilter(color, mode); iv_green.setColorFilter(color, mode); iv_transparent.setColorFilter(color, mode); }

演示效果这里写图片描述