快捷導(dǎo)航

Android圖片描邊效果的實現(xiàn)

更新時間：2023年12月12日 08:41:06 作者：時光少年

這篇文章主要給大家介紹了Android圖片描邊效果的實現(xiàn)，在添加圖片描邊的時候我們用到的是圖片蒙版技術(shù)，文中通過代碼示例給大家介紹的非常詳細(xì),需要的朋友可以參考下

前言

先看下我們闊愛滴海綿寶寶，其原圖是一張PNG圖片，我們給寶寶加上描邊效果，今天我們使用的是圖片蒙版技術(shù)。

說到蒙版可能很多人想起PS摳圖軟件，Android上也一樣，同一個大樹上可能會長出兩種果實，但果實的根基是一樣的。

什么是蒙版：所謂蒙版是只保留了alpha通道的一種二維正交投影，簡單的說就是你躺在地上，太陽光直射下來，背后的那片就是你的蒙版。因此，它既不存在三維特征，也不存在色彩特征，只有alpha特征。那只有alpha通道的圖片是什么顏色，這塊沒有具體了解過，但是理論上取決于默認(rèn)填充色，在Android上最終是白色的，其他平臺暫時還沒了解。

提取蒙版

Android上提取蒙版比想象的容易，按照以往的思路，我們是要進(jìn)行圖片掃描這里，其實就是把所有顏色的red、green、blue都排除掉，只保留alpha，相當(dāng)于縮小了通道數(shù)，排除采樣和縮小圖片，當(dāng)然這個工作量是很大的，尤其是超高清圖片。

Android 上提取蒙版，只需要把原圖繪制到alpha通道的Bitmap上

bms = decodeBitmap(R.mipmap.mm_07);
bmm = Bitmap.createBitmap(bms.getWidth(), bms.getHeight(), Bitmap.Config.ALPHA_8);
Canvas canvas = new Canvas(bmm);
canvas.drawBitmap(bms, 0, 0, null);

蒙版繪制

蒙版繪制和其他Bitmap繪制是有差異的，ARGB_8888和RGB_565等色彩格式的圖片，其本身是具備顏色的，但是蒙版圖片不一樣，他沒有顏色，所以你繪制的時候，bitmap的顏色是你畫筆Paint的填充色，突然想到可以做一個人體掃描的動畫效果或者人體熱力圖。

canvas.drawBitmap(bmm, x, y, paint);

擴(kuò)大蒙版（影子）

要讓蒙版比比原圖大，理論上是需要等比例放大蒙版在平移，還有一種方式是進(jìn)行偏移繪制，我們這里使用偏移繪制。當(dāng)然，這里取一定360，保證盡可能每個方向都有偏移，這是看到的外國人的算法。至于step>0 但是也要控制粒度，太小可能繪制次數(shù)太多，太大可能有些邊緣做不到偏移。

for (int i = 0; i < 360; i += step) {
    float x = width * (float) Math.cos(Math.toRadians(i));
    float y = width * (float) Math.sin(Math.toRadians(i));
    canvas.drawBitmap(bmm, x, y, paint);
}

閃爍效果

我們價格顏色閃爍的效果，其實很簡單，也不是本篇重要的部份，其實就是在色彩中間插入透明色，然后定時閃爍。

int index = -1;
int max = 15;
int[] colors = new int[max];
final int[] highlightColors = {0xfff00000,0,0xffff9922,0,0xff00ff00,0};

public void shake() {
    index = 0;
    for (int i = 0; i < max; i+=2) {
        colors[i] = highlightColors[i % highlightColors.length];
    }
    postInvalidate();
}

總結(jié)

本篇到這里就結(jié)束了，希望利用蒙版+偏移做出更多東西。

全部代碼

public class ViewHighLight extends View {
    final Bitmap bms; //source 原圖
    final Bitmap bmm; //mask 蒙版
    final Paint paint;
    final int width = 4;
    final int step = 15; // 1...45
    int index = -1;
    int max = 15;
    int[] colors = new int[max];
    final int[] highlightColors = {0xfff00000,0,0xffff9922,0,0xff00ff00,0};
    public ViewHighLight(Context context) {
        super(context);
        bms = decodeBitmap(R.mipmap.mm_07);
        bmm = Bitmap.createBitmap(bms.getWidth(), bms.getHeight(), Bitmap.Config.ALPHA_8);
        Canvas canvas = new Canvas(bmm);
        canvas.drawBitmap(bms, 0, 0, null);
        paint = new Paint(Paint.ANTI_ALIAS_FLAG);
    }

    private Bitmap decodeBitmap(int resId) {
        BitmapFactory.Options options = new BitmapFactory.Options();
        options.inMutable = true;
        return BitmapFactory.decodeResource(getResources(), resId, options);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        // draw blur shadow

        for (int i = 0; i < 360; i += step) {
            float x = width * (float) Math.cos(Math.toRadians(i));
            float y = width * (float) Math.sin(Math.toRadians(i));
            canvas.drawBitmap(bmm, x, y, paint);
        }
        canvas.drawBitmap(bms, 0, 0, null);

        if(index == -1){
            return;
        }
        index++;
        if(index > max +1){
            return;
        }
        if(index >= max){
            paint.setColor(Color.TRANSPARENT);
        }else{
            paint.setColor(colors[index]);
        }
        postInvalidateDelayed(200);
    }


    public void shake() {
        index = 0;
        for (int i = 0; i < max; i+=2) {
            colors[i] = highlightColors[i % highlightColors.length];
        }
        postInvalidate();
    }
}

以上就是Android;圖片描邊效果實現(xiàn)的詳細(xì)內(nèi)容，更多關(guān)于Android 圖片描邊的資料請關(guān)注腳本之家其它相關(guān)文章！

您可能感興趣的文章: