Android layer-list clip shape Selector 詳細介紹及使用

Android UI設計中經常用到的layer-list, shape在美化控件中的作用是至關重要的。

• shape
  1. 作用：在xml中定義幾何形狀
  2. 屬性：

     <shape> Android:shape=["rectangle" | "oval" | "line" | "ring"] 其中rectagle矩形，oval橢圓，line水平直線，ring環形

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape=["rectangle" | "oval" | "line" | "ring"] > 
    <gradient 漸變  
        android:angle="integer" 漸變角度，0從左到右，90表示從下到上，數值為45的整數倍，默認為0；  
        android:centerX="integer" 
       android:centerY="integer" 
       android:centerColor="integer" 
       android:endColor="color" 結束顏色          
        android:gradientRadius="integer" 
       android:startColor="color"         起始顏色  
        android:type=["linear" | "radial" | "sweep"]  漸變的樣式 liner線性漸變 radial環形漸變 sweep  
       android:usesLevel=["true" | "false"] /> 
    <solid 填充          

        android:color="color" 填充的顏色 /> 
    <stroke 描邊
        android:width="integer"     描邊的寬度  
        android:color="color"         描邊的顏色  
        android:dashWidth="integer" 表示橫線的寬度  
        android:dashGap="integer"     表示橫線之間的距離   /> 
    <padding 
       android:left="integer" 
       android:top="integer" 
       android:right="integer" 
       android:bottom="integer" /> 
    <corners 圓角  
        android:radius="integer"             圓角的半徑 值越大角越圓  
        android:topLeftRadius="integer"     左上圓角半徑  
        android:topRightRadius="integer"     右上圓角半徑  
        android:bottomLeftRadius="integer"     左下圓角角半徑  
        android:bottomRightRadius="integer" 右下圓角角半徑  /> 
</shape>

• layer-list，將多個圖片或兩種以上的效果按照順序層疊；

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

    <item android:id="@android:id/background">
        <shape>
            <corners android:radius="0dip" />

            <solid android:color="#FDE5A2" />
        </shape>
    </item>
    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape>
                <corners android:radius="0dip" />

                <gradient
                    android:angle="270"
                    android:centerColor="#80ffb600"
                    android:centerY="0.75"
                    android:endColor="#a0ffcb00"
                    android:startColor="#80ffd300" />
            </shape>
        </clip>
    </item>
    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <corners android:radius="0dip" />

                <solid android:color="#FD2702" />
            </shape>
        </clip>
    </item>

</layer-list>

 

layer-list層疊樣式在程序中對應LayerDrawable，使用方法如下：

Resources resources = getResources(); 
Drawable[] layers = new Drawable[2]; 
layers[0] = r.getDrawable(R.drawable.white); 
layers[1] = r.getDrawable(R.drawable.logo_overlay); 
LayerDrawable layerDrawable = new LayerDrawable(layers)
((ImageView) findViewById(R.id.imageview)).setImageDrawable(layerDrawable);

 

 

參考文章:

http://tbwisk.github.io/lessons/2015/01/14/Android%E5%BC%80%E5%8F%91%EF%BC%8Cshape%EF%BC%8Cselector%EF%BC%8Clayer-list%E4%BB%8B%E7%BB%8D/