Android資源文件-Shape

  1. solid
    這裏寫圖片描述
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <!--綠色填充-->
    <solid android:color="#0f0" />

</shape>

2.corner
這裏寫圖片描述

<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <solid android:color="#0f0" />
    <!--半徑爲10px的圓角-->
    <corners android:radius="10px" />

</shape>

3.gradient
這裏寫圖片描述

<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <solid android:color="#0f0" />

    <corners android:radius="10px" />
     <!--漸變色:開始的顏色,中間的顏色,結束的顏色-->
    <gradient
        android:startColor="#D8FC83"
        android:centerColor="#41F114"
        android:endColor="#0f0"
        />

</shape>

4.stroke
這裏寫圖片描述

<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <solid android:color="#0f0" />

    <corners android:radius="10px" />

    <gradient
        android:centerColor="#41F114"
        android:endColor="#0f0"
        android:startColor="#D8FC83" />
    <!--邊框:寬度,顏色-->
    <stroke
        android:width="1px"
        android:color="#f0f" />

</shape>

5.陰影效果
這裏寫圖片描述

需要3個圖層:
a:最底層和整體背景顏色一致
b:中間層left和top錯開2dp
c:最上層和陰影顏色一致的邊框,和最底層一樣顏色的填充色,bottom和right方向錯開2dp
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <!--最底層-->
    <item>
        <shape>
            <solid android:color="#fff" />
        </shape>
    </item>
  <!--中間層-->
    <item
        android:left="2dp"
        android:top="2dp">
        <shape>
            <solid android:color="#ccc" />
        </shape>
    </item>
  <!--最上層-->
    <item
        android:bottom="2dp"
        android:right="2dp">
        <shape>
            <solid android:color="#fff" />

            <stroke
                android:width="1px"
                android:color="#ccc" />
        </shape>
    </item>
</layer-list>

6.底部邊框顏色和其它邊框顏色不同。
圖層1-最底部–>圖層2-中間–>圖層3-最上邊

a:最底層黃色填充色。
b:中間層灰色邊框1px,白色填充色,bottom 5px,可以露出5px的底層的黃色。
c:最上層left,right,top透明邊框1px,白色填充色,正好顯示出中間層的left,right,top邊框。bottom 4px正好覆蓋中間層的底部邊框。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<!--第一層-->
    <item>
        <shape>
            <solid android:color="#ff0" />
        </shape>
    </item>
<!--第二層-->
    <item android:bottom="5px">
        <shape>
            <solid android:color="#fff" />
            <stroke
                android:width="1px"
                android:color="#ccc" />
        </shape>
    </item>
爲了去掉底部灰色邊框,再覆蓋一個圖層。(白色背景,透明邊框,和第二層邊框的width基本一致,但bottom的值一定要小於第二層的bottom值)
<!--第三層-->
    <item
        android:bottom="4px"
        android:left="1px"
        android:right="1px"
        android:top="1px">
        <shape>
            <solid android:color="#fff" />
            <stroke
                android:width="1px"
                android:color="#0000" />
        </shape>
    </item>
</layer-list>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章