Android Drawable 詳解(教你畫畫K濉)

參考

1、Android中的Drawable基礎(chǔ)與自定義Drawable
2拓哟、android中的drawable資源
3想许、Android開發(fā)之Shape詳細解讀

Drawable分類

No xml標簽 Class類 含義
1 shape ShapeDrawable 特定形狀,模型的圖樣
2 selector StateListDrawable 不同狀態(tài)選擇不同的圖樣
3 layer-list LayerDrawable 層疊圖樣
4 level-list LevelListDrawable 不同程度圖樣
5 transition TransitionDrawable 漸變圖樣
6 ripple RippleDrawable 波紋圖樣
7 inset InsetDrawable 內(nèi)嵌圖樣
8 scale ScaleDrawable 縮放圖樣
9 clip ClipDrawable 剪切圖樣
10 rotate RotateDrawable 旋轉(zhuǎn)圖樣
11 animation-list AnimationDrawable 動畫效果
12 bitmap BitmapDrawable 圖片圖樣
13 nine-patch NinePatchDrawable .9圖

\color{green}{=======================================}

一断序、shape - ShapeDrawable : 特定形狀流纹,模型的圖樣

>>標簽含義

1、shape標簽
屬性 含義 值等解釋
shape 形狀违诗,樣式 rectangle: 矩形漱凝,默認的形狀,可以畫出直角矩形诸迟、圓角矩形茸炒、弧形等
oval: 橢圓形,用得比較多的是畫正圓
line: 線形阵苇,可以畫實線和虛線
ring: 環(huán)形壁公,可以畫環(huán)形進度條
tint 著色 給shape著色
tintMode 著色模式 著色模式(有關(guān)tint和tintMode請參看文章:http://blog.csdn.net/u010687392/article/details/47399719
dither 抖動平滑:建議true 將在位圖的像素配置與屏幕不同時(例如:ARGB 8888 位圖和 RGB 565 屏幕)啟用位圖的抖動;值為“false”時則停用抖動慎玖。默認值為 true贮尖。
visible - -
useLevel 使用等級,建議為false 如果為true趁怔,則可在LevelListDrawable中使用湿硝。這通常應為“false”,否則形狀不會顯示润努。
thickness 外環(huán)厚度 環(huán)的厚度关斜,指內(nèi)環(huán)與外環(huán)的環(huán)間距。(只適用于shape為ring)
thicknessRatio 同上铺浇,浮點型 浮點型痢畜,以環(huán)的寬度比率來表示環(huán)的厚度,默認為9鳍侣,表示環(huán)的厚度為環(huán)的寬度除以9丁稀,該值會被android:thickness覆蓋(只適用于shape為ring)
innerRatio 內(nèi)環(huán)半徑 內(nèi)環(huán)半徑(只適用于shape為ring)
innerRadiusRatio 同上,浮點型 浮點型倚聚,以環(huán)的寬度比率來表示內(nèi)環(huán)的半徑线衫,默認為3,表示內(nèi)環(huán)半徑為環(huán)的寬度除以3惑折,該值會被android:innerRadius覆蓋(只適用于shape為ring)
2授账、shape下size標簽:設(shè)置shape寬高值

注意事項:只有控件寬高設(shè)置成wrap_content時枯跑,此處寬高才起作用,但是起到的卻是最小寬高值白热。也就是說敛助,當控件寬高超過你此處指定的值時,它會變化(wrap_content!!!)

屬性 含義
width 寬度
height 高度
3屋确、shape下solid標簽:設(shè)置形狀填充顏色
屬性 含義
color 指定顏色
4纳击、shape下padding標簽:設(shè)置內(nèi)容與邊界的距離
屬性 含義
left 左內(nèi)邊距
top 上內(nèi)邊距
right 右內(nèi)邊距
bottom 左內(nèi)邊距
5、shape下corners標簽:設(shè)置四個角的圓角
屬性 含義
radius 四個角圓角
topLeftRadius 左上角的圓角
topRightRadius 右上角的圓角
bottomLeftRadius 左下角的圓角
bottomRightRadius 右下角的圓角
6乍恐、shape下stroke標簽:設(shè)置shape的外邊界線
屬性 含義
color 描邊的顏色
width 邊界線的寬度
dashWidth 段虛線的寬度
dashGap 段虛線的間隔
7评疗、shape下的gradient標簽:設(shè)置形狀漸變
屬性 含義 值等解釋
type 漸變的類型 1.linear:線性漸變测砂,默認的漸變類型
2.radial:放射漸變茵烈,設(shè)置該項時,必須設(shè)置android:gradientRadius漸變半徑屬
3.sweep:掃描性漸變
angle 漸變角度 漸變的角度砌些,線性漸變時(linear也是默認的漸變類型)才有效呜投,必須是45的倍數(shù),0表示從左到右存璃,90表示從下到上
centerX 漸變中心的相對X坐標 放射漸變時(radial)才有效仑荐,在0.0到1.0之間,默認為0.5纵东,表示在正中間
centerY 漸變中心的相對Y坐標 放射漸變時(radial才有效粘招,在0.0到1.0之間,默認為0.5偎球,表示在正中間
useLevel 使用等級 如果為true洒扎,則可在LevelListDrawable中使用。這通常應為“false”衰絮,否則形狀不會顯示
startColor 漸變開始的顏色 -
centerColor 漸變中間的顏色 -
endColor 漸變結(jié)束的顏色 -
gradientRadius 漸變半徑 漸變的半徑袍冷,只有漸變類型為radial時才使用

>>案例

1、Rectangle-矩形樣式
shape-rectangle.png

矩形:填充+描邊+弧邊

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <!-- 填充顏色 -->
    <solid android:color="@color/wx_green" />
    <!-- 線的寬度 -->
    <stroke
        android:width="5dp"
        android:color="@color/orchid"/>
    <!-- 矩形的圓角半徑 -->
    <corners android:radius="12dp" />

</shape>

矩形:填充+描邊+上部弧邊

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <!-- 填充顏色 -->
    <solid android:color="@color/wx_green" />
    <!-- 線的寬度 -->
    <stroke
        android:width="5dp"
        android:color="@color/orchid"/>
    <!-- 矩形的圓角半徑,設(shè)置四個角 -->
    <corners
        android:topLeftRadius="12dp"
        android:topRightRadius="12dp"
        android:bottomLeftRadius="0dp"
        android:bottomRightRadius="0dp"/>

</shape>

矩形:填充+描邊虛線+弧邊半圓

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <!-- 填充顏色 -->
    <solid android:color="@color/wx_green" />
    <!-- 線的寬度,虛線寬度猫牡,虛線間隔 -->
    <stroke
        android:width="5dp"
        android:color="@color/orchid"
        android:dashWidth="5dp"
        android:dashGap="3dp"/>
    <!-- 矩形的圓角半徑,半圓形胡诗,設(shè)置大一點就好了 -->
    <corners android:radius="100dp" />

</shape>
2、Oval-圖圓形樣式
shape-oval.png

橢圓形+橫向漸變色淌友,沒有調(diào)整角度

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval" >
    <!--漸變色:線性-->
    <gradient
        android:type="linear"
        android:angle="0"
        android:startColor="@color/wx_red"
        android:centerColor="@color/wx_green"
        android:endColor="@color/yellow"/>

</shape>

橢圓形:圓形+發(fā)射形漸變色煌恢,如果設(shè)置的高寬大于gradientRadius*2的話,那么外圍顏色是endColor

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <!--漸變色:放射震庭,必須設(shè)置android:gradientRadius
    如果設(shè)置的高寬大于gradientRadius*2的話瑰抵,那么外圍顏色是endColor-->
    <gradient
        android:type="radial"
        android:startColor="@color/white"
        android:endColor="@color/wx_green"
        android:gradientRadius="60dp"/>

</shape>

橢圓形:圓形+掃描漸變色

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <!--漸變色:放射,必須設(shè)置android:gradientRadius-->
    <gradient
        android:type="sweep"
        android:startColor="@color/wx_green"
        android:endColor="@color/white"
        android:gradientRadius="20dp"/>

</shape>
3归薛、Ring-環(huán)形樣式
shape-ring.png

環(huán)形:只有填充色谍憔,inner內(nèi)部沒顏色匪蝙,外環(huán)是填充色

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring"
    android:innerRadius="40dp"
    android:thickness="10dp"
    android:useLevel="false">

    <solid android:color="@color/wx_green"/>

</shape>

環(huán)形:有填充顏色和描邊

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring"
    android:innerRadius="40dp"
    android:thickness="10dp"
    android:useLevel="false">
    <solid android:color="@color/wx_green"/>
    <!-- 線的寬度 -->
    <stroke
        android:width="5dp"
        android:color="@color/orchid"/>

</shape>

環(huán)形:sweep的漸變色環(huán),加上rotate可以變成loading框

<?xml version="1.0" encoding="utf-8"?>
<!--加上rotate可以變成loading等待框或者進度框-->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring"
    android:innerRadius="40dp"
    android:thickness="10dp"
    android:useLevel="false">

    <gradient
        android:endColor="@color/wx_green"
        android:startColor="@color/white"
        android:type="sweep" />

</shape>

\color{red}{1.ring的話放在view中最好算一下尺寸习贫,就是(內(nèi)環(huán)+外環(huán)+線)*2=尺寸 }
\color{red}{ 2.android:useLevel="false" 需要加上去逛球,不然顯示不出來}

4、Line-線形樣式
shape-line.png

線形:實線苫昌,只能是橫向的颤绕,另外可以設(shè)置size

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="line">
    <stroke
        android:width="3dp"
        android:color="@color/orchid"/>

</shape>

線性:虛線,如果要顯示的話祟身,必須加上android:layerType="software"

<?xml version="1.0" encoding="utf-8"?>
<!--要顯示虛線必須view加上:android:layerType="software"-->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="line">
    <stroke
        android:width="3dp"
        android:color="@color/orchid"
        android:dashWidth="5dp"
        android:dashGap="3dp"/>

</shape>

\color{green}{=======================================}

二奥务、selector - StateListDrawable:不同狀態(tài)選擇不同的圖樣

>>標簽含義

1、selector下的item標簽

1.1.作為drawable資源使用時袜硫,一般和shape一樣放于drawable目錄下氯葬,item必須指定android:drawable屬性。
1.2.作為color資源使用時婉陷,則放于color目錄下帚称,item必須指定android:color屬性。

屬性 含義
drawable color顏色或者其他drawable或圖片等
state_enabled 設(shè)置觸摸或點擊事件是否可用狀態(tài)**秽澳,一般只在false時設(shè)置該屬性闯睹,表示不可用狀態(tài)
state_pressed 設(shè)置是否按壓狀態(tài)**,一般在true時設(shè)置該屬性担神,表示已按壓狀態(tài)楼吃,默認為false
state_selected 設(shè)置是否選中狀態(tài)**,true表示已選中妄讯,false表示未選中
state_checked 設(shè)置是否勾選狀態(tài)**孩锡,主要用于CheckBox和RadioButton,true表示已被勾選捞挥,false表示未被勾選
state_checkable 設(shè)置勾選是否可用狀態(tài)**浮创,類似state_enabled,只是state_enabled會影響觸摸或點擊事件砌函,state_checkable影響勾選事件
state_focused 設(shè)置是否獲得焦點狀態(tài)**斩披,true表示獲得焦點,默認為false讹俊,表示未獲得焦點
state_window_focused 設(shè)置當前窗口是否獲得焦點狀態(tài)**垦沉,true表示獲得焦點,false表示未獲得焦點仍劈,例如拉下通知欄或彈出對話框時厕倍, 當前界面就會失去焦點;另外贩疙,ListView的ListItem獲得焦點時也會觸發(fā)true狀態(tài)讹弯,可以理解為當前窗口就是ListItem本身
state_activated 設(shè)置是否被激活狀態(tài)**况既,true表示被激活,false表示未激活组民,API Level 11及以上才支持棒仍,可通過代碼調(diào)用控件的setActivated(boolean)方法設(shè)置是否激活該控件
state_hovered 設(shè)置是否鼠標在上面滑動的狀態(tài)**,true表示鼠標在上面滑動臭胜,默認為false莫其,API Level 14及以上才支持
exitFadeDuration 狀態(tài)改變時,舊狀態(tài)消失時的淡出時間耸三,以毫秒為單位
enterFadeDuration 狀態(tài)改變時乱陡,新狀態(tài)展示時的淡入時間,以毫秒為單位

>>案例

1仪壮、下面就用兩個button一個checkbox來說明吧
1.button不能按憨颠,checkbox不能選中
2.button可以按并按中,checkbox選中了
3.又再次關(guān)閉使用睛驳,button2是1的優(yōu)化版烙心,還帶有弧角
2膜廊、代碼部分

\color{red}{注意item不能直接用color不然異常乏沸,得用drawable }
2.1.button

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!--異常:tag requires a 'drawable' attribute or child tag defining a drawable
     可用drawable下的shape中添加color顏色值-->
    <!--<item android:state_enabled="false" android:color="@color/gray_5"/>-->
    <!--不可用-->
    <item android:state_enabled="false" android:drawable="@color/gray_5"/>
    <!--未按壓-->
    <item android:state_enabled="true"
        android:state_pressed="false" android:drawable="@color/green" />
    <!--光標在-->
    <item android:state_enabled="true"
        android:state_focused="true" android:drawable="@color/lightgreen" />
    <!--按壓-->
    <item android:state_enabled="true"
        android:state_pressed="true" android:drawable="@color/orange" />
</selector>

2.2.checkbox

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!--不可用,未選中-->
    <item android:state_enabled="false"
        android:state_checked="false"
        android:drawable="@mipmap/un_check_gray"/>
    <!--不可用爪瓜,選中-->
    <item android:state_enabled="false"
        android:state_checked="true"
        android:drawable="@mipmap/is_check_gray"/>
    <!--可用蹬跃,未選中-->
    <item android:state_enabled="true"
        android:state_checked="false"
        android:drawable="@mipmap/un_check_purl"/>
    <!--可用,選中-->
    <item android:state_enabled="true"
        android:state_checked="true"
        android:drawable="@mipmap/is_check_purl"/>
</selector>

2.3.button2

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    
     <item android:state_pressed="false">   
       <shape android:shape="rectangle">
            <!-- 填充顏色 -->
            <solid android:color="?attr/colorPrimary"></solid>
            <!-- 線的寬度铆铆,顏色灰色 -->
            <stroke android:width="0dp" android:color="#D5D5D5"></stroke> 
            <!-- 矩形的圓角半徑 -->
            <corners android:radius="6dip" /> 
        </shape>  
     </item>   
        
     <item android:state_focused="true">   
       <shape android:shape="rectangle">
            <!-- 填充顏色 -->
            <solid android:color="?attr/colorPrimary"></solid>
            <!-- 線的寬度蝶缀,顏色灰色 -->
            <stroke android:width="0dp" android:color="#D5D5D5"></stroke> 
            <!-- 矩形的圓角半徑 -->
            <corners android:radius="6dip" /> 
        </shape>  
     </item>   
        
    <item android:state_pressed="true">   
       <shape android:shape="rectangle">
            <!-- 填充顏色 -->
            <solid android:color="?attr/colorAccent"></solid>
            <!-- 線的寬度,顏色灰色 -->
            <stroke android:width="0dp" android:color="#D5D5D5"></stroke> 
            <!-- 矩形的圓角半徑 -->
            <corners android:radius="6dip" /> 
        </shape>  
     </item>   

</selector>

\color{green}{=======================================}

三薄货、layer-list - LayerDrawable:層疊圖樣

>>標簽含義

1翁都、layer-list下的item標簽。上面已經(jīng)講過了谅猾,item下面能放各種樣式的drawable或者shape圖樣

>>案例

1柄慰、上左右,亂七八糟陰影税娜,內(nèi)部漸變色坐搔,坐上右上弧角
2、陰影圖案
layer-list.png
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <!--radius top_left,top_right-->
    <!--shadow top,left,right-->

    <!--從外到內(nèi)敬矩,層層遞進-->

    <!-- 最外層:上左右距外圍2dp概行,內(nèi)部是漸變色1、右上帶弧度的矩形 -->
    <item
        android:left="2dp"
        android:right="2dp"
        android:top="2dp">
        <shape android:shape="rectangle" >
            <solid android:color="@color/gray_3" />

            <corners android:topLeftRadius="12dp"
                android:topRightRadius="12dp"
                android:bottomRightRadius="0dp"
                android:bottomLeftRadius="0dp"/>
        </shape>
    </item>

    <!-- 第二層:上左右距外圍4dp弧岳,內(nèi)部是漸變色2凳忙、右上帶弧度的矩形 -->
    <item
        android:left="4dp"
        android:right="4dp"
        android:top="4dp">
        <shape android:shape="rectangle">
            <solid android:color="@color/gray_5" />

            <corners android:topLeftRadius="12dp"
                android:topRightRadius="12dp"
                android:bottomRightRadius="0dp"
                android:bottomLeftRadius="0dp"/>
        </shape>
    </item>

    <!-- 第三層:上左右距外圍6dp组去,內(nèi)部是漸變色3、右上帶弧度的矩形 -->
    <item
        android:left="6dp"
        android:right="6dp"
        android:top="6dp">
        <shape android:shape="rectangle">
            <solid android:color="@color/gray_7" />

            <corners android:topLeftRadius="12dp"
                android:topRightRadius="12dp"
                android:bottomRightRadius="0dp"
                android:bottomLeftRadius="0dp"/>
        </shape>
    </item>


    <!-- 最內(nèi)層:上左右距外圍8dp曾我,內(nèi)部是漸變色的左上章钾、右上帶弧度的矩形 -->
    <item
        android:left="8dp"
        android:right="8dp"
        android:top="8dp">
        <shape android:shape="rectangle">

            <gradient
                android:angle="45"
                android:startColor="@color/wx_green"
                android:endColor="@color/limegreen"
                android:type="linear"/>

            <corners android:topLeftRadius="12dp"
                android:topRightRadius="12dp"
                android:bottomRightRadius="0dp"
                android:bottomLeftRadius="0dp"/>

        </shape>
    </item>

</layer-list>

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <!--底層的左邊距離上層左邊3dp, 底層的頂部,距離上層的頂部6dp,如果不做這個控制艺演,底層和上層的左側(cè)和上側(cè)會重合在一起-->
    <item android:left="3dp"
        android:top="6dp">
        <shape>
            <solid android:color="#b4b5b6"/>
        </shape>
    </item>

    <!--上層的右邊距離底層的右邊3dp, 上層的底部距離底層的底部6dp-->
    <item android:bottom="6dp"
        android:right="3dp">
        <shape>
            <solid android:color="#fff"/>
        </shape>
    </item>
</layer-list>

\color{green}{=======================================}

四却紧、level-list - LevelListDrawable:不同程度圖樣

1、level-list下的item標簽胎撤。
屬性 含義
minLevel 最小值
maxLevel 最大值
drawable 圖樣

>>案例:比方說電量晓殊、wifi質(zhì)量,音量等

battery_level.png

\color{red}{注意:此處level的值必須從小到大伤提,不然會空指針異常}

<?xml version="1.0" encoding="utf-8"?>
<!--此處有個坑巫俺,順訊必須從小到大-->
<level-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:minLevel="0" android:maxLevel="19" android:drawable="@drawable/battery_0" />
    <item android:minLevel="20" android:maxLevel="39" android:drawable="@drawable/battery_1" />
    <item android:minLevel="40" android:maxLevel="59" android:drawable="@drawable/battery_2" />
    <item android:minLevel="60" android:maxLevel="79" android:drawable="@drawable/battery_3" />
    <item android:minLevel="80" android:maxLevel="99" android:drawable="@drawable/battery_4" />
    <item android:minLevel="100" android:maxLevel="100" android:drawable="@drawable/battery_5" />
</level-list>
       iv_level_battery.getDrawable().setLevel(25);
        iv_level_battery_2.getDrawable().setLevel(63);
        iv_level_battery_3.getDrawable().setLevel(100);

\color{green}{=======================================}

五、transition - TransitionDrawable:漸變圖樣

>>標簽含義

1肿男、transition下的item標簽介汹。上面已經(jīng)講過了,item下面能放各種樣式的drawable或者shape圖樣還有自己的屬性top,left等

>>案例

1舶沛、電量變化
draw_transition.gif
<?xml version="1.0" encoding="utf-8"?>
<transition xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@mipmap/battery_1" />
    <item android:drawable="@mipmap/battery_5" />
</transition>
//得到一個Drawable嘹承,屬于 TransitionDrawable 類型的
        TransitionDrawable transition = (TransitionDrawable)getResources().
                getDrawable(R.drawable.draw_transition);

        iv_transition_battery.setImageDrawable(transition);
        transition.startTransition(2000); // 設(shè)定漸變的變化市場

\color{green}{=======================================}

六、ripple - RippleDrawable:波紋圖樣

>>標簽含義

1如庭、ripple有下的item標簽叹卷。上面已經(jīng)講過了,item下面能放各種樣式的drawable或者shape圖樣還有自己的屬性top,left等
ripple屬性 含義
color 波紋顏色
tools:targetApi lollipop坪它,必須這個api以上才能用

>>案例

1骤竹、波紋變化,外放往毡,內(nèi)部與顏色疊加蒙揣。gif圖片播放太快了,實際沒那么快
draw_ripple.2018-10-19 14_58_15.gif

1.1开瞭、單純ripple懒震,控件高度是wrap_content的話,那么波紋外擴

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:color="@color/red"
    tools:targetApi="lollipop">


</ripple>

1.2惩阶、加一個item挎狸,有背景色,那么不會外擴断楷,含定在此drawable中了

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:color="@color/red"
    tools:targetApi="lollipop">

    <item
        android:drawable="@color/wx_green" />

</ripple>

1.3锨匆、加一個蒙版遮罩,范圍限定了,但是drawable設(shè)置顏色無用

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:color="@color/red"
    tools:targetApi="lollipop">

    <!--mask遮罩恐锣,設(shè)置的drawable顏色會失效-->
    <item
        android:id="@android:id/mask"
        android:drawable="@color/wx_green" />

</ripple>

1.4茅主、弧角矩形按鈕點擊波紋效果

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:color="@color/red"
    tools:targetApi="lollipop">

    <item>
        <shape android:shape="rectangle">
            <solid android:color="@color/wx_green" />
            <corners android:radius="12dp" />
        </shape>
    </item>

</ripple>

\color{green}{=======================================}

七、inset - InsetDrawable:內(nèi)嵌圖樣

>>標簽含義

1土榴、inset有下的shape標簽诀姚。
inset屬性 含義
insetTop 嵌入內(nèi)部上邊
insetBottom 嵌入內(nèi)部下邊
insetLeft 嵌入內(nèi)部左邊
insetRight 嵌入內(nèi)部右邊

>>案例

1、內(nèi)嵌一個圖案玷禽、感覺沒太大用~~
inset.png
<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:insetTop="10dp"
    android:insetBottom="10dp"
    android:insetLeft="10dp"
    android:insetRight="10dp">

    <!--待會要插入的一個藍色的矩形-->
    <shape android:shape="rectangle" >
        <solid android:color="@color/orange" />
    </shape>

</inset>

\color{green}{=======================================}

八赫段、scale - ScaleDrawable:縮放圖樣

>>標簽含義

1、scale標簽矢赁。
scale屬性 含義
drawable 資源引用
scaleGravity 縮放的方向, 比如: top, 縮放的時候就會向頂部靠攏,bottom, 縮放時會想底部靠攏;
scaleHeight 表示Drawable能夠在高度上縮放的百分比, 比如: 50%,
scaleWidth 表示Drawable能夠在寬度上縮放的百分比, 同上

>>案例

1糯笙、一般做圖片的縮放時候用到
draw_scale.gif
<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/android"
    android:scaleGravity="left"
    android:scaleWidth="50%"
    android:scaleHeight="100%"
    >

</scale>

\color{red}{注意,此ScaleDrawable要配合setLevel一起用撩银,level在0-10000內(nèi)}

//Scale Drawable不能單獨的使用, 他需要配合Level等級使用, level的取值是0~10000, (0為不可見)
        sk_scale.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
                int max = seekBar.getMax();
                double scale = (double)progress/(double)max;
                ScaleDrawable drawable = (ScaleDrawable) iv_scale.getDrawable();
                drawable.setLevel((int) (10000*scale));
            }
            @Override
            public void onStartTrackingTouch(SeekBar seekBar) { }
            @Override
            public void onStopTrackingTouch(SeekBar seekBar) { }
        });

