Paint API - Xfermode 및 PorterDuff에 대한 자세한 설명(1)


이 섹션 소개:

제목에 있는 이 두 가지에 대해 잘 알고 계시는지 모르겠습니다. 둥근 모서리나 원형 이미지를 구현하셨다면 이 두 가지 용어에 대해 잘 알고 계실 거라 믿습니다. 패턴이 아닌데 한동안 기억나지 않으셨나요? 상관없습니다. 아래 사진을 보셨나요?

1.png

PS: 인터넷에 다음과 같이 나와 있습니다: 샘플android-XXlegacyApiDemossrccomexampleandroidapisgraphics 이 사진을 찾을 수 있지만, 제 샘플이 android-22이기 때문에 그런 것인지는 모르겠습니다. 여기서는 Xfermodes.java라는 Java 파일만 찾았습니다! 여기에 제가 온라인에서 찾은 내용을 직접 게시하겠습니다~

글쎄, 말하자면 대부분의 친구들이 이 사진을 본 적이 있을 것입니다. 보지 않으셔도 상관 없습니다. 조금. 이것저것~, 이전 Android 기본 입문 튜토리얼을 다시 살펴보세요 - 8.3.1 세 가지 그리기 도구 클래스에 대한 자세한 설명

setXfermode(Xfermode xfermode): 병합, 가져오기 등 그래픽이 겹칠 때 처리 방법을 설정합니다. 교차점 또는 조합, 지우개 효과를 만드는 데 자주 사용됩니다!

공식 문서로 이동합니다: MaskFilter의 두 하위 클래스와 마찬가지로 하드웨어 가속을 지원하지 않으므로 API 14 이상인 경우 효과를 얻으려면 하드웨어 가속을 꺼야 합니다! 자신을 닫는 방법은 이전 섹션을 읽어보세요~

그가 제공한 시공 방법을 살펴보겠습니다! 공식 API 문서: 2.png피하십시오. PS를 연구한 경우 다음과 같이 선택한 색상 값의 범위를 설정하는 마술 지팡이 도구를 사용했을 수 있습니다. 허용오차는 0이고 순수한 검은색의 작은 점을 선택하면 허용오차를 40으로 조정하면 범위가 큰 검은색 영역으로 확장됩니다! 만약에 아직은 잘 이해가 안 되지만, 나중에 코드를 작성할 때 알게 될 거예요!

mode
: 회피Xfermode 모드에는

TARGET

AVOID

모드 1: 회피Xfermode.Mode.TARGET

3.png

이 모드는 캔버스에 다음과 같은 색상 값이 있는지 여부를 결정합니다. 우리가 설정한 색상 값과 다릅니다. 색상이 있는 경우 이 영역을 변경합니다. 브러시로 정의한 색상의 레이어를 얼룩지게 하고 다른 부분은 얼룩지지 않은 채로 두십시오! 아래에 시연할 코드를 작성하여 모두가 느낄 수 있도록 합시다. 이 공차 값!

코드 예제 사용:

렌더링 실행 :

글쎄, 원본 그림부터 시작해 보겠습니다. 자료는 gank.io에서 가져옵니다.

4.jpg

다음으로 임의의 위치에서 색상을 변경해 보겠습니다. 벽에 색상 선택기를 사용하여 제거한 다음 간단한 보기를 작성하세요!

PS: 하드웨어 가속을 끄려면 AndroidManifest.xml의 애플리케이션 노드에 추가해야 합니다. android:hardwareAccelerated="false"

/**
 * Created by Jay on 2015/10/22 0022.
 */
public class AvoidXfermodeView1 extends View {

    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);  //抗锯齿
        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.setARGB(255, 222, 83, 71);
        mPaint.setXfermode(avoidXfermode);
        canvas.drawRect(50, 50, 690, 1010, mPaint);
    }
}

달린 후의 효과 :

5.png

벽에 쌓인 이모 더미가 빨간색인지 확인하세요. 여기의 공차 값은 큰 역할을 하지 않습니다. 소녀의 흰 옷이 빨간 아줌마로 변신!

위의 ApplyXfermode 구조를 다음과 같이 변경했습니다.

avoidXfermode = new AvoidXfermode(0XFFD9E5F3, 25, AvoidXfermode.Mode.TARGET);

그리고 소녀의 흰색 옷은 이모의 빨간색으로 변했습니다...6.jpg, 죄책감에 가득...

7.png


Mode 2: 회피Xfermode.Mode.AVOID

위의 TARGET 모드와 반대입니다. 위의 색상은 색상이 동일할 때 변경됩니다. 허용치 값도 반대 결과를 가져옵니다. 허용치 값이 0인 경우 그림의 픽셀 색상 값이 설정된 색상 값과 완전히 다른 경우에만 가능합니다. 허용치가 최대값인 255에 도달하면 염색되며, 색상이 조금씩 다를 경우에도 염색됩니다! 단순히 위의 예제만 수정하면 됩니다. 회피Xfermode를 구성하는 내용도 마찬가지입니다. 다음 문장으로 변경했습니다:

avoidXfermode = new AvoidXfermode(0XFFD9E5F3,230, AvoidXfermode.Mode.AVOID);

Running renders:

8.png


둘째 아들: Pixel 구축 방법은 다음과 같습니다:

공식 API 문서:

PixelXor PixelXorXfermode는 내부적으로 " opColor ^ src ^ dst "의 XOR 알고리즘에 따라 동작합니다. 불투명(알파 = 255) 색상 값을 가져와서 이미지에 설정하세요! 알겠습니다. 온라인에서 검색해 봤습니다 구체적인 건 몰라서 효과를 시험해 보기 위해 예시를 작성해보겠습니다~

코드 예시

:9.png

렌더링 실행 중

:

10.png

구현 코드:

/**
 * Created by Jay on 2015/10/22 0022.
 */
public class PixelXorXfermodeView1 extends View{

    private Paint mPaint;
    private Bitmap mBitmap;
    private PixelXorXfermode pixelxorXfermode;

    public PixelXorXfermodeView1(Context context) {
        super(context);
        init();

    }

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

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

    private void init() {
        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);  //抗锯齿
        pixelxorXfermode = new PixelXorXfermode(0XFFD9E5F3);
        mBitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.iv_meizi);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        canvas.drawBitmap(mBitmap, 50, 50, mPaint);
        mPaint.setARGB(255, 222, 83, 71);
        mPaint.setXfermode(pixelxorXfermode);
        canvas.drawRect(50, 50, 690, 1010, mPaint);
    }

}

이 섹션의 샘플 코드 다운로드:

XfermodeDemo.zip


이 섹션 요약:

좋아, 죄책감이 가득한 아주 아름다운 소녀 , 그리고 저를 위해 이렇게 데모를 작성하게 되었는데, 비난하지 마세요. 11.gif 그런데, Xfermode의 장남과 둘째 아들이 세상을 떠났다는 사실을 언급하는 것을 잊어버렸고, API 16 이후 버전에서는, 만료되어 이 섹션은 쓸모가 없다는 뜻입니다...

아파치는 4.4 버전 이후에 거세되었다고 말할 수는 없지만 여전히 HttpClient를 사용하는 사람들도 있습니다. 이 라이브러리에서 작성한 HTTP 요청 프레임워크~ 물론 기본적으로 그런 사람은 거의 없습니다! 하지만 더 많이 배워도 나쁠 건 없겠죠? 다음 섹션의 셋째 아들인 PorterDuffXfermode는 시대를 초월하고 매우 중요합니다. 걱정하지 마세요. 다시는 사진을 망치지 않을 것입니다! 그럼 그게 다입니다. 감사합니다~