Android样式开发总结

前言

一个应用，应该保持一套统一的样式，包括Button、EditText、ProgressBar、Toast、Checkbox等各种控件的样式，还包括控件间隔、文字大小和颜色、阴影等等。web的样式用css来定义，而android的样式主要则是通过shape、selector、layer-list、level-list、style、theme等组合实现。

本文参考Keegan小钢的文章，通过自己实践进行总结。

shape

shape是Android最基础的形状定义工具。一般用shape定义的xml文件存放在drawable目录下，若项目没有该目录则新建一个，而不要将它放到drawable-hdpi等目录中。

使用shape可以自定义形状，可以定义下面四种类型的形状，通过android:shape属性指定：

rectangle: 矩形，默认的形状，可以画出直角矩形、圆角矩形、弧形等
oval: 椭圆形，用得比较多的是画正圆
line: 线形，可以画实线和虚线
ring: 环形，可以画环形进度条

下面将对每个形状进行总结。

rectangle（矩形）

rectangle是默认的形状，也是用得最多的形状，可用于文字背景、按钮背景、控件或布局背景等，以下是一些简单的例子：

shape示例

相关特性：

• solid

设置形状填充的颜色，只有android:color一个属性

<solid android:color="#1C86EE"/>

• padding

设置内容与形状边界的内间距，可分别设置左右上下的距离

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

• gradient

设置形状的渐变颜色，可以是线性渐变、辐射渐变、扫描性渐变。

android:type 渐变的类型
        linear 线性渐变，默认的渐变类型
        radial 放射渐变，设置该项时，android:gradientRadius也必须设置
        sweep 扫描性渐变
android:startColor 渐变开始的颜色
android:endColor 渐变结束的颜色
android:centerColor 渐变中间的颜色
android:angle 渐变的角度，线性渐变时才有效，必须是45的倍数，0表示从左到右，90表示从下到上
android:centerX 渐变中心的相对X坐标，放射渐变时才有效，在0.0到1.0之间，默认为0.5，表示在正中间
android:centerY 渐变中心的相对X坐标，放射渐变时才有效，在0.0到1.0之间，默认为0.5，表示在正中间
android:gradientRadius 渐变的半径，只有渐变类型为radial时才使用
android:useLevel 如果为true，则可在LevelListDrawable中使用

示例：

<gradient android:type="linear"
          android:startColor="#FFFFFF"
          android:centerColor="#CAE1FF"
          android:endColor="#1C86EE"
          android:angle="90"
          android:useLevel="false"/>

• corners

设<corners android:radius="200dp"/>置圆角，只适用于rectangle类型，可分别设置四个角不同半径的圆角，当设置的圆角半径很大时，比如200dp，就可变成弧形边了。

android:radius 圆角半径，会被下面每个特定的圆角属性重写
android:topLeftRadius 左上角的半径
android:topRightRadius 右上角的半径
android:bottomLeftRadius 左下角的半径
android:bottomRightRadius 右下角的半径

示例：

<corners android:radius="200dp"
         android:topLeftRadius="10dp"
         android:topRightRadius="10dp"
         android:bottomLeftRadius="0dp"
         android:bottomRightRadius="0dp"/>

• stroke

设置描边，可描成实线或虚线。

android:color 描边的颜色
android:width 描边的宽度
android:dashWidth 设置虚线时的横线长度
android:dashGap 设置虚线时的横线之间的距离

示例：

<stroke android:color="#000000"
        android:width="2dp"
        android:dashWidth="8dp"
        android:dashGap="8dp"/>
</shape>

“加了实线描边的矩形”示例：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">
    <solid android:color="#1C86EE"/>
    <corners android:radius="200dp"/>
    <padding
        android:bottom="10dp"
        android:left="10dp"
        android:right="10dp"
        android:top="10dp"/>
    <stroke
        android:width="2dp"
        android:color="#000000"
        android:dashGap="8dp"
        android:dashWidth="8dp"/>
</shape>

---

未完待续。。。