\color{green}{=======================================}

九给涕、clip - ClipDrawable:剪切的圖樣

>>標簽含義

1、clip標簽额获。
clip屬性 含義
drawable 資源引用
clipOrientation top\bottom\left\right\gravity,fill... 橫向够庙,豎向,中間...
gravity left,right,top,bottom--哪個方向開始

>>案例

1抄邀、一般可用作溫度計啊耘眨、聲音啊,各種程度的東西撤摸。
draw_clip.gif
<?xml version="1.0" encoding="utf-8"?>
<clip xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/draw_shape_rectangle_linear_gradient"
    android:clipOrientation="horizontal"
    android:gravity="left">

</clip>
//Clip Drawable也要level才有用
        sk_clip.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
                int max = seekBar.getMax();
                double scale = (double)progress/(double)max;
                ClipDrawable drawable = (ClipDrawable) tv_clip.getBackground();
                drawable.setLevel((int) (10000*scale));
                tv_clip.setText("Clip Progress = "+progress);
            }
            @Override
            public void onStartTrackingTouch(SeekBar seekBar) {}
            @Override
            public void onStopTrackingTouch(SeekBar seekBar) {}
        });

\color{green}{=======================================}

十毅桃、rotate - RotateDrawable:旋轉(zhuǎn)圖樣

