Android使用圆角

圆角Button

效果图

绿色Button

定义button_green.xml资源文件位于drawable文件夹下，可用作button的background属性

 button_green.xml:
 1 <?xml version="1.0" encoding="utf-8"?>
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
     <item android:state_pressed="true">
         <shape>
             <!-- 填充 -->
             <solid android:color="@color/green" />
             <!-- 描边 -->
             <stroke
                     android:width="1dp"
                     android:color="@color/cyan" />
             <!-- 圆角 -->
             <corners android:radius="6dp"/>
             <padding android:top="10dp" android:bottom="10dp"
                 android:left="20dp"
                 android:right="20dp"/>
         </shape>
     </item>
     <item>
         <shape>
             <solid android:color="@android:color/transparent" />
             <padding android:top="10dip" android:bottom="10dip"
                 android:left="20dp"
                 android:right="20dp"/>
             <stroke
                     android:width="1dp"
                     android:color="@color/green" />

             <corners android:radius="6dp"/>
         </shape>
     </item>
 </selector>

附上colors.xml

 colors.xml
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
     <color name="white">#FFFFFF</color>
     <color name="cyan">#4421A5DD</color>
     <color name="green">#98D264</color>
 </resources>

colors.xml

带渐变的橙色Button

定义button_orange.xml资源文件位于drawable文件夹下，代码如下：

 button_orange.xml:
 <?xml version="1.0" encoding="utf-8"?>

 <selector xmlns:android="http://schemas.android.com/apk/res/android">
     <item android:state_enabled="false">
         <shape>
             <gradient
                     android:startColor="#D0D0D0"
                     android:centerColor="#B0B0B0"
                     android:centerY="0.75"
                     android:endColor="#D0D0D0"
                     android:angle="270"
                     />
             <corners android:radius="6dp"/>
         </shape>
     </item>

     <item android:state_pressed="true" android:state_enabled="true">
         <shape>
             <gradient
                     android:startColor="#F5AA1C"
                     android:centerColor="#F29600"
                     android:centerY="0.75"
                     android:endColor="#F5AA1C"
                     android:angle="270"
                     />
             <stroke android:width="1dp" android:color="#FBB343" />
             <corners android:radius="6dp" />
         </shape>
     </item>

     <item android:state_enabled="true">
         <shape>
             <gradient
                  android:startColor="#FBB03B"
                  android:centerColor="#FBB03B"
                  android:centerY="0.75"
                  android:endColor="#FBB03B"
                  android:angle="270"
                     />

             <stroke android:width="1dp" android:color="#FBB343" />
             <padding android:left="20dp"
                 android:right="20dp"
                 android:top="10dp"
                 android:bottom="10dp"/>

             <corners android:radius="6dp" />
         </shape>
     </item>
 </selector>

button_orange.xml

自定义Button的使用

为方便使用，定义GreenButton和OrangeButton风格的style，代码如下：

 styles.xml:
 <resources>

     <!--
         Base application theme, dependent on API level. This theme is replaced
         by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
     -->
     <style name="AppBaseTheme" parent="android:Theme.Light">
         <!--
             Theme customizations available in newer API levels can go in
             res/values-vXX/styles.xml, while customizations related to
             backward-compatibility can go here.
         -->
     </style>

     <!-- Application theme. -->
     <style name="AppTheme" parent="AppBaseTheme">
         <!-- All customizations that are NOT specific to a particular API-level can go here. -->
     </style>

     <style name="GreenButton">
         <item name="android:layout_width">wrap_content</item>
         <item name="android:layout_height">wrap_content</item>
         <item name="android:background">@drawable/button_green</item>
         <item name="android:textColor">@color/button_green_color</item>
     </style>

     <style name="OrangeButton">
         <item name="android:layout_width">wrap_content</item>
         <item name="android:layout_height">wrap_content</item>
         <item name="android:background">@drawable/button_orange</item>
         <item name="android:textColor">@color/white</item>
     </style>
 </resources>

styles.xml

大家可能已经注意到了，上述GreenButton的style中还包含一个button_green_color的颜色，实际上，它也是一个xml文件，我们在res目录下新建一个color目录，用于存放我们自定义的color资源文件。

 button_green_color.xml：
 <?xml version="1.0" encoding="utf-8"?>
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
     <item android:state_selected="true" android:color="@color/white" />
     <item android:state_focused="true" android:color="@color/white" />
     <item android:state_pressed="true" android:color="@color/white" />
     <item android:color="@color/" />
 </selector>

button_green_color.xml

现在，使用自定义的button就很简单了，例如：

  <Button
             style="@style/GreenButton"
             android:text="GreenButton"/>

  <Button style="@style/OrangeButton"
             android:text="OrangeButton"/>

自定义button的使用