Easy Tutorial
❮ Weui For Weixin Web Verilog Cic ❯

8.3.4 Paint API - A Detailed Explanation of Xfermode and PorterDuff (Part One)

Category Android Basic Tutorial

Introduction to This Section:

>

Are you familiar with these two terms in the title? If you have implemented rounded corners or circular images, you should not be a stranger to these two terms. Can't remember for the moment? No problem, have you seen the following picture?

PS: It is said online that you can find this picture in: \samples\android-XX\legacy\ApiDemos\src\com\example\android\apis\graphics, but it is not there, I don't know if it's because my sample is android-22, I only found a Java file named Xfermodes.java here! I will directly post the picture I found online~

Well, I believe most friends have seen this picture, if you haven't, it doesn't matter, in this section, we will take you to learn about this bit by bit, let's go back to our previous Android Basic Tutorial - 8.3.1 A Detailed Explanation of Three Drawing Tool Classes

setXfermode (Xfermode xfermode): Sets the processing method when graphics overlap, such as merging, taking the intersection or union, often used to create the erasing effect of an eraser!

Let's go to the official documentation: Xfermode, we find that it has three children:

In this section, we will learn about the first two children~


Eldest Son: AvoidXfermode

>

Well, like the two subclasses of MaskFilter we learned earlier, it does not support hardware acceleration, so if it is a version above API 14, you need to turn off hardware acceleration to have an effect! How to turn it off, please refer to the previous section~

Let's take a look at the constructor it provides for us! Official API documentation: AvoidXfermode

There are three parameters, in order:

opColor: A hexadecimal color value with transparency, such as 0x00C4C4;

tolerance: The tolerance value, if you have used Photoshop, you may have used the magic wand tool, which is to set the range of the selected color value, for example, a tolerance of 0, you select a pure black dot, when the tolerance is adjusted to 40, the range has expanded to a large area of black! If you are still not very clear, we will write some code later to understand!

mode: AvoidXfermode mode, there are two: TARGET and AVOID


Mode 1: AvoidXfermode.Mode.TARGET

>

This mode will determine if there is a color on the canvas that is different from the color value we set. If there is, these areas will be dyed with the color defined by the brush, and other places will not be dyed! Below we write code to demonstrate, and let everyone feel this tolerance value!

Code Example Usage:

Running Effect Picture:

Well, first show the original picture, the material comes from gank.io:

Next, we randomly take the color of a place on the wall with a color picker, and then write a simple View!

PS: Need to add in the AndroidManifest.xml application node to turn off hardware acceleration: android:hardwareAccelerated="false"

``` /**

private Paint mPaint;
private Bitmap mBitmap;
private AvoidXfermode avoidXfermode;

public AvoidXfermodeView1(Context context) {
    super(context);
    init();
}

public AvoidXfermodeView1(Context context, AttributeSet attrs) {
    super(context, attrs);
    init();
}

public AvoidXfermodeView1(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    init();
}

private void init() {
    mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);  //Anti-aliasing
    avoidXfermode = new AvoidXfermode(0XFFCCD1D4, 0, AvoidXfermode.Mode.TARGET);
    mBitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.iv_meizi);

}

@Override
protected void onDraw(Canvas canvas) {
    canvas.drawBitmap(mBitmap, 50, 50, mPaint);
    mPaint

❮ Weui For Weixin Web Verilog Cic ❯