Android Drawable Resources 之 Shape Drawable 使用詳解

一、簡介

Shape 是可以定義幾何形狀的XML文件,包括顏色和漸變等等。用作控件背景、填充色。

文件位置:res/drawable/filename.xml

語       法:


    <?xml version="1.0" encoding="utf-8"?>
    <shape
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape=["rectangle" | "oval" | "line" | "ring"] >
        <corners
            android:radius="integer"
            android:topLeftRadius="integer"
            android:topRightRadius="integer"
            android:bottomLeftRadius="integer"
            android:bottomRightRadius="integer" />
        <gradient
            android:angle="integer"
            android:centerX="float"
            android:centerY="float"
            android:centerColor="integer"
            android:endColor="color"
            android:gradientRadius="integer"
            android:startColor="color"
            android:type=["linear" | "radial" | "sweep"]
            android:useLevel=["true" | "false"] />
        <padding
            android:left="integer"
            android:top="integer"
            android:right="integer"
            android:bottom="integer" />
        <size
            android:width="integer"
            android:height="integer" />
        <solid
            android:color="color" />
        <stroke
            android:width="integer"
            android:color="color"
            android:dashWidth="integer"
            android:dashGap="integer" />
    </shape>


二、詳解

1、shape 根屬性(rectangle、oval、line、ring)

     android:shape=["rectangle" | "oval" | "line" | "ring"]   
     默認爲矩形,可以設置爲矩形(rectangle)、橢圓形(oval)、線性形狀(line)、環形(ring)   


2、corners  設置圓角,只有當 android:shape = "rectangle" 使用

     <corners
         android:radius="dimension"      //全部的圓角半徑   
         android:topLeftRadius="dimension"   //左上角的圓角半徑   
         android:topRightRadius="dimension"  //右上角的圓角半徑   
         android:bottomLeftRadius="dimension"    //左下角的圓角半徑   
         android:bottomRightRadius="dimension" />    //右下角的圓角半徑   


3、solid  設置內部填充色

     <solid android:color="color"/>


4、gradient  設置漸變色,可以定義兩色漸變和三色漸變,及漸變樣式

     <gradient  
         android:type=["linear" | "radial" | "sweep"]    //線性漸變(默認)、放射漸變、掃描式漸變   
         android:angle="integer"     //漸變角度,必須爲45的倍數,0爲從左到右,90爲從上到下   
         android:centerX="float"     //漸變中心X的相當位置,範圍爲0~1   
         android:centerY="float"     //漸變中心Y的相當位置,範圍爲0~1   
         android:startColor="color"   //漸變開始點的顏色   
         android:centerColor="color"  //漸變中間點的顏色
         android:endColor="color"    //漸變結束點的顏色   
         android:gradientRadius="float"  //漸變的半徑,只有當漸變類型爲radial時才能使用   
         android:useLevel=["true" | "false"] />  //使用LevelListDrawable時就要設置爲true。設爲false時纔有漸變效果  


5、stroke   設置描邊屬性,可以定義描邊的寬度,顏色,虛實線等

     <stroke        
         android:width="dimension"   //描邊的寬度   
         android:color="color"   //描邊的顏色   
         android:dashWidth="dimension"   //虛線的寬度,值爲0時是實線   
         android:dashGap="dimension" />      //虛線的間隔  

6、size  用來設置圖形的大小

     <size   
         android:width="dimension"   
         android:height="dimension" />

7、padding  用來設置view內容距邊界的距離

    <padding    
        android:left="dimension"   
        android:top="dimension"   
        android:right="dimension"   
        android:bottom="dimension" />

三、示例

1定義shape的XML文件gradient_box.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:startColor="#FFFF0000"
        android:endColor="#80FF00FF"
        android:angle="45"/>
    <padding android:left="7dp"
        android:top="7dp"
        android:right="7dp"
        android:bottom="7dp" />
    <corners android:radius="8dp" />
</shape>

2將這個XML文件添加到一個View

<TextView
    android:background="@drawable/gradient_box"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content" />

3、使用java代碼獲取shape drawable,並且添加到View

Resources res = getResources();
Drawable shape = res. getDrawable(R.drawable.gradient_box);

TextView tv = (TextView)findViewByID(R.id.textview);
tv.setBackground(shape);




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