>>標簽含義

1、rotate標簽准夷。
clip屬性 含義
drawable 資源引用
visible 是否可見
pivotX pivotX表示旋轉(zhuǎn)軸心在x軸橫坐標上的位置,用百分比表示莺掠,表示在當前drawable總寬度百分之幾的位置衫嵌。
pivotY 同上,Y軸方向的
fromDegrees 從什么角度開始
toDegrees 到什么角度

>>案例

1彻秆、一般可用作循環(huán)的東西楔绞,比如唱片啊,loading等待框啊~~
draw_rotate.gif
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/draw_shape_ring_gradient"
    android:fromDegrees="0"
    android:toDegrees="360">

</rotate>
//Rotate Drawable也要level才有用
        sk_rotate.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
                int max = seekBar.getMax();
                double scale = (double)progress/(double)max;
                RotateDrawable drawable = (RotateDrawable) tv_rotate.getBackground();
                drawable.setLevel((int) (10000*scale));
                tv_rotate.setText("Rotate Progress = "+progress);
            }
            @Override
            public void onStartTrackingTouch(SeekBar seekBar) {}
            @Override
            public void onStopTrackingTouch(SeekBar seekBar) {}
        });

\color{green}{=======================================}

十一唇兑、animation-list - AnimationDrawable:動畫效果圖樣

