自定義之一個圖片根據另一個圖片形狀進行裁剪


大佬繞道,本人小白

先上一個原型圖(gif 懶得弄)

這里寫圖片描述

怎么樣 我這個原型圖是不是很厲害 哈哈哈~~~

  • 需求:
    3. 源圖( 圖 1 )
    4. 需要被裁剪成某個形狀 ( 圖 2 )
    5. 最終效果( 圖 3 )

  • 首先先引入資源文件 在values下創建名稱為attrs的文件

這里寫圖片描述

  • 配置attrs中的資源屬性(因為我都加入注釋了 所以看注釋就應該懂了 我就不再這里多說了)
    那個format 就是類型 里邊有好多類型 具體的可以百度
<declare-styleable name="TailorDimView" >
        <!--被覆蓋-->
        <attr name="image_dst" format="reference"></attr>
        <!--覆蓋-->
        <attr name="image_src" format="reference"></attr>
        <!--透明度-->
        <attr name="trans" format="integer"></attr>
    </declare-styleable>
  • 下一步在xml中引用 dst和src 是兩張圖片 具體會在下面講到
<com.haiyunx.android.kxw.view.TailorDimView
        android:id="@+id/tdv_tailor_dim"
        android:layout_width="match_parent"
        android:scaleType="fitXY"
        tailor:image_dst="@mipmap/find_head_bg"
        tailor:image_src="@mipmap/test"
        tailor:trans="50"
        android:layout_height="165dp" />
  • 先把公共的方法寫出來 方便寫出來
public TailorDimView setBitmap_Dst(Bitmap bitmap_dst) {
        this.B_Dst = bitmap_dst;
        return this;
    }

    public TailorDimView setBitmap_Src(Bitmap bitmap_src) {
        this.B_Src = bitmap_src;
        return this;
    }
    public TailorDimView setTransparency(int l){
        this.transparency = l;
        return this;
    }
    public void refresh(){
        initBitmap() ;
    }

調用 第一個是不設置透明度 默認100,第二個設置透明度 70 ---------(100不透明 0全透明)

 tdvTailorDim.setBitmap_Src(src).setBitmap_Dst(dst).refresh();
        tdvTailorDim.setBitmap_Src(src).setBitmap_Dst(dst).setTransparency(70).refresh();
  • 先繼承一個ImageView ,可以看到構造方法中只有initAttrs和initBitmap
public class TailorDimView extends ImageView {
//    private int DEF_HEIGHT = xxxx;

    private int Dst = 0;    //需要被裁剪什么形狀  就傳什么形狀的圖片   xml中使用
    private int Src = 0;   //源圖片  xml中使用
    private Bitmap B_Dst;  //代碼傳入需要裁剪形狀的圖片
    private Bitmap B_Src;   //代碼傳入源圖片
    private Integer transparency; //透明度  默認100(不透明)
    public TailorDimView(Context context) {
        this(context, null);
    }

    public TailorDimView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public TailorDimView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initAttrs(context, attrs, defStyleAttr);
        initBitmap();
    }

  • initAttrs(context, attrs, defStyleAttr) 獲取資源, 需要注意的是 transparency 這個是設置圖片的透明度的.獲取方法是 .getInteger.上面兩個方法是獲取資源(也就是圖片) 方法不一樣 ,當時我就是在這弄了半天返回的一直是默認值....這塊需要注意一下
private void initAttrs(Context context, AttributeSet attrs, int defStyleAttr) {
        TypedArray typedArray = getContext().obtainStyledAttributes(attrs,       R.styleable.TailorDimView, defStyleAttr, 0);
        //獲取xml 中需要被裁剪形狀的圖片
        Dst = typedArray.getResourceId(R.styleable.TailorDimView_image_dst, 0);
        //獲取xml 中源圖片
        Src = typedArray.getResourceId(R.styleable.TailorDimView_image_src, 0);
        //透明度
        transparency = typedArray.getInteger(R.styleable.TailorDimView_trans, 100);
        typedArray.recycle();
    }
  • initBitmap() 這部分才是最關鍵的地方 ,具體的看注釋就應該明白了
private void initBitmap() {
        Bitmap bitmap_src = null;
        Bitmap bitmap_dst = null;
        //判斷 有沒有在代碼中傳入圖片   優先級高於xml 設置
        if (null != B_Src && null != B_Dst){
            bitmap_src = B_Src;
            bitmap_dst = B_Dst;
            //代碼沒有設置  則獲取xml中的圖片
        }else if (Dst != 0 && Src != 0) {
            bitmap_dst = BitmapFactory.decodeResource(getResources(), Dst);
            saveBitmap(bitmap_dst,"bitmap_dst");
            bitmap_src = BitmapFactory.decodeResource(getResources(), Src);
            saveBitmap(bitmap_src,"bitmap_src");
        }else{
            //都沒有 則拋出異常(英語是語文老師教的- -)
            Logger.e("bitmap_src and bitmap_dst is nul");
            throw new NullPointerException();
        }
        //用於設置  Canvas 的位圖
        Bitmap W_H = Bitmap.createBitmap(bitmap_dst.getWidth(), bitmap_dst.getHeight(), Bitmap.Config.ARGB_8888);

        //設置畫布
        Canvas canvas = new Canvas(W_H);
        //設置畫筆
        Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        //設置 兩張圖片 覆蓋的模式 (具體16中模式   百度---Canvas 覆蓋模式)
        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
        //如果透明度 不是 100  則代碼設置
        if (transparency != 100)
            paint.setAlpha(transparency);
        //設置源圖
        canvas.drawBitmap(bitmap_src, 0, 0, null);
        //設置裁剪圖片
        canvas.drawBitmap(bitmap_dst, 0, 0, paint);
        //置空
        paint.setXfermode(null);
        //設置顯示圖片  記住 一定是你設定的 V_H   之前我一直使用bitmap_dst  一直顯示裁剪不成功  切記切記
        setImageBitmap(W_H);
        saveBitmap(W_H,"merge");
        saveBitmap(bitmap_dst,"bitmap_dst___!");
        saveBitmap(bitmap_src,"bitmap_src___!");
    }
  • 大家應該看到了 savaBitmap 這是是我在測試的時候 看不同時候圖片的形狀
public void saveBitmap(Bitmap bm,String picName) {

        File file = new File("/sdcard/song/");
        if(!file.exists())
            file.mkdirs();
        try {
            FileOutputStream fileOutputStream = new FileOutputStream(file.getPath() + "/"+picName+".jpg");
            bm.compress(Bitmap.CompressFormat.JPEG, 100, fileOutputStream);
            fileOutputStream.close();
            System.out.println("saveBmp is here");
        } catch (Exception e) {
            e.printStackTrace();
        }

    }
  • 最終效果圖 我這個是帶有 透明度的
    這里寫圖片描述

這是我第二次在CSDN中寫博客 總感覺寫的亂亂的 以后我會改改的,羡慕他們設計漂亮的博客


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM