Android基于模糊滤镜(MaskFilter)的阴影边框渐变效果

setMaskFilter(MaskFilter maskfilter)：设置MaskFilter，可以用不同的MaskFilter实现滤镜的效果，如滤化，立体等！

而我们一般不会直接去用这个MaskFilter，而是使用它的两个子类：

• BlurMaskFilter：指定一个模糊的样式和半径来处理Paint的边缘
• EmbossMaskFilter：指定光源的方向和环境光强度来添加浮雕效果

BlurMaskFilter(模糊效果)

构造方法

BlurMaskFilter(float radius, Blur style)

• 参数1：指定模糊边缘的半径
• 参数2：指定模糊的风格，可选值有
• • BlurMaskFilter.Blur.NORMAL：内外模糊
• • BlurMaskFilter.Blur.OUTER：外部模糊
• • BlurMaskFilter.Blur.INNER：内部模糊
• • BlurMaskFilter.Blur.SOLID：内部加粗，外部模糊

阴影渐变边框

public class ShadowBorderLayout extends ConstraintLayout {
    private static final String TAG = "yezhou";
    private BlurMaskFilter mBlurMaskFilter;
    private Paint mPaint;
    private float mShadowWidth;

    public ShadowBorderLayout(Context context) {
        this(context, null);
    }

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

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

    private void init() {
        mShadowWidth = DisplayUtil.dp2px(4);

        mPaint = new Paint();
        mPaint.setAntiAlias(true);                                  //抗锯齿
        mPaint.setColor(Color.parseColor("#00A0E9"));  //画笔颜色
        mPaint.setStyle(Paint.Style.FILL);                          //画笔风格
        mPaint.setStrokeWidth(5);                                   //画笔粗细

        mBlurMaskFilter = new BlurMaskFilter(10f, BlurMaskFilter.Blur.OUTER);
        mPaint.setMaskFilter(mBlurMaskFilter);

        setLayerType(View.LAYER_TYPE_SOFTWARE, null);     //关闭硬件加速
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
    }

    @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
    @Override
    protected void dispatchDraw(Canvas canvas) {
        super.dispatchDraw(canvas);
        Log.i(TAG, "left: " + getLeft() + ", top: " + getTop() + ", right: " + getRight() + ", bottom: " + getBottom());
        Log.i(TAG, "width: " + getWidth() + ", height: " + getHeight());
        canvas.drawRect(mShadowWidth, mShadowWidth, getWidth()-mShadowWidth, getHeight()-mShadowWidth, mPaint);
    }

}

圆角阴影渐变边框

public class ShadowRoundBorderLayout extends ConstraintLayout {
    private static final String TAG = "yezhou";
    private BlurMaskFilter mBlurMaskFilter;
    private Paint mPaint;
    private float mRadius;

    public ShadowRoundBorderLayout(Context context) {
        this(context, null);
    }

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

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

    private void init() {
        mRadius = DisplayUtil.dp2px(6);

        mPaint = new Paint();
        mPaint.setAntiAlias(true);                     //抗锯齿
        mPaint.setColor(Color.parseColor("#00A0E9"));  //画笔颜色
        mPaint.setStyle(Paint.Style.STROKE);           //画笔风格
        mPaint.setStrokeWidth(5);                      //画笔粗细

        mBlurMaskFilter = new BlurMaskFilter(10f, BlurMaskFilter.Blur.OUTER);
        mPaint.setMaskFilter(mBlurMaskFilter);

        setLayerType(View.LAYER_TYPE_SOFTWARE, null);     //关闭硬件加速
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
    }

    @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
    @Override
    protected void dispatchDraw(Canvas canvas) {
        super.dispatchDraw(canvas);
        Log.i(TAG, "left: " + getLeft() + ", top: " + getTop() + ", right: " + getRight() + ", bottom: " + getBottom());
        Log.i(TAG, "width: " + getWidth() + ", height: " + getHeight());
        canvas.drawRoundRect(0, 0, getWidth(), getHeight(), mRadius, mRadius, mPaint);
    }

}

引用自定义布局

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?android:attr/actionBarSize"
        android:background="@color/colorPrimaryDark"
        app:title="基于模糊滤镜的阴影渐变边框效果"
        app:titleTextColor="#FFF"
        >
    </android.support.v7.widget.Toolbar>

    <me.yezhou.widget.ShadowBorderLayout
        android:id="@+id/layout_shadow_border"
        android:layout_width="match_parent"
        app:layout_constraintTop_toBottomOf="@id/toolbar"
        android:layout_height="160dp"
        android:layout_margin="15dp"
        >
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            android:text="阴影渐变边框"
            android:textSize="20sp"
            />
    </me.yezhou.widget.ShadowBorderLayout>

    <me.yezhou.widget.ShadowRoundBorderLayout
        android:layout_width="match_parent"
        app:layout_constraintTop_toBottomOf="@id/layout_shadow_border"
        android:layout_height="160dp"
        android:layout_margin="15dp"
        >
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            android:text="圆角阴影渐变边框"
            android:textSize="20sp"
            />
    </me.yezhou.widget.ShadowRoundBorderLayout>

</android.support.constraint.ConstraintLayout>

效果演示