5、控件美化（drawable使用）

        先前的回复页面虽然搭好了，功能也实现了，但页面总显得不太美观（虽然已经加入了android:background，给了些背景），感觉是和用户没有太多的交互（如EditText的边框选中没选中的颜色变化，Button按没按下的颜色变化等）。

        先说下android:background，这是设置控件的背景，值可以为一个颜色（#AARRGGBB，AA透明度可省略），一个drawable，分两种，一种为引入的图片资源（如@drawable/ic_launcher），另一种就是使用xml描述的drawable资源（什么，怎么建？），重点说下第二种。

一、Button美化

        为按钮的背景写一个xml，File/New/Other（Ctrl+N）→Android/Android XML File→Resource Type选择drawable，Root Element选择shape,输入名字bt_bgnormal→Finish。shape默认是一块矩形区域（不止矩形，还有其他）。

        有下列可选项：

        <solid />，内部填充，包含属性android:color，可设置填充颜色。
        <corners />，四角圆角半径，包含android:radius等，可设置矩形圆角。
        <stroke />，描边，包含android:width，描边宽度，android:color，描边颜色。
        <等 />
        这里给填充#F00088FF，圆角2dp，不描边。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    
    <solid android:color="#F00088FF"/>
    <corners android:radius="2dp" />
    <stroke android:width="0dp" android:color="@null" />

</shape>

注：Android Studio会有预览，这个没有。

        修改按钮背景，android:background="@drawable/bt_bgnormal"，预览。

        点击颜色还是没有变化，别急，再建立一个按下时的shape，复制bt_bgnormal，改名bt_bgselect，并将填充改为#FF0088FF，如何点击时切换，需要另一种drawable，selector（选择器，可以判断不同的状态，改变不同的属性），包含选项：<item />，包含属性，android:state_xxx，不同的状态，android:drawable，就是drawable。
        按钮是否按下，用android:state_pressed（试试其他的），true时drawable="@drawable/bt_bgselect"，false时bt_bgnormal。

<?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/bt_bgselect" />
    <item android:state_pressed="false" android:drawable="@drawable/bt_bgnormal" />

</selector>

        修改按钮背景，android:background="@drawable/bt_bg"，运行。

二、EditText美化

        直接为编辑框写一个selector，新建et_bg，EditText状态判断要用android:state_focused（试试其他），这里直接在<item></item>中嵌一个<shape></shape>：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    
    <item android:state_focused="true">
        <shape>
            <solid android:color="#E0E0E0"/>
    		<corners android:radius="2dp" />
    		<stroke android:width="1.5dp" android:color="#FF0088FF"/>
        </shape>
    </item>
    <item android:state_focused="false">
        <shape>
            <solid android:color="#E0E0E0"/>
    		<corners android:radius="2dp" />
    		<stroke android:width="1.5dp" android:color="#880088FF"/>
        </shape>
    </item>

</selector>

        运行，EditText好像android:state_focused="false"触发不了，在<Button/>中加入android:focusable="true"和android:focusableInTouchMode="true"，意思是点击时获得焦点，同时EditText失去焦点android:state_focused="false"触发，运行，不怎么好看（配色不好，功能还可以）。

注：这是一个.gif动图，ctrl点击图片查看。

不能放弃——2016/10/21