Android XML绘图

        XML在Android系统中不仅仅是Java中的一个布局文件、配置列表。在Android开发者的手上，它甚至可以变成一直画、一幅图。

Android的开发者给XML提供了几个强大的技能来帮助我们实现这一功能。

1.Bitmap

        在XML中使用bitmap非常简单，代码如下所示。

<?xml version="1.0" encoding="utf-8"?><bitmap xmlns:android="http://schemas.android.com/apk/res/android"android:src="@drawable/ic_launcher"/>

2.Shape

        通过Shape可以在XML中绘制各种形状，下面展示了Shape所支持的各种形状。

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android"//默认为rectangleandroid:shape=["rectangle"|"oval"|"line"|"ring"]>    <corners //当shape="rectangle"时使用    //半径，会被后面的单个半径属性覆盖，默认为1dp    android:radius="integer"    android:topLeftRadius="integer"    android:topRightRadius="integer"    android:BottomLeftRadius="integer"    android:BottomRightRadius="integer"/>        <gradient //渐变    android:angle="integer"    android:centerX="integer"    android:centerY="integer"    android:centerColor="color"    android:endColor="color"    android:gradientRadius="color"    android:startColor="color"    android:type=["linear"|"radial"|"sweep"]    android:useLevel=["true"|"false"]/>        <padding    android:left="integer"    android:top="integer"    android:right="integer"    android:bottom="integer"/>        <size //指定大小，一般用在imageview配合scaleType属性使用    android:width="integer"    android:height="integer"/>        <solid //填充颜色    android:color="color"/>        <strike //指定边框    android:width="integer"    android:color="color"    //虚线宽度    android:dashWidth="integer"     //虚线间隔宽度    android:dashGap="integer"/></shape>

        Shape可以说是XML绘图的精华所在。Shape功能十分强大，无论时扁平化、拟物化还是渐变，它都能绘制。整个Shape的可用参数在上面的表中已经列举的很清楚了。大家在使用中，试试想要的属性就能很快掌握。

        下面时一个简单的通过渐变来实现的阴影效果，代码如下，效果图如下所示。

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android">    <gradient android:startColor="#ff5da2ff"        android:endColor="#805fbbff"        android:angle="45"/>    <padding android:left="7dp"        android:right="7dp"        android:top="7dp"        android:bottom="7dp"/>    <corners android:radius="8dp"/></shape>

3.Layer

        Layer时在Photoshop中非常常用的功能。在Android中，同样可以通过Layer来实现类似Photoshop中图层的概念。

<?xml version="1.0" encoding="utf-8"?><layer-list xmlns:android="http://schemas.android.com/apk/res/android">    <!--图片1-->    <item android:drawable="@mipmap/ic_launcher"/>    <!--图片2-->    <item android:drawable="@mipmap/ic_launcher"        android:left="30.0dp"        android:top="30.0dp"        android:right="30.0dp"        android:bottom="30.0dp"/></layer-list>

                        

        通过layer、layer-list可以很方便的实现Photoshop中的图层效果，图片会依次叠加，效果如图所示。

4.Selector

        Selector的作用在于帮助开发者实现静态绘图中的事件反馈，通过给不同的事件设置不同的图形，从而在程序中更具用户输入，返回不同的效果。

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">    <!--默认时的背景图片-->    <item android:drawable="@drawable/X1"/>    <!--没有焦点时的图片-->    <item android:state_window_focused="false"        android:drawable="@drawable/X2"/>    <!--非触摸模式下获得焦点并单击时的背景图片-->    <item android:state_focused="true"        android:state_pressed="true"        android:drawable="@drawable/X3"/>    <!--触摸模式下单机时的背景图片-->    <item android:state_focused="false"        android:state_pressed="true"        android:drawable="@drawable/X4"/>    <!--选中时的背景图片-->    <item android:state_selected="true"        android:drawable="@drawable/X5"/>    <!--获得焦点时的背景图片-->    <item android:state_focused="true"        android:drawable="@drawable/X6"/></selector>

        这一方法可以帮助开发者迅速制作View的触摸反馈。通过配置不同的出发事件，Selector可以自动选择不同的图片。特别时在自定义Button时，我们就不用再使用原生的Button单调的背景，而使用Selector特别定制过的背景。不用再程序中修改点击的逻辑，就能完美实现触摸反馈。

      通常情况下，上面提到的这些方法都是可以共同作用的。下面这个例子就是展示了再一个Selector中使用Shape作为它的Item的例子，实现了一个具有点击反馈效果的、圆角矩形的Selector，代码如下所示。

 

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">    <item android:state_pressed="true">        <shape android:shape="rectangle">            <!--填充的颜色-->            <solid android:color="#33444444"/>            <!--设置按钮的4个圆角-->            <corners android:radius="5dp"/>            <!--padding:Button里面的文字与Button边界的距离-->            <padding android:bottom="10dp"                android:left="10dp"                android:right="10dp"                android:top="10dp"/>        </shape>    </item>    <item>        <shape android:shape="rectangle">            <!--填充的颜色-->            <solid android:color="#ffffff"/>            <!--设置按钮的4个圆角-->            <corners android:radius="5dp"/>            <!--padding:Button里面的文字与Button边界的距离-->            <padding android:bottom="10dp"                android:left="10dp"                android:right="10dp"                android:top="10dp"/>        </shape>    </item></selector>

        相信通过这个例子大家不仅可以体会到XML绘图的强大，更可以知道各种绘图方法所适用的场景和优缺点。