GradientDrawable與ShapeDrawable

引言:常規shape的用法

當我們在Android項目中畫一個圓角矩形的時候,我們通常會這樣先在res/drawable裏建一個drawable resouce file,比如round_rect.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="@color/colorPrimary"/>
    <corners android:radius="10dp"/>
</shape>

然後在xml中設置給xml,或都直接用Drawable draw = getResources().getDrawable(R.drawable.round_rect);來實例化後使用。一直以來,我以爲shape對應的是ShapeDrawable,然而我打個斷點,看到的卻是這樣的


沒錯,xml中的shape被解析後實例化的是GradientDrawable,不相信的具體可以去查看源碼。

GradientDrawable實例化用法

當計設圖裏有很多圓角背景,但我們又不相創造那麼多xml的時候,就可以用GradientDrawable來實例化對象。

/**
     * @param roundRadius
     *            圓角幅度
     * @param bgfillColor
     *            背景填充色
     * @param bgfillColorAlpha
     *            背景填充色透明度 double類型範圍(0 ~ 1)
     * @param strokeWidth
     *            邊框寬度 (0 無邊框)
     * @param strokeColor
     *            邊框顏色
     * @return
     */
    public static GradientDrawable myCustomShape(int roundRadius,
            int bgfillColor, double bgfillColorAlpha, int strokeWidth,
            int strokeColor) {
        GradientDrawable gradientDrawable = new GradientDrawable();
        if (0 != bgfillColorAlpha) {// 設置爲0 則爲全透明 不需要設置以下參數
            gradientDrawable.setColor(bgfillColor);
            gradientDrawable.setAlpha((int) (bgfillColorAlpha * 255));
        }
        gradientDrawable.setCornerRadius(roundRadius);
        gradientDrawable.setStroke(strokeWidth, strokeColor == 0 ? bgfillColor
                : strokeColor);
        return gradientDrawable;
    }

當然你也可以給每個角設置不同的圓角弧度,如果是有兩種狀態的,則可以用StateListDrawable,比如

/**
     * // 1、2兩個參數表示左上角,3、4表示右上角,5、6表示右下角,7、8表示左下角
     * @param nor_bg
     * @param nor_stroke
     * @param sel_bg
     * @param sel_stroke
     * @param topLeft
     * @param bottomLeft
     * @param topRight
     * @param bottomRight
     * @return
     */
    public static Drawable getDrawable(int nor_bg,int nor_stroke,int sel_bg,int sel_stroke, int topLeft, int bottomLeft, int topRight,
            int bottomRight){
        StateListDrawable bg = new StateListDrawable();
        GradientDrawable normal_drawable = new GradientDrawable();
        normal_drawable.setColor(nor_bg);
        normal_drawable.setCornerRadii(new float[] { topLeft, topLeft,
                topRight, topRight, bottomRight, bottomRight, bottomLeft,
                bottomLeft });
        normal_drawable.setStroke(Util.toDip(1), sel_stroke);

        GradientDrawable checked_drawable = new GradientDrawable();
        checked_drawable.setColor(sel_bg);
        checked_drawable.setCornerRadii(new float[] { topLeft, topLeft,
                topRight, topRight, bottomRight, bottomRight, bottomLeft,
                bottomLeft });
        checked_drawable.setStroke(Util.toDip(1), sel_stroke);

        bg.addState(new int[] { android.R.attr.state_checked },
                checked_drawable);
        bg.addState(new int[] {}, normal_drawable);
        return bg;
    }

更多的屬性大家可以根據需要自己進行封裝。

ShapeDrawable實例化用法

說完GradientDrawable,我們來看一下ShapeDrawable怎麼用呢。其實在沒有用GradientDrawable之前,我是一直在用ShapeDrawable來寫這種背景的

static public ShapeDrawable getRoundRect(int color,float roundLeftTop,float roundRightTop,float roundRightBottom,float roundLeftBottom){
        ShapeDrawable shapeDrawable = new ShapeDrawable();
        float[] outRadii=new float[]{roundLeftTop,roundLeftTop,roundRightTop,roundRightTop,roundRightBottom,roundRightBottom,roundLeftBottom,roundLeftBottom};
        RoundRectShape shape=new RoundRectShape(outRadii,null,null);

        shapeDrawable.setShape(shape);
        shapeDrawable.getPaint().setColor(color);
        return shapeDrawable;
    }

有沒有發現RoundRectShape 第二個第三個參數傳的都是null.
public RoundRectShape(@Nullable float[] outerRadii, @Nullable RectF inset, @Nullable float[] innerRadii) 這個類一共有3個參數,我在上面的註解已經說明了.

注意!這3個參數都是可以爲null的.意思就是,你可以取消任意一個.獲得一些其他效果,比如設置第二個和第三個參數爲null,你就可以得到一個實心的圓角矩形.

如果你給後兩個參數設置了,效果圖大概是這個樣子:


innerRadii 比較好理解就是圓角的弧度,inset 代表的是圖裏面黑色部分的厚度,中間白色的部分其實是父對象的背景。

ShapeDrawable除了可以畫GradientDrawable能畫的純色圖外,還可以畫很多別的圖形,比如扇形,或者是自定義的path圖。更多關於ShapeDrawable用法可以參考Android開發 ShapeDrawable詳解

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章