歡迎來到Linux教程網
Linux教程網
Linux教程網
Linux教程網
Linux教程網 >> Linux編程 >> Linux編程 >> Android UI美化之Shape Drawable的使用

Android UI美化之Shape Drawable的使用

日期:2017/3/1 11:09:10   编辑:Linux編程

想美化一下程序裡的EditText,發現網上關於美化的文章較少,即使有也大多是直接翻譯文檔,索性一邊研讀一邊寫例子。

先看一下文檔對Shape Drawable的描述:

Shape Drawable
An XML file that defines a geometric shape, including colors and gradients. Creates aShapeDrawable. 一個定義幾何形狀的XML文件,包括顏色和漸變。創建一個ShpeDrawable對象
用Android:background="@drawable/xxx.xml"或相應的Java代碼引用,Shape Drawable說白了就是可自定義的多樣化的背景。
現在對比較重要的標簽和屬性進行解釋:

和其它drawable文件一樣,在drawable目錄下創建xml文件,以<shape>為根元素,有兩個重要屬性

1、xmlns:android="http://schemas.android.com/apk/res/android" 這個不說了,必填

2、android:shape 定義shape的形狀有4個值"rectangle","oval","line","ring"分別是矩形、橢圓、線型和環形,一般用的較多的是前兩種

shape元素下的其它屬性均僅適用於android:shape="ring"時。

Shape的子元素包括

<corners>
<gradient>

<padding> 
<size> 
<solid> 
<stroke> 
<corners>指定邊角的半徑,簡單的說,數值越大角越圓,數值越小越趨近於直角,參數為:
  1. android:radius="integer"
  2. android:topLeftRadius="integer"
  3. android:topRightRadius="integer"
  4. android:bottomLeftRadius="integer"
  5. android:bottomRightRadius="integer"
 android:radius直接指定4個角的半徑,另外4個屬性可以單獨設置4個角的角度

<gradient>的作用是設置顏色漸變,有以下屬性

  1. android:angle="integer" 設置漸變的角度,數值必須為45的倍數,默認為0,即從左到右漸變。當值為90時,從下到上漸變,以此類推當值為180時
  2. 為270時從上向下漸變。
  3. android:centerX="integer" 漸變的水平中心點,值為0-1.0
  4. android:centerY="integer" 漸變的垂直中心點,值為0-1.0
  5. android:centerColor="integer" 中心的顏色,非必須
  6. android:endColor="color" 結束漸變時的顏色
  7. android:gradientRadius="integer" 漸變的半徑,僅適用於android:type="radial"
  8. android:startColor="color" 開始漸變時的顏色
  9. android:type=["linear" | "radial" | "sweep"] 漸變的類型,分別為線狀、中心放射狀、經測試類似於雷達掃描的一種形態(詞匯匮乏不知道該怎麼翻譯,⊙﹏⊙b汗)
  10. android:usesLevel=["true" | "false"] 貌似是可以被當做level-list用的意思

<padding>是為內容或子標簽設置邊距,4個屬性top、bottom、left、right,需要注意的是這個標簽的作用是為內容設置與當前應用此shape的View的邊距,而不是設置當前View與父元素的邊距。

<size>就不用說了,設置背景大小,width和height倆屬性。

<solid>只有一個屬性,即color,設置整個背景的顏色,如果已經定義了漸變色,那麼這個屬性就無效了。

<stroke> 描邊,即設置邊框

 
  1. <span style="font-size:16px;"> android:width="integer" 描邊的寬度
  2. android:color="color" 描邊的顏色
  3. android:dashWidth="integer" 必須與下面的dashGap搭配使用缺一不可,也就是說可以兩個屬性都不用,如果用,兩個都必須得用。那麼這哥倆有什麼作用呢?
  4. 原來是可以實現邊框分段的效果,前者指定每段的長度後者指定兩端之間的間隙或者說距離。
  5. android:dashGap="integer" 上圖說明,如下,灰色部分為背景,黃綠色部分是邊框(好惡心的顏色啊,我隨便填了幾個數出來的)</span>


至此,關於Shape Drawable的大部分功能都介紹完了,快去做出自己的漂亮的UI吧。

Copyright © Linux教程網 All Rights Reserved