android自定义Button背景和EditText背景

android自定义Button背景、EditText背景

为了界面的美观，我们经常需要自定义系统自带的Button和EditText控件,下面我实现了button去掉边框、点击button字体变色和editText矩形框背景，借以美化登录界面。

先上图片：

1.在res文件夹下的drawable文件夹里新建edittext_background.xml,实现editText矩形边框

<?xml version="1.0" encoding="utf-8"?>
<layer-list
       xmlns:android="http://schemas.android.com/apk/res/android">
   <item>
       <shape
               xmlns:android="http://schemas.android.com/apk/res/android"
               android:shape="rectangle">
           <corners
                   android:radius="3dp"/>
           <stroke
                   android:width="2dp"
                   android:color="#ffffff"/>
       </shape>
   </item>

</layer-list>

2.在res文件夹下的drawable文件夹里新建button_shape.xml，自定义button背景，去掉button边框

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

<!--shape用于定义形状，有四种形状(矩形rectangle| 椭圆oval | 直线line | 圆形ring)-->

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

    <!--solid用于设置填充形状的颜色-->
    <!--    <solid android:color="#f06f3c" />-->

    <!--corners用于创建圆角（只用于形状是矩形）-->
<!--    <corners android:radius="3dp"/>-->

    <padding
            android:left="10dp"
            android:right="10dp"/>

    <!--    设置边框线的宽度和颜色-->
    <stroke
            android:width="0dp"
            android:color="#ffffff"/>

</shape>

3.在res文件夹下的drawable文件夹里新建text_color_selector.xml，实现点击按钮改变颜色提供反馈

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

    <item android:color="@color/white" android:state_pressed="false"></item>
    <item android:color="@color/colorPrimary" android:state_pressed="true"></item>

</selector>

4.activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/black_ground"
        tools:context=".MainActivity">


    <EditText
            android:background="@drawable/edittext_background"
            android:textColor="@color/white"
            android:hint="请输入账号"
            android:paddingLeft="12dp"
            android:textSize="16dp"
            android:textColorHint="@color/white"
            android:layout_width="0dp"
            android:layout_height="40dp"
            android:id="@+id/loginText"
            android:layout_marginTop="32dp"
            app:layout_constraintTop_toTopOf="parent" app:layout_constraintStart_toStartOf="parent"
            android:layout_marginStart="24dp" app:layout_constraintEnd_toEndOf="parent"
            android:layout_marginEnd="24dp"/>
    <EditText
            android:background="@drawable/edittext_background"
            android:textColor="@color/white"
            android:hint="请输入密码"
            android:paddingLeft="12dp"
            android:textSize="16dp"
            android:textColorHint="@color/white"
            android:layout_width="0dp"
            android:id="@+id/registerText"
            android:inputType="textPassword"
            android:layout_height="40dp"
            android:layout_marginTop="16dp"
            app:layout_constraintTop_toBottomOf="@+id/loginText" app:layout_constraintStart_toStartOf="@+id/loginText"
            app:layout_constraintEnd_toEndOf="@+id/loginText"/>
    <Button
            android:background="@drawable/button_shape"
            android:text="登陆"
            android:textSize="24dp"
            android:textColor="@drawable/text_color_selector"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/loginButton" android:layout_marginTop="16dp"
            app:layout_constraintTop_toBottomOf="@+id/registerText" app:layout_constraintStart_toStartOf="@+id/registerText"
            app:layout_constraintEnd_toEndOf="@+id/registerText"/>
    <Button
            android:background="@drawable/button_shape"
            android:text="注册"
            android:textSize="24dp"
            android:textColor="@drawable/text_color_selector"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/registerButton" android:layout_marginTop="8dp"
            app:layout_constraintTop_toBottomOf="@+id/loginButton" app:layout_constraintStart_toStartOf="@+id/loginButton"
            app:layout_constraintEnd_toEndOf="@+id/loginButton"/>
</android.support.constraint.ConstraintLayout>

5.colors.xml：增加需要用到的颜色资源

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#008577</color>
    <color name="colorPrimaryDark">#00574B</color>
    <color name="colorAccent">#D81B60</color>
    <color name="white">#ffffff</color>
    <color name="black_ground">#000000</color>
    <color name="gray_text">#A2A2A2</color>
</resources>