迎向鐵人賽第10天～真是越來越艱困了，不過沒關係～我會繼續努力

在APP當中，設計的美感是相當重要的一件事情，
本魯也曾經因為一個APP長得太醜而不想要用他，所以想要讓自己的APP變得熱門，
就一定要在頁面上下一點功夫了，今天時間緊迫，就稍微介紹一個簡單的功能，
我們要練習設計 Button 的 Style，讓 APP 不要顯得那麼單調

Step1. 建立一個 selector

首先我們要在 drawable 資料夾底下建立一個名叫 btn_primary.xml 的 selector，
裡面包含了按下時的狀態，不啟用時的狀態，還有一般狀態時的Style背景設定（只有背景而已喔）

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

    <item android:state_pressed="true"><shape>
            <solid android:color="#ff3276b1" />
            <stroke android:width="1dp" android:color="#ff357ebd" />
            <corners android:radius="5dp"/>
        </shape></item>
            
    <item android:state_enabled="false"><shape>
	    <solid android:color="#d4e5f3" />
            <stroke android:width="1dp" android:color="#a5357ebd" />
            <corners android:radius="5dp"/>
        </shape></item>
        
    
    <item><shape>
            <solid android:color="#ff428bca" />
            <stroke android:width="1dp" android:color="#ff357ebd" />
            <corners android:radius="5dp"/>
        </shape></item>

</selector>

Step2. 設定Style

把剛剛的設定好的背景、字型、字顏色等等等，設定到Style中

<resources>
    <style name="AppBaseTheme" parent="android:Theme.Light">
    </style>

    <style name="AppTheme" parent="AppBaseTheme">
    </style>

    <style name="btn_primary" parent="@android:style/Widget.Button">
        <item name="android:textSize">20sp</item>
        <item name="android:textColor">#FFFFFF</item>
        <item name="android:gravity">center</item>
        <item name="android:background">@drawable/btn_primary</item>
        <item name="android:padding">10dip</item>
    </style>
</resources>

Step3. 將Style設定到Button

最後一個步驟最簡單了，我們只要把Button中的Style改成剛剛建立好的Style就可以啦

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/container"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center|center"
    android:orientation="vertical" >

    <Button
        android:id="@+id/button1"
        style="@style/btn_primary"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="button1_Click"
        android:text="按我一下" />

</LinearLayout>

最後執行出來就會的按鈕會長這個樣子

一般狀態

不啟用狀態

今天就到這邊～大家明天見～～