>>標簽含義

1酒朵、animation-list標簽下有item(drawable和duration屬性)標簽。
animation-list屬性 含義
oneshot 是否一次扎附,不然就是循環(huán)

>>案例

1蔫耽、歡迎界面展示啊等等。留夜。匙铡。
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false">
    <item android:drawable="@drawable/battery_1" android:duration="200"/>
    <item android:drawable="@drawable/battery_3" android:duration="200"/>
    <item android:drawable="@drawable/battery_5" android:duration="200"/>
</animation-list>
//AnimationDrawable mAnimationDrawable = new AnimationDrawable();
//mAnimationDrawable.addFrame(getResources().getDrawable(R.color.blue01), 150);
 //mAnimationDrawable.addFrame(getResources().getDrawable(R.color.blue02), 150);
 //mAnimationDrawable.addFrame(getResources().getDrawable(R.color.blue03), 150);
 //mAnimationDrawable.addFrame(getResources().getDrawable(R.color.blue04), 150);
 //mAnimationDrawable.addFrame(getResources().getDrawable(R.color.blue05), 150);
//mAnimationDrawable.setOneShot(false);

AnimationDrawable a = (AnimationDrawable)btn_animation_list.getBackground();
        a.start();//a.stop \ a.isRunning()

\color{green}{=======================================}

