Android自定义控件之自定义圆形图片和圆角图片

今天给大家带来的自定义控件是一个圆角,和圆形图片。
先说说为什么我要写这个功能
1.通过自定义圆角和圆形图片我可以学到自定义属性中的枚举
2.在这里我可以学到onDraw方法中图片的画法

好了废话不多说先上效果图,看看是不是你们需要的功能。
这里写图片描述

这里写图片描述

在这里我先所以下自定义属性中的枚举的用法

枚举的用法其实和其他类型的属性用法是一样的
在Values文件夹下创建attrs.xml这里我直接贴出代码,相信你看一眼就知道在xml中是怎么定义的

<declare-styleable name="CircleOrCardImageView">
        <!--圆角大小-->
        <attr name="borderRadius" format="dimension"/>
        <!--枚举-->
        <attr name="imageType">
            <enum name="circle" value="1"/>
            <enum name="round" value="2"/>
        </attr>
    </declare-styleable>

然后就是在代码中枚举是怎么获取的,也很简单,相信你看代码就会

  int type =typedArray.getInt(R.styleable.CircleOrCardImageView_imageType,1);

自定义属性说完之后,让我们正式进入到我们自定义控件中
首先先说一下自定义圆形图片和圆角图片的实现思路,其实他的实现思路是非常简单的
就是我们先得到一个圆形图片(这里我以圆形图片为例,圆角图片会和圆形图片的做法是相同的),我们得到圆形图片之后再将圆形图片画出来.

一、得到圆形图片·(做法就是先画我们要设置的图片然后再画一个圆形背景,接着取他们相交的地方)
1.首先先将我们需要设置圆形或者圆角的图片绘画到画布上,这里我贴出绘画图片的代码

      //得到我们想要设置的图片
       Bitmap bitmap = ((BitmapDrawable) drawable).getBitmap();
       //创建一个图片背景
        Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888);
        //创建画布  画布背景是我们创建的背景
        Canvas canvas = new Canvas(output);
    Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
        //花图片
        canvas.drawBitmap(bitmap,rect,rect,mPaint);

第二步就是绘画一个圆形的背景,我也贴出代码

   int x =Math.min(bitmap.getWidth(),bitmap.getHeight());
        //画一个元取圆
   canvas.drawCircle(x/2,x/2,x/2,mPaint);

最后就是去他们相交的地方代码

        //设置两个图片的加差方式
        mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));

这里把图片其他取值方式贴出来

扫描二维码关注公众号,回复: 1910725 查看本文章
1.PorterDuff.Mode.CLEAR

   所绘制不会提交到画布上。
2.PorterDuff.Mode.SRC

   显示上层绘制图片
3.PorterDuff.Mode.DST

  显示下层绘制图片
4.PorterDuff.Mode.SRC_OVER

  正常绘制显示,上下层绘制叠盖。
5.PorterDuff.Mode.DST_OVER

  上下层都显示。下层居上显示。
6.PorterDuff.Mode.SRC_IN

   取两层绘制交集。显示上层。
7.PorterDuff.Mode.DST_IN

  取两层绘制交集。显示下层。
8.PorterDuff.Mode.SRC_OUT

 取上层绘制非交集部分。
9.PorterDuff.Mode.DST_OUT

 取下层绘制非交集部分。
10.PorterDuff.Mode.SRC_ATOP

 取下层非交集部分与上层交集部分
11.PorterDuff.Mode.DST_ATOP

  取上层非交集部分与下层交集部分

二、将我们得到的圆形图片画出来就可以了。

好了思路就是这样,接着我把我源码的地址分享出来
https://github.com/GitHubToLiao/CircleOrCardImage.git

猜你喜欢

转载自blog.csdn.net/liao5214/article/details/72758600