Android开发Hack1-圆角镂空按钮的样式定义

Android开发Hack1-圆角镂空按钮的样式定义

通过xml文件实现自定义圆角镂空按钮，以及点击效果

    <Button android:layout_width="78dp" android:layout_height="32dp"  
              android:id="@+id/corner_btn"  
              android:textSize="15sp"   
              android:textColor="@color/score_point"  
              android:text="button1"  
              android:layout_marginRight="17dp"  
              android:layout_marginLeft="17dp"  
              android:layout_gravity="center_vertical"  
              android:background="@drawable/circle_corner_button_selector"  
              />  

在drawable中创建按钮背景selector器

circle_corner_button_selector.xml

<?xml version="1.0" encoding="utf-8"?>  
  
<selector xmlns:android="http://schemas.android.com/apk/res/android">  
    <item android:drawable="@drawable/circle_corner_button_pressed" android:state_pressed="true"/>  
    <item android:drawable="@drawable/circle_corner_button"/>  
</selector> 

分别定义不同选择操作下的效果

首先：circle_corner_button.xml文件

<?xml version="1.0" encoding="utf-8"?>  
  
<!-- 带圆角 白色背景 黄色色边框  长方体 -->  
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">  
    <item>  
        <shape>  
            <solid android:color="#FFFFFF" />  
            <corners android:topLeftRadius="5dp" android:topRightRadius="5dp"  
                     android:bottomRightRadius="5dp" android:bottomLeftRadius="5dp" />  
            <stroke android:width="1dp" android:color="#F58939" />  
            <padding  
                    android:left="5dp"  
                    android:top="5dp"  
                    android:right="5dp"  
                    android:bottom="5dp"  
                    />  
        </shape>  
    </item>  
</layer-list> 

和circle_corner_button_pressed.xml文件

    <?xml version="1.0" encoding="utf-8"?>  
    <!-- 带圆角 白色背景 灰色边框 长方体 -->  
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">  
        <item>  
            <shape>  
                <solid android:color="#FFFFFF"/>  
                <corners android:topLeftRadius="5dp" android:topRightRadius="5dp"  
                         android:bottomRightRadius="5dp" android:bottomLeftRadius="5dp"/>  
                <stroke android:width="1dp" android:color="#dbdbdb"/>  
                <padding  
                        android:left="5dp"  
                        android:top="5dp"  
                        android:right="5dp"  
                        android:bottom="5dp"  
                        />  
            </shape>  
        </item>  
      
    </layer-list>  

最后的按钮效果应该是这样的：

正常情况下：

点击后的样式：