十二图甜、bitmap - BitmapDrawable

1、截圖
bd-mirror.png
bd-repeat.png
bd-clamp.png
bd-disabled.png
2鳖眼、內(nèi)容
xml屬性 含義 代碼
src 資源:color\drawable -
antialias 抗鋸齒黑毅,建議開啟 bitmapDrawable.setAntiAlias(true);
dither 顫抖處理:平滑,飽滿钦讳,清晰矿瘦,建議開啟 bitmapDrawable.setDither(true);
filter 位圖過濾:平滑,建議開啟 bitmapDrawable.setFilterBitmap(true);
gravity 位置[start,end,top,bottom,center...] bitmapDrawable.setGravity(Gravity.START);
mipMap 文理映射愿卒,建議關(guān)閉 bitmapDrawable.setMipMap(false);
tileMode 平鋪方式
disabled-不使用平鋪
clamp-復制邊緣色彩
repeat-重復
mirror-鏡像]
bitmapDrawable.setTileModeXY(Shader.TileMode.CLAMP,Shader.TileMode.CLAMP);
bitmapDrawable.setTileModeXY(Shader.TileMode.REPEAT,Shader.TileMode.REPEAT);
bitmapDrawable.setTileModeXY(Shader.TileMode.MIRROR,Shader.TileMode.MIRROR);
3匪凡、代碼
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
    android:src="@drawable/android"
    android:antialias="true"
    android:dither="true"
    android:filter="true"
    android:gravity="left"
    android:mipMap="false"
    android:tileMode="repeat"
    />
