安卓中自定义按钮风格文本教程

在安卓中有时需要自定义按钮风格显示，本例中界面上有两个按钮，用以显示自定义的按钮风格，设计界面如下：


 
除外为了完成自定义风格按钮的设计，我用photoshop简单设计了几张不同颜色的图片用以在按钮不同状态时显示，图片如下


            图片名： ic_radiobutton.png，正常状态下按钮风格


             图片名：ic_radiobuttonpressed.png，按钮被按下时候的风格


             图片名：ic_radiobuttonselect.png，按钮被选中时候的风格


              图片名：ic_radiobuttondisable.png，按钮不可用时候的风格

因为笔者美工有限所以图片仅为代码演示用，名字随便取得，仅供参考用。好了将以上几张图片放到工程drawable中，当然为了考虑不同的分辨率你可能需要准备不同大小的图片，放置后刷新，使其在工程中可见。随后就开始代码的设计啦。

在安卓中控件不同状态的不同背景由selector定义，在drawable中创建一个xml文件，名字可以根据爱好取，比如笔者使用button_selector_mybutton.xml，然后再文件中添加以下代码定义按钮不同状态下的风格：代码如下

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

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

    <item android:state_pressed="true"

        android:drawable="@drawable/ic_radiobuttonpressed"></item>

    <item android:state_focused="true"

        android:state_enabled="true"

        android:drawable="@drawable/ic_radiobuttonselect"/>

    <item android:state_enabled="true"

        android:drawable="@drawable/ic_radiobutton"></item>

    <item android:state_focused="true"

        android:drawable="@drawable/ic_radiobutton"/>

    <item android:drawable="@drawable/ic_radiobutton"></item>

</selector>
然后再Style.xml文件中定义按钮样式，笔者代码如下：在Style.xml文件中添加如下信息：

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

    <!--

        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="ButtonShap">

        <item name="android:background">@drawable/button_selector_mybutton</item>

        <item name="android:focusable">true</item>

        <item name="android:clickable">true</item>

        <item name="android:padding">10dip</item>

        <item name="android:textColor">@android:color/black</item>

     </style>

</resources>

 

之后再界面布局文件中指定按钮的style就可以啦！笔者代码如下：

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

    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    tools:context=".MainActivity" >

    <Button

        android:id="@+id/btn_send"

        style="@style/ButtonShap"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignParentLeft="true"

        android:layout_below="@+id/btn_conn"

        android:layout_marginLeft="220dp"

        android:layout_marginTop="24dp"

        android:gravity="center"

        android:text="@string/btn_send"

        android:textColor="@android:color/holo_blue_light" />

    <Button

        android:id="@+id/btn_conn"

        style="@style/ButtonShap"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_alignLeft="@+id/btn_send"

        android:layout_alignParentTop="true"

        android:gravity="center"

        android:text="@string/btn_conn"

        android:textColor="@android:color/holo_blue_light" />

</RelativeLayout>