1. 程式人生 > >Shape Drawable的學習

Shape Drawable的學習

完整的shape定義語法有:

[html] view plaincopyprint?
  1. <?xmlversion="1.0"encoding="utf-8"?>
  2. <shape
  3.     xmlns:android="http://schemas.android.com/apk/res/android"
  4.     android:shape=["rectangle" | "oval" | "line" | "ring"]   
  5.     android:innerRadius="integer"
  6.     android:innerRadiusRatio="integer"
  7.     android:thickness
    ="integer"
  8.     android:thicknessRatio="integer"
  9.     android:useLevel="boolean"
  10.     >
  11.     <corners
  12.         android:radius="integer"
  13.         android:topLeftRadius="integer"
  14.         android:topRightRadius="integer"
  15.         android:bottomLeftRadius="integer"
  16.         android:bottomRightRadius="integer"
    />
  17.     <gradient
  18.         android:angle="integer"
  19.         android:centerX="float"
  20.         android:centerY="float"
  21.         android:centerColor="integer"
  22.         android:endColor="color"
  23.         android:gradientRadius="integer"
  24.         android:startColor="color"
  25.         android:type=["linear" | "radial" | "sweep"]  
  26.         android:useLevel=["true" | "false"] />
  27.     <padding
  28.         android:left="integer"
  29.         android:top="integer"
  30.         android:right="integer"
  31.         android:bottom="integer"/>
  32.     <size
  33.         android:width="integer"
  34.         android:height="integer"/>
  35.     <solid
  36.         android:color="color"/>
  37.     <stroke
  38.         android:width="integer"
  39.         android:color="color"
  40.         android:dashWidth="integer"
  41.         android:dashGap="integer"/>
  42. </shape>

節點一:<shape>

該節點有7個屬性,其中後5個是當android:shape="ring"時才有效的。

android:shape指定當前定義的是哪一種形狀,可取的值有rectangle(矩形)、oval(橢圓)、line(直線)、ring(圓環)

當android:shape="ring"時,<shape>節點的後5個屬性才有效果

android:innerRadius——指定圓環內圓的半徑,比如50dp、100dp之類的。

android:innerRadiusRatio——該值是以比例的形式來指定內圓半徑。內圓半徑等於該shape的寬除以該值。或者說該值的倒數代表了內圓半徑佔整個shape寬的比例。預設值是9。當該值等於2的時候,內圓就將佔滿整個shape,從而我們將看不到圓環。

android:thickness——指定圓環的寬窄,也就是內圓與外圓的距離。

android:thicknessRatio——以比例的形式來指定圓環的寬窄。其演算法與innerRadiusRatio相同。

android:useLevel——值為true意味著這是一個levelListDrawable(關於levelListDrawable又是另一個話題了)。當我們要畫一個圓環是,應當而且必須將該值設為false,否則會看不到畫面。

節點二:<corners>

只用於矩形(android:shape="rectangle"),用於設定矩形的4個角的圓角半徑,生成圓角矩形。

android:radius——同時設定矩形4個角的圓角半徑,如上圖就是值為10dp的效果。

android:topLeftRadius——左上角圓角半徑

android:topRightRadius——右上角圓角半徑

android:bottomLeftRadius——左下角圓角半徑

android:bottomRightRadius——右下角圓角半徑

這四個單獨的設定的值會覆蓋android:radius設定的值。

節點三:<padding>

此內邊距設定顯示於該shape之上的內容與該shape的邊界的距離。比如如果將該shape設為一個TextView的背景,那麼這裡的內邊距就會影響TextView上文字的位置。

節點四:<size>

用於矩形時,設定矩形的寬高;

用於橢圓時,設定橢圓外切矩形的寬高,當寬與高相等時,為正圓,否則為橢圓;

用於直線時,寬代表了直線的長度,高沒有效果

用於圓環時,寬會影響內圓半徑和圓環的寬窄,高沒有效果。

當我們將一個shape drawable作為一個View元件的背景或是內容時,通常這個drawable都會被縮放。所以實際顯示的時候可能與這裡的size設定不相符。

節點五:<solid>

solid有“實心的,純質的”的意思,比如solid gold意為“純金”,solid color意味“純色”。

這裡這個節點只有一個屬性——android:color,用這種顏色來填充該shape內部,如果不設定該shape的邊框,就能得到一張純色的drawable。

用於直線時無效。

節點六:<stroke>

stroke有“用筆畫出來的軌跡,筆畫”的意思,這裡指shape的邊框。

用於矩形和橢圓時,設定其外邊界

用於直線時,呃,直線就是用這個節點來設定的。

用於圓環時,會同時影響內圓和外圓。

android:width——邊框線條的寬度,特別地,用於直線時設定直線的粗細。

android:color——設定線條的顏色

android:dashWidth——設定虛線效果裡實點的長度

android:dashGap——設定虛線效果裡空白點的長度

上圖是dashWidth="10dp"  dashGap="5dp"時的效果

節點七:<gradient>

把這個節點放在最後說,因為這個節點最複雜。

該節點總共有9個屬性,用來設定圖形裡的顏色漸變效果,與<solid>都是填充的一種,如:

其中必須的是startColor或endColor,指定漸變的起始顏色和結束顏色。注意我用的“或”而不是“和”。這二者如果都沒有,則看不到漸變效果;如果只有其一,那麼預設另一個就是白色。

如果同時有<solid>節點填充,則寫在後面的會覆蓋寫在前面的,讓寫在前面的設定無效。這與<corners>節點裡先寫android:radius後寫android:topRightRadius還是先寫android:topRightRadius後寫android:radius不同。android:topRightRadius的優先順序總是比android:radius高。

android:type——設定漸變的型別。有三種類型的漸變:

linear(線性漸變):

這也是預設值。

radial(徑向漸變):

需要注意的是使用radial漸變時還必須設定android:gradientRadius屬性,即設定漸變區域(一個圓)的半徑。

sweep(掃描漸變):

就像雷達掃描一樣。方向是順時針方向漸變。

android:angle——當android:type的值為linear時有效,即只用於線性漸變。指定線性漸變的角度,其實就是指定線性漸變的方向。預設值是0,從左向右漸變。該屬性的值必須是45的倍數,否則執行時error。這也意味著其實線性漸變只有8個方向:從左向右、左下到右上、從下向上、右下到左上、從右向左、右上到左下、從上向下、左上到右下。

值為0時:

值為45時:

android:centerX、android:centerY——用於徑向漸變和掃描漸變,使用相對比例座標設定漸變的中心點位置。取值範圍為0到1。

比如兩個均取值為0.8時的掃描漸變效果:

android:centerColor——設定漸變的中間顏色,即先由startColor漸變到centerColor,再由centerColor漸變到endColor。比如:

android:useLevel——值為true時代表這是一個levelListDrawable。

與<shape>節點裡當android:shape="ring"時必須設定android:useLevel="false"不同,這裡可以不設定(預設就是false)。

在程式當中,使用該shape drawable時,最終將編譯成一個GradientDrawable對像。