Android自訂Button按鈕

Android自訂Button按鈕主要可以分成兩種形式:

1.通過自定MyButton類來繼承Button,將所有效果在類中實現.

2.通過xml檔案來改變Button的樣式和顏色.

今天我就先講通過xml檔案,稍後封裝自訂Button類再補上.

TestcActivity

[html]
package com.example.blueapp; 
 
import android.app.Activity; 
import android.os.Bundle; 
 
public class TestcActivity extends Activity { 
 
    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
        // TODO Auto-generated method stub 
        super.onCreate(savedInstanceState); 
        setContentView(R.layout.testc); 
    } 
} 

package com.example.blueapp;

import android.app.Activity;
import android.os.Bundle;

public class TestcActivity extends Activity {

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  // TODO Auto-generated method stub
  super.onCreate(savedInstanceState);
  setContentView(R.layout.testc);
 }
}

 

testc.xml

[html]
<?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="vertical" > 
     
    <Button  
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:textSize="20dp" 
        android:text="測試按鈕" 
        android:background="@drawable/button_style" 
        /> 
     
    <Button  
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:textSize="20dp" 
        android:text="原始按鈕" 
        /> 
 
</LinearLayout> 

<?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="vertical" >
   
    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textSize="20dp"
        android:text="測試按鈕"
        android:background="@drawable/button_style"
        />
   
    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textSize="20dp"
        android:text="原始按鈕"
        />

</LinearLayout>
 

 

button_style.xml

[html]
<?xml version="1.0" encoding="utf-8"?>  
 <selector xmlns:android="http://schemas.android.com/apk/res/android">  
     <item android:state_pressed="true">  
         <shape>  
             <gradient android:startColor="#0d76e1" android:endColor="#0d76e1"  
                 android:angle="270" />  
             <stroke android:width="1dip" android:color="#f403c9" />  
             <corners android:radius="2dp" />  
             <padding android:left="10dp" android:top="10dp"  
                 android:right="10dp" android:bottom="10dp" />  
         </shape>  
     </item>  
    
     <item android:state_focused="true">  
         <shape>  
             <gradient android:startColor="#ffc2b7" android:endColor="#ffc2b7"  
                 android:angle="270" />  
             <stroke android:width="1dip" android:color="#f403c9" />  
             <corners android:radius="2dp" />  
             <padding android:left="10dp" android:top="10dp"  
                 android:right="10dp" android:bottom="10dp" />  
         </shape>  
     </item>  
    
     <item>  
         <shape>  
             <gradient android:startColor="#000000" android:endColor="#ffffff"  
                 android:angle="180" />  
             <stroke android:width="1dip" android:color="#f403c9" />  
             <corners android:radius="5dip" />  
             <padding android:left="10dp" android:top="10dp"  
                 android:right="10dp" android:bottom="10dp" />  
         </shape>  
     </item>  
 </selector>   

<?xml version="1.0" encoding="utf-8"?>
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
     <item android:state_pressed="true">
         <shape>
             <gradient android:startColor="#0d76e1" android:endColor="#0d76e1"
                 android:angle="270" />
             <stroke android:width="1dip" android:color="#f403c9" />
             <corners android:radius="2dp" />
             <padding android:left="10dp" android:top="10dp"
                 android:right="10dp" android:bottom="10dp" />
         </shape>
     </item>
  
     <item android:state_focused="true">
         <shape>
             <gradient android:startColor="#ffc2b7" android:endColor="#ffc2b7"
                 android:angle="270" />
             <stroke android:width="1dip" android:color="#f403c9" />
             <corners android:radius="2dp" />
             <padding android:left="10dp" android:top="10dp"
                 android:right="10dp" android:bottom="10dp" />
         </shape>
     </item>
  
     <item>
         <shape>
             <gradient android:startColor="#000000" android:endColor="#ffffff"
                 android:angle="180" />
             <stroke android:width="1dip" android:color="#f403c9" />
             <corners android:radius="5dip" />
             <padding android:left="10dp" android:top="10dp"
                 android:right="10dp" android:bottom="10dp" />
         </shape>
     </item>
 </selector>  

gradient 主體漸層 startColor開始顏色，endColor結束顏色 ，angle開始漸層的角度（值只能為90的倍數，0時為左到右漸層，90時為下到上漸層，依次逆時針類推）
stroke 邊框 width 邊框寬度，color 邊框顏色
corners 圓角 radius 半徑，0為直角
padding text值的相對位置