1. 程式人生 > >Android實現button一邊圓角一邊直角

Android實現button一邊圓角一邊直角

Android中要實現如下圖的效果:


這個要在真機中才能看出效果!!

switch_button_left_checked.xml

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

    <!-- 填充的顏色:這裡設定背景透明 -->
    <solid android:color="#ff304a" />
    <!-- 邊框的顏色 :不能和視窗背景色一樣 -->
    <stroke
        android:width="2dp"
        android:color="#ff304a" />
    <!-- 設定按鈕的四個角為弧形 -->
    <!-- android:radius 弧形的半徑 -->
    <corners
        android:bottomLeftRadius="5dip"
        android:bottomRightRadius="0dip"
        android:topLeftRadius="5dip"
        android:topRightRadius="0dip" />

    <!-- padding:Button裡面的文字與Button邊界的間隔 -->
    <padding
        android:bottom="5dp"
        android:left="5dp"
        android:right="5dp"
        android:top="5dp" />

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

    <!-- 填充的顏色:這裡設定背景透明 -->
    <solid android:color="#00000000" />
    <!-- 邊框的顏色 :不能和視窗背景色一樣 -->
    <stroke
        android:width="2dp"
        android:color="#ff304a" />
    <!-- 設定按鈕的四個角為弧形 -->
    <!-- android:radius 弧形的半徑 -->
    <corners
        android:bottomLeftRadius="5dip"
        android:bottomRightRadius="0dip"
        android:topLeftRadius="5dip"
        android:topRightRadius="0dip" />

    <!-- padding:Button裡面的文字與Button邊界的間隔 -->
    <padding
        android:bottom="5dp"
        android:left="5dp"
        android:right="5dp"
        android:top="5dp" />

</shape>

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

    <!-- 填充的顏色:這裡設定背景透明 -->
    <solid android:color="#ff304a" />
    <!-- 邊框的顏色 :不能和視窗背景色一樣 -->
    <stroke
        android:width="2dp"
        android:color="#ff304a" />
    <!-- 設定按鈕的四個角為弧形 -->
    <!-- android:radius 弧形的半徑 -->
    <corners
        android:bottomLeftRadius="0dip"
        android:bottomRightRadius="5dip"
        android:topLeftRadius="0dip"
        android:topRightRadius="5dip" />

    <!-- padding:Button裡面的文字與Button邊界的間隔 -->
    <padding
        android:bottom="5dp"
        android:left="5dp"
        android:right="5dp"
        android:top="5dp" />

</shape>

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

    <!-- 填充的顏色:這裡設定背景透明 -->
    <solid android:color="#00000000" />
    <!-- 邊框的顏色 :不能和視窗背景色一樣 -->
    <stroke
        android:width="2dp"
        android:color="#ff304a" />
    <!-- 設定按鈕的四個角為弧形 -->
    <!-- android:radius 弧形的半徑 -->
    <corners
        android:bottomLeftRadius="0dip"
        android:bottomRightRadius="5dip"
        android:topLeftRadius="0dip"
        android:topRightRadius="5dip" />

    <!-- padding:Button裡面的文字與Button邊界的間隔 -->
    <padding
        android:bottom="5dp"
        android:left="5dp"
        android:right="5dp"
        android:top="5dp" />

</shape>

button.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    android:padding="10dp" >

    <Button
        android:id="@+id/wangdaileiBtn"
        android:layout_width="0dp"
        android:layout_height="40dp"
        android:layout_weight="1"
        android:scaleType="fitXY"
        android:text=""
        android:background="@drawable/switch_button_left_checked" />

    <Button
        android:id="@+id/baobaoleiBtn"
        android:layout_width="0dp"
        android:layout_height="40dp"
        android:layout_weight="1"
        android:text=""
        android:scaleType="fitXY"
        android:background="@drawable/switch_button_right" />

</LinearLayout>