Bitmap bitmap = BitmapFactory.decodeResource(instance.getResources(),
                        R.drawable.android);//drawable\mipmap\color...
BitmapDrawable bitmapDrawable = new BitmapDrawable(bitmap);
bitmapDrawable.setAntiAlias(true);//抗鋸齒
bitmapDrawable.setDither(true);//抖動平滑
bitmapDrawable.setFilterBitmap(true);//過濾平滑
bitmapDrawable.setGravity(Gravity.START);
//bitmapDrawable.setMipMap(false);

//復制邊緣色彩
bitmapDrawable.setTileModeXY(Shader.TileMode.CLAMP,Shader.TileMode.CLAMP);
//重復
bitmapDrawable.setTileModeXY(Shader.TileMode.REPEAT,Shader.TileMode.REPEAT);
//鏡像
bitmapDrawable.setTileModeXY(Shader.TileMode.MIRROR,Shader.TileMode.MIRROR);

ll_bitmap_drawale.setBackground(bitmapDrawable);

\color{green}{=======================================}

十三、nine-patch - NinePatchDrawable

1掘猿、這個是.9圖病游,使用方法和上面bitmap類似,不贅述稠通。好處是可以動態(tài)拉伸此圖片某些邊的時候而不造成整體變形衬衬。
<?xml version="1.0" encoding="utf-8"?>
<nine-patch
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:src="@color/colorPrimary"
    android:antialias="true"
    android:dither="true"
    android:filter="true"
    android:gravity="center"
    android:mipMap="false"
    android:tileMode="disabled"
    />
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市改橘,隨后出現(xiàn)的幾起案子滋尉,更是在濱河造成了極大的恐慌,老刑警劉巖飞主,帶你破解...
    沈念sama閱讀 222,378評論 6 516
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件狮惜,死亡現(xiàn)場離奇詭異,居然都是意外死亡碌识,警方通過查閱死者的電腦和手機碾篡,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,970評論 3 399
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來筏餐,“玉大人开泽,你說我怎么就攤上這事】桑” “怎么了穆律?”我有些...
    開封第一講書人閱讀 168,983評論 0 362
  • 文/不壞的土叔 我叫張陵,是天一觀的道長导俘。 經(jīng)常有香客問我峦耘,道長,這世上最難降的妖魔是什么旅薄? 我笑而不...
    開封第一講書人閱讀 59,938評論 1 299
  • 正文 為了忘掉前任辅髓,我火速辦了婚禮,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘利朵。我一直安慰自己律想,他們只是感情好,可當我...
    茶點故事閱讀 68,955評論 6 398
  • 文/花漫 我一把揭開白布绍弟。 她就那樣靜靜地躺著技即,像睡著了一般。 火紅的嫁衣襯著肌膚如雪樟遣。 梳的紋絲不亂的頭發(fā)上而叼,一...
    開封第一講書人閱讀 52,549評論 1 312
  • 那天,我揣著相機與錄音豹悬,去河邊找鬼葵陵。 笑死,一個胖子當著我的面吹牛瞻佛,可吹牛的內(nèi)容都是我干的脱篙。 我是一名探鬼主播,決...
    沈念sama閱讀 41,063評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼伤柄,長吁一口氣:“原來是場噩夢啊……” “哼绊困!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起适刀,我...
    開封第一講書人閱讀 39,991評論 0 277
  • 序言:老撾萬榮一對情侶失蹤秤朗,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后笔喉,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體取视,經(jīng)...
    沈念sama閱讀 46,522評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,604評論 3 342
  • 正文 我和宋清朗相戀三年常挚,在試婚紗的時候發(fā)現(xiàn)自己被綠了作谭。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,742評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡待侵,死狀恐怖丢早,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情秧倾,我是刑警寧澤,帶...
    沈念sama閱讀 36,413評論 5 351
  • 正文 年R本政府宣布傀缩,位于F島的核電站那先,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏赡艰。R本人自食惡果不足惜售淡,卻給世界環(huán)境...
    茶點故事閱讀 42,094評論 3 335
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧揖闸,春花似錦揍堕、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,572評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至贮泞,卻和暖如春楞慈,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背啃擦。 一陣腳步聲響...
    開封第一講書人閱讀 33,671評論 1 274
  • 我被黑心中介騙來泰國打工囊蓝, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人令蛉。 一個月前我還...
    沈念sama閱讀 49,159評論 3 378
  • 正文 我出身青樓聚霜,卻偏偏與公主長得像,于是被迫代替她去往敵國和親珠叔。 傳聞我的和親對象是個殘疾皇子蝎宇,可洞房花燭夜當晚...
    茶點故事閱讀 45,747評論 2 361

推薦閱讀更多精彩內(nèi)容