android学习笔记 自定义圆角Button

在做项目的时候要用到圆角按钮，并且点击按钮会有变色效果和Button里面的字体颜色变色的效果。

首先在res文件夹下建一个drawable文件夹,然后在该文件夹建一个shape的Android XML文件。

这是按钮没点击时的文件：

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" >    <!-- 填充 -->      <solid android:color="#FFFFFF" /> <!-- 定义填充的颜色值 -->            <!-- 描边 -->      <stroke          android:width="1dp"           android:color="#2a7784" /> <!-- 定义描边的宽度和描边的颜色值 -->            <!-- 圆角 -->      <corners          android:bottomLeftRadius="10dp"          android:bottomRightRadius="10dp"          android:topLeftRadius="10dp"          android:topRightRadius="10dp" /> <!-- 设置四个角的半径 -->            <!-- 间隔 -->      <padding          android:bottom="10dp"          android:left="10dp"          android:right="10dp"          android:top="10dp" /> <!-- 设置各个方向的间隔 --> </shape>

这是按钮点击后的文件：

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" >        <!-- 填充 -->      <solid android:color="#2a7782" /> <!-- 定义填充的颜色值 -->            <!-- 描边 -->      <stroke          android:width="1dp"           android:color="#2a7784" /> <!-- 定义描边的宽度和描边的颜色值 -->            <!-- 圆角 -->      <corners          android:bottomLeftRadius="10dp"          android:bottomRightRadius="10dp"          android:topLeftRadius="10dp"          android:topRightRadius="10dp" /> <!-- 设置四个角的半径 -->          <padding          android:bottom="10dp"          android:left="10dp"          android:right="10dp"          android:top="10dp" /> <!-- 设置各个方向的间隔 --> </shape>

然后在drawable建一个selector的Android XM文件，用来实现点击颜色变化效果：

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

最后在drawable建一个selector的Android XM文件，用来实现点击字体颜色变化效果：

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

