Android 自定义Drawable 实现圆角圆形图片

概述

在之前的博客Android Drawable(一)之ShapeDrawable 和 Android Drawable(二)中主要讲解了Android中常见的Drawable的使用方法，今天在这里主要讲解一下如何通过自定义Drawable实现圆角和圆形图片。

在Android开发中，我们经常通过使用自定义控件来完成一些UI效果而很少使用自定义Drawable，主要原因是自定义Drawable无法在xml文件中使用。Drawable一般都是作为View的背景显示出来，在View显示Drawable时，主要就是通过调用Drawable类的draw(canvas)方法实现。

自定义Drawable

自定义圆形图片

package com.zhangke.drawabledemo2;import android.graphics.Bitmap;import android.graphics.BitmapShader;import android.graphics.Canvas;import android.graphics.ColorFilter;import android.graphics.Paint;import android.graphics.PixelFormat;import android.graphics.Shader;import android.graphics.drawable.Drawable;/** * Created by zhangke on 2016/10/29. */public class CircleDrawable extends Drawable {    /**     * 显示图片     */    private Bitmap mBitmap;    /**     * BitmapShader     */    private BitmapShader mBitmapShader;    /**     * 画笔     */    private Paint mPaint;    /**     * 圆心     */    private float cx, cy;    /**     * 半径     */    private float radius;    private int size;    public CircleDrawable(Bitmap bitmap) {        this.mBitmap = bitmap;        mBitmapShader = new BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);        mPaint = new Paint();        mPaint.setAntiAlias(true);        mPaint.setShader(mBitmapShader);        size = Math.min(bitmap.getWidth(), bitmap.getHeight());        cx = size / 2;        cy = size / 2;        radius = size / 2;    }    @Override    public void draw(Canvas canvas) {        canvas.drawCircle(cx, cy, radius, mPaint);    }    @Override    public int getIntrinsicHeight() {        return size;    }    @Override    public int getIntrinsicWidth() {        return size;    }    @Override    public void setAlpha(int alpha) {        mPaint.setAlpha(alpha);    }    @Override    public void setColorFilter(ColorFilter colorFilter) {        mPaint.setColorFilter(colorFilter);    }    @Override    public int getOpacity() {        return PixelFormat.TRANSLUCENT;    }}

自定义圆角图片

package com.zhangke.drawabledemo2;import android.graphics.Bitmap;import android.graphics.BitmapShader;import android.graphics.Canvas;import android.graphics.ColorFilter;import android.graphics.Paint;import android.graphics.PixelFormat;import android.graphics.Rect;import android.graphics.RectF;import android.graphics.Shader;import android.graphics.drawable.Drawable;/** * Created by zhangke on 2016/10/29. */public class RoundDrawable extends Drawable {    /**     * 显示图片     */    private Bitmap mBitmap;    /**     * BitmapShader     */    private BitmapShader mBitmapShader;    /**     * 画笔     */    private Paint mPaint;    private RectF rectF;    public RoundDrawable(Bitmap bitmap) {        this.mBitmap = bitmap;        mBitmapShader = new BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);        mPaint = new Paint();        mPaint.setAntiAlias(true);        mPaint.setShader(mBitmapShader);    }    @Override    public void setBounds(int left, int top, int right, int bottom) {        super.setBounds(left, top, right, bottom);        rectF = new RectF(left, top, right, bottom);    }    @Override    public void draw(Canvas canvas) {        canvas.drawRoundRect(rectF, 100, 100 ,mPaint);    }    @Override    public int getIntrinsicHeight() {        return mBitmap.getHeight();    }    @Override    public int getIntrinsicWidth() {        return mBitmap.getWidth();    }    @Override    public void setAlpha(int alpha) {        mPaint.setAlpha(alpha);    }    @Override    public void setColorFilter(ColorFilter colorFilter) {        mPaint.setColorFilter(colorFilter);    }    @Override    public int getOpacity() {        return PixelFormat.TRANSLUCENT;    }}

在自定义Drawable时，默认需要复写draw、setAlpha、setColorFilter、getOpacity四个方法，其中最核心的方法就是draw方法了。

在通常情况下，还需要实现getIntrinsicHeight和getIntrinsicWidth方法，这两个方法返回的是drawable的大小，如果我们不重写这两个方法，drawable是不会被绘制出来，因为这两个方法默认的返回值是-1。

使用自定义drawable

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    tools:context="com.zhangke.drawabledemo2.MainActivity">    <ImageView        android:id="@+id/imageview1"        android:background="#dca098"        android:layout_width="wrap_content"        android:layout_height="wrap_content" />    <ImageView        android:id="@+id/imageview2"        android:layout_width="wrap_content"        android:background="#98d1dc"        android:layout_height="wrap_content" />    <ImageView        android:id="@+id/imageview3"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:background="#e7b3d8"/></LinearLayout>

        ImageView imageView1 = (ImageView) findViewById(R.id.imageview1);        Bitmap bitmap1 = BitmapFactory.decodeResource(getResources(), R.drawable.d1);        ImageView imageView2 = (ImageView) findViewById(R.id.imageview2);        Bitmap bitmap2 = BitmapFactory.decodeResource(getResources(), R.drawable.d2);        ImageView imageView3 = (ImageView) findViewById(R.id.imageview3);        Bitmap bitmap3 = BitmapFactory.decodeResource(getResources(), R.drawable.d3);        imageView1.setImageDrawable(new CircleDrawable(bitmap1));        imageView2.setImageDrawable(new CircleDrawable(bitmap2));        imageView3.setImageDrawable(new CircleDrawable(bitmap3));//        imageView1.setImageDrawable(new RoundDrawable(bitmap1));//        imageView2.setImageDrawable(new RoundDrawable(bitmap2));//        imageView3.setImageDrawable(new RoundDrawable(bitmap3));

圆形图片效果图：

圆角图片效果图：