Android UI（一）Layout 背景局部Shape圓角設計

標籤：android   style   blog   http   io   ar   color   sp   div   

Jeff Lee blog:   http://www.cnblogs.com/Alandre/  (泥沙磚瓦漿木匠),retain the url when reproduced ! Thanks

今天我們來Android UI第一講：實現Layout 背景局部Shape圓角設計

：

第一步：定義一個shape

res/drawable/shape_to_corner_no_bottom_line.xml

<?xml version="1.0" encoding="utf-8"?><layer-list xmlns:android="http://schemas.android.com/apk/res/android" >    <item>        <!-- shape with circle-top corner -->        <shape>            <!-- the shape background color -->            <solid android:color="@color/black"/>            <corners android:topLeftRadius="10dp" android:topRightRadius="10dp"                 android:bottomLeftRadius="0.1dp" android:bottomRightRadius="0.1dp"/>            <stroke  android:width="1dp" android:color="@color/black"/>        </shape>    </item></layer-list>

其中參數含義:{英語單詞顧名思義}

這是參數詳解 <!-- 圓角 -->    <corners        android:radius="9dp"        android:topLeftRadius="2dp"        android:topRightRadius="2dp"        android:bottomLeftRadius="2dp"        android:bottomRightRadius="2dp"/><!-- 設定圓角半徑 -->        <!-- 漸層 -->    <gradient        android:startColor="@android:color/white"        android:centerColor="@android:color/black"        android:endColor="@android:color/black"        android:useLevel="true"        android:angle="45"        android:type="radial"        android:centerX="0"        android:centerY="0"        android:gradientRadius="90"/>        <!-- 間隔 -->    <padding        android:left="2dp"        android:top="2dp"        android:right="2dp"        android:bottom="2dp"/><!-- 各方向的間隔 -->        <!-- 大小 -->    <size        android:width="50dp"        android:height="50dp"/><!-- 寬度和高度 -->        <!-- 填充 -->    <solid        android:color="@android:color/white"/><!-- 填充的顏色 -->        <!-- 描邊 -->    <stroke        android:width="2dp"        android:color="@android:color/black"        android:dashWidth="1dp"        android:dashGap="2dp"/>    填充：設定填充的顏色間隔：設定四個方向上的間隔大小：設定大小圓角：同時設定五個屬性，則Radius屬性無效android:Radius="20dp"                           設定四個角的半徑android:topLeftRadius="20dp"              設定左上方的半徑android:topRightRadius="20dp"           設定右上方的半徑android:bottomLeftRadius="20dp"      設定右下角的半徑android:bottomRightRadius="20dp"    設定左下角的半徑描邊：dashWidth和dashGap屬性，只要其中一個設定為0dp，則邊框為實現邊框android:width="20dp"                               設定邊邊的寬度android:color="@android:color/black"  設定邊邊的顏色android:dashWidth="2dp"                         設定虛線的寬度android:dashGap="20dp"                          設定虛線的間隔寬度

漸層：當設定填充顏色後，無漸層效果。angle的值必須是45的倍數（包括0），僅在type="linear"有效，不然會報錯。android:useLevel 這個屬性不知道有什麼用。

第二步: Layout中設定

   android:background="@drawable/shape_to_corner_no_bottom_line"

這樣就簡單的設定好了。

Android UI（一）Layout 背景局部Shape圓角設計