然后在布局文件中引用后就可以有这个效果：

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    xmlns:custom="http://schemas.android.com/apk/res/com.rz"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:fitsSystemWindows="true"    android:background="#ffffff" >    <com.rz.view.TopBar        android:id="@+id/login_topBar"        android:layout_width="match_parent"        android:layout_height="40dp"        android:background="#2a7782"        custom:Title="@string/l_title"        custom:titleTextColor="#FFFFFF"        custom:titleTextSize="7sp" >    </com.rz.view.TopBar>    <View        android:id="@+id/view_layout"        android:layout_width="match_parent"        android:layout_height="10dp"        android:layout_below="@id/login_topBar"        android:background="#F0F0ed" />    <RelativeLayout        android:id="@+id/login_layout"        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:layout_below="@id/view_layout"        android:layout_marginLeft="20dp"        android:layout_marginRight="20dp"        android:gravity="center" >        <RelativeLayout            android:id="@+id/username_layout"            android:layout_width="fill_parent"            android:layout_height="50dp"            android:gravity="center" >            <ImageView                android:id="@+id/userImage"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_alignParentLeft="true"                android:layout_centerVertical="true"                android:background="@drawable/user"                android:visibility="visible" />            <EditText                android:id="@+id/l_user"                android:layout_width="fill_parent"                android:layout_height="match_parent"                android:layout_toRightOf="@id/userImage"                android:background="@null"                android:hint="@string/l_user"                android:textColorHint="#696969" >            </EditText>        </RelativeLayout>        <View            android:id="@+id/username_view"            android:layout_width="match_parent"            android:layout_height="0.5dp"            android:layout_below="@id/username_layout"            android:background="#CBCED2" />        <RelativeLayout            android:id="@+id/password_layout"            android:layout_width="fill_parent"            android:layout_height="50dp"            android:layout_below="@id/username_view"            android:gravity="center" >            <ImageView                android:id="@+id/pwdImage"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_alignParentLeft="true"                android:layout_centerVertical="true"                android:background="@drawable/icon_password"                android:visibility="visible" />            <EditText                android:id="@+id/l_password"                android:layout_width="fill_parent"                android:layout_height="match_parent"                android:layout_toRightOf="@id/pwdImage"                android:background="@null"                android:hint="@string/l_password"                android:inputType="textPassword"                android:textColorHint="#696969" >            </EditText>            <ImageView                android:id="@+id/l_show_pwd"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_alignParentRight="true"                android:layout_centerVertical="true"                android:background="@drawable/icon_eye"                android:visibility="visible" />        </RelativeLayout>        <View            android:layout_width="match_parent"            android:layout_height="0.5dp"            android:layout_below="@id/password_layout"            android:background="#CBCED2" />        <LinearLayout            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:layout_below="@id/password_layout"            android:layout_marginTop="10dp"            android:orientation="horizontal" >            <ImageView                android:id="@+id/remember_pw"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_gravity="left|center_vertical"                android:background="@drawable/rememberpd" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_marginLeft="5dp"                android:layout_marginTop="15dp"                android:layout_weight="1"                android:text="@string/l_remember_pw"                android:textColor="#5d9aa0" />            <TextView                android:id="@+id/forget_pwd"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_marginLeft="120dp"                android:layout_marginTop="15dp"                android:layout_weight="0"                android:onClick="true"                android:text="@string/l_fogot_pw"                android:textColor="#5d9aa0" />        </LinearLayout>    </RelativeLayout>    <LinearLayout        android:id="@+id/btn_layout"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_below="@id/login_layout"        android:layout_marginLeft="20dp"        android:layout_marginRight="20dp"        android:layout_marginTop="41sp"        android:orientation="vertical" >        <Button            android:id="@+id/login_btn"            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:background="@drawable/btn"            android:text="@string/l_login"            android:textColor="@drawable/btn_color" />        <Button            android:id="@+id/login_sign"            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:layout_gravity="center"            android:layout_marginTop="41sp"            android:background="@drawable/btn"            android:text="@string/sign"            android:textColor="@drawable/btn_color" />    </LinearLayout>    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_below="@id/btn_layout"        android:layout_marginLeft="20dp"        android:layout_marginRight="20dp"        android:layout_marginTop="50dp"        android:orientation="vertical" >        <LinearLayout            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:gravity="center"            android:orientation="horizontal" >            <View                android:layout_width="80dp"                android:layout_height="0.5dp"                android:layout_marginRight="5dp"                android:background="#C9C9C9" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_gravity="center"                android:text="@string/other"                android:textColor="#696969" />                        <View                android:layout_width="80dp"                android:layout_height="0.5dp"                android:layout_marginLeft="5dp"                android:background="#C9C9C9" />        </LinearLayout>        <LinearLayout            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:layout_marginTop="30dp" >            <LinearLayout                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_weight="1"                android:gravity="center"                android:orientation="vertical" >                <Button                    android:id="@+id/weibo"                    android:layout_width="48dp"                    android:layout_height="48dp"                    android:layout_gravity="center"                    android:background="@drawable/icon_wb_78" />               <TextView                    android:layout_width="wrap_content"                    android:layout_height="2dp"                    android:layout_gravity="center"                    android:text="" />                <TextView                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:layout_gravity="center"                    android:text="@string/weibo" />            </LinearLayout>            <LinearLayout                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_weight="1"                android:gravity="center"                android:orientation="vertical" >                <Button                    android:id="@+id/weixin"                    android:layout_width="48dp"                    android:layout_height="48dp"                    android:layout_gravity="center"                    android:background="@drawable/icon_wx_78" />                  <TextView                    android:layout_width="wrap_content"                    android:layout_height="2dp"                    android:layout_gravity="center"                    android:text="" />                <TextView                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:layout_gravity="center"                    android:text="@string/weixin" />            </LinearLayout>            <LinearLayout                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_weight="1"                android:gravity="center"                android:orientation="vertical" >                <Button                    android:id="@+id/qq"                    android:layout_width="48dp"                    android:layout_height="48dp"                    android:layout_gravity="center"                    android:background="@drawable/icon_wx_qq" />                  <TextView                    android:layout_width="wrap_content"                    android:layout_height="2dp"                    android:layout_gravity="center"                    android:text="" />                <TextView                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:layout_gravity="center"                    android:text="@string/qq" />            </LinearLayout>        </LinearLayout>    </LinearLayout></RelativeLayout>