Android 如何使用代码绘制渐变色的边框

3,305 阅读1分钟

对于Android开发,想绘制一个渐变色的drawble,一般是使用xml进行绘制,如下方式:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:startColor="@color/colorStart"
        android:angle="-45"
        android:endColor="@color/colorEnd"/>
    <size
        android:width="@dimen/color_size"
        android:height="@dimen/color_size"/>
    <corners
        android:radius="@dimen/radius"/>
</shape>

但是这种都是填充方式的,如果只绘制边框呢,找到了如下方式

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <corners android:radius="4dp"/>
            <gradient
                android:type="linear"
                android:startColor="#ff28efa2"
                android:endColor="#ff0006"
                android:angle="0" />
        </shape>
    </item>
    <item android:left="2dp"
        android:right="2dp"
        android:top="2dp"
        android:bottom="2dp">
        <shape android:shape="rectangle">
            <corners android:radius="4dp"/>
            <solid android:color="#ffffff"/>
            <padding android:top="12dp"
                android:bottom="12dp"/>
        </shape>
    </item>
</layer-list>

效果如下图:

image.png 观察发现中间是白色,如果想让中间是透明色该怎么实现呢,暂时还没有找到可以通过xml实现的方式,如果大家知道也可留言告知。 但是可以通过代码的方式实现,使用的类是ShapeDrawable类,工具方法如下:

public static ShapeDrawable createDrawable(int[] colors, float radius, float strokeWidth) {
    float[] outerR = {radius, radius, radius, radius, radius, radius, radius, radius};
    // 内部矩形与外部矩形的距离
    RectF inset = new RectF(strokeWidth, strokeWidth, strokeWidth, strokeWidth);
    // 内部矩形弧度
    float innerRadius = radius - strokeWidth;
    float[] innerRadii = {innerRadius, innerRadius, innerRadius, innerRadius, innerRadius, innerRadius, innerRadius, innerRadius};
    RoundRectShape rr = new RoundRectShape(outerR, inset, innerRadii);
    ShapeDrawable.ShaderFactory shaderFactory = new ShapeDrawable.ShaderFactory() {
        @Override
        public Shader resize(int width, int height) {
            return new LinearGradient(0f, 0f, width, height, colors, null, Shader.TileMode.CLAMP);
        }
    };
    ShapeDrawable shapeDrawable = new ShapeDrawable(rr);
    shapeDrawable.setShaderFactory(shaderFactory);
    return shapeDrawable;
}

第一个参数就是颜色列表,开始颜色和结束颜色 第二个参数是圆角大小 第三个参数是边框宽度