5、控件美化（drawable使用）
程序员文章站
2024-01-13 14:16:52
...
先前的回复页面虽然搭好了，功能也实现了，但页面总显得不太美观（虽然已经加入了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，不描边。
注：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。
修改按钮背景，android:background="@drawable/bt_bg"，运行。
二、EditText美化
直接为编辑框写一个selector，新建et_bg，EditText状态判断要用android:state_focused（试试其他），这里直接在<item></item>中嵌一个<shape></shape>：
运行，EditText好像android:state_focused="false"触发不了，在<Button/>中加入android:focusable="true"和android:focusableInTouchMode="true"，意思是点击时获得焦点，同时EditText失去焦点android:state_focused="false"触发，运行，不怎么好看（配色不好，功能还可以）。
注：这是一个.gif动图，ctrl点击图片查看。
先说下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
