本章内容的项目实战呢，是在美化BeatBox应用，由于没有实践此应用，那以Demo形式来总结此章的核心知识点吧。

凡是要在屏幕上绘制的东西都可以叫作drawable，比如抽象图形、Drawable类的子类、位图图像等。用来封装图片的BitmapDrawable也是一种drawable。state list drawable、shape drawable 和 layer list drawable 统称为XML drawable。

1. shape drawable

ShapeDrawable可以把按钮变成圆形。XML drawable和屏幕像素密度无关，无需考虑创建特定像素密度目录，直接放入drawable文件夹即可。

button_beat_box_normal.xml（书中例子）

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="@color/colorAccent" />
</shape>

截图取自Demo

截图取自Demo

1. shape 图形形状
2. corners 圆角标签（指定长方形四角的圆滑度）
   • bottomLeftRadius 左下角
   • bottomRightRadius 右下角
   • topLeftRadius 左上角
   • topRightRadius 右上角
   • radius 是四个角，设置了这个就不需要设置上面的四个了，但是它的优先级比较低， 会被上面的设置覆盖。
3. gradient 阶梯渐变标签
   • angle 是颜色变换的角度，默认是0， 取值必须是45的倍数， 0： 是颜色从左边到右边， 90：是颜色从底部到顶部
   • startColor centerColor endColor : 开始的颜色，中间的颜色， 结束的颜色
   • centerX centerY是指定位置坐标，取值是0.0f ~ 1.0f 之间，例如： android:centerX="0.5f" 表示X方向的中间位置
   • type 颜色渐变的类型， 取值类型有三种：linear/radial/sweep
   • linear 线性渐变，就是颜色从左往右， 从下往上
   • radial 放射渐变， 例如：从一个圆中心到圆的边缘变化
   • sweep 扫描式渐变， 类似雷达扫描的那种图形
   • gradientRadius 和android:type=”radial”一起连用，配置shape图片的半径
4. padding 边距标签（设置控件中(文字)内容与shape图片边框的距离，bottom 底部距离，left 左边距离，right 右边距离，top 顶部距离）
5. size 大小标签（shape图形的宽度和高度，这里一般不用设置，它的优先级没有控件的优先级大）
6. solid 背景标签（stroke标签中如果不指定color的颜色， 则默认是黑色，solid标签会和gradient标签冲突, 会覆盖gradient配置的颜色）
7. stroke 边框标签 （给shape图形设置边框， 设置边框的宽度， 颜色，实现还是虚线， 以及虚线的间隔大小）
   • width 边框线的宽度
   • color 边框线的颜色
   • dashGap 虚线间隔的长度
   • dashWidth 虚线中实线的长度

shape图形：

1. rectangle 长方形/默认是长方形
2. oval 椭圆
3. line 线（line形状下，solid标签下的color会无效）
4. ring 环形 （innerRadius——中间圆圈的半径；innerRadiusRatio——如果和innerRadius同时存在, innerRadiusRatio无效，是一个比率: shape图片宽度/内半径, 默认是9；thickness——圆环的厚度，整的shape图片的半径减去内圆的半径；thicknessRatio——同样如果和thickness同时存在，thicknessRatio无效， 也是一个比率: shape图片宽度/圆环厚度，默认值是3；useLevel—— 一般使用false）

2. state list drawable

这里例子就是在完善上一个知识点的按钮按下状态的切换了，除了按下状态，state list drawable还支持禁用、聚焦以及激活等状态。

button_beat_box_pressed.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
   android:shape="oval">
   <solid android:color="@color/colorPrimary" />
</shape>

button_beat_box.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/button_beat_box_pressed"
          android:state_pressed="true" />
    <item android:drawable="@drawable/button_beat_box_normal" />
</selector>

截图取自Demo

按下后的效果：

截图取自Demo

当然，state list drawable还支持禁用、聚焦以及激活等状态。

3. layer list drawable

layer list drawable能让两个XML drawable合二为一，现在为按下状态的添加一个深色的圆环。

button_beat_box_pressed.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval">
            <solid android:color="@color/colorPrimary"/>
        </shape>
    </item>
    <item>
        <shape android:shape="oval">
            <stroke
                android:width="4dp"
                android:color="@color/colorPrimaryDark"/>
        </shape>
    </item>
</layer-list>

按下效果：

截图取自Demo

深入学习：为什么要用XML drawable

• 方便灵活、用法多样、易于更新维护，搭配shape drawable 和 layer list drawable可作出复杂的背景图，配色简单。
• XML drawable 独立于屏幕像素密度，直接定义在drawable目录中，不需要加屏幕密度资源修饰符，不需要准备多个版本以适配更多设备。

深入学习：使用 9-patch 图像

（比如说聊天界面的气泡框，会用到这种图片，解决了不同长度图片或文字可能被拉伸的问题）

• 9-patch 图像是一种特别处理过的文件，让Android知道图像的哪些部分是可以拉伸的。
• 9-patch 图像分成 3 x 3 的网格，即由9部分或者9 patch组成的网格。网格角落部分不会被缩放。边缘部分的4个patch只按一个维度缩放，而中间部分则按两个维度缩放。

截图取于网上

• 9-patch 图像文件名以 .9.png结尾，图边缘具有1像素宽度的边框。

• 任意图形编辑器都可以用来创建 9-patch 图像，Android SDK自带的draw9patch工具更方便，工具地址：SDK安装目录下的tools中，找到打开即可。

  
  
  截图取自自身电脑
  截图取自自身电脑
• 9-patch工具中，把图像顶部和左边填充为黑色，以标记图像的可伸缩区域。 底部和右边定义可选drawable区域，通常是绘制内容，比如说文字的地方，若不标记drawable区域，则默认与可拉伸区域保持一致。
• Android Studio内置有9-patch编辑器，可以直接在项目中把图片转换为9-patch图，先重命名，然后打开，就可以自行去设置.9图了。

1

2

3

这个非常实用！

深入学习：使用Mipmap图像

推荐把应用启动器图标放在mipmap目录中，其他图片都放在drawable目录中。

谷歌官方：

• drawable/
  For bitmap files (PNG, JPEG, or GIF), 9-Patch image files, and XML files that describe Drawable shapes or Drawable objects that contain multiple states (normal, pressed, or focused). See the Drawable resource type.
• mipmap/
  For app launcher icons. The Android system retains the resources in this folder (and density-specific folders such as mipmap-xxxhdpi) regardless of the screen resolution of the device where your app is installed. This behavior allows launcher apps to pick the best resolution icon for your app to display on the home screen. For more information about using the mipmap folders, see Managing Launcher Icons as mipmap Resources.

google说图片放入mipmap系统会在缩放上提供一定的性能优化，使用上来说，drawable和mipmap上放普通图片区别也不大。原来我们把项目中用到的png、jpeg图片还有xml文件都是放在drawable中，显得还是很杂乱的，找个图片多难哇~ 所以，建议就把icon图片放mipmap，然后xml就放drawable，这样不错的。

建议尺寸：

截图取自网络

参考里面的dpi范围-密度表格：

截取自网络