Android：图形

Andriod图标下载http://www.easyicon.cn/iconsearch/android-icons/1/

http://www.codeceo.com/article/android-drawable-explanation.html

图形有传统意思上的一张图片（BMP，JPG，PNG），用Bitmap表示，还有各种通过XML文件定义的实现特殊功能效果的图形，都是Drawable，

改造思想，把它看成特殊的哦图形即可。

例如：

9-Path图形：一种特殊的PNG，可以通过Android工具生成一张允许特定位置拉伸和不拉伸的PNG，广泛用于控件的背景。

Layer-List图形：用于多张图形的合并，比如相框和相片的合成。

State-List图形：用于控件的背景图，控件在不同的状态下显示不同的图片。

Level-List图形：用于显示一张根据Level显示图形的图形。比如电池电量

Transition图形：用于多张图形的过渡显示。

Clip图形：裁剪图形，例如进度条就是这样做的。

Shape图形：定义更好看的各种图形

9-Path图形

NinePatch是一种很有用的PNG图片格式，它可以在特定区域随文字大小进行缩放。如下：

从上图可以看到，背景图片的中间区域会随着文字的大小进行缩放。背景图片是一张NinePatch图片。

NinePatch图片可以使用android自带的draw9patch工具来制作，该工具在SDK安装路径的tools目录下。执行该工具，然后点击

“File”->“open9-path”打开一张用于制作NinePatch图片的原来图片。在画布的上方和左方的边上画线指定缩放区域，勾选“Showpatches”

可显示画定的区域，绿色为固定大小区域，红色为缩放区域，文字会摆放在红色区域。

制作完后，点击“File”à “save 9-path”保存图片，draw9patch工具会自动为图片加上*.9.png后缀。把制作好的图片拷贝进项目的

res/drawable目录，然后编写代码。

如下：

<TextViewandroid:layout_width="wrap_content"

   android:layout_height="wrap_content"

   android:text="退出"android:textColor="#330000"

   android:background="@drawable/button"/>

Layer-List的定义文件

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/faceback" />
    <item android:drawable="@drawable/user"
        android:top="68dp"
        android:right="18dp"
        android:bottom="22dp"
        android:left="18dp"
        android:id="@+id/userimage"
        />
</layer-list>

后面这张图片的位置由top、right等确定，指定了这些就会缩放图片

//LayerDrawable layerDrawable = (LayerDrawable) imageView.getDrawable();

LayerDrawable layerDrawable = (LayerDrawable)getResources().getDrawable(R.drawable.layerlist);//要获取到本主才能修改

Drawable drawable = getResources().getDrawable(R.drawable.icon);
layerDrawable.setDrawableByLayerId(R.id.userimage, drawable);//改变里面的图片，美女的图片
imageView.setImageDrawable(layerDrawable);

State-List定义文件

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:state_enabled="true" android:drawable="@drawable/bg_selected" /> <!-- pressed -->
    <item android:state_selected="true" android:drawable="@drawable/bg_selected" /> <!-- focused -->
    <item android:drawable="@drawable/bg_normal" /> <!-- default -->
</selector>

然后在控件上应用这个图形

Level-List定义文件

<?xml version="1.0" encoding="utf-8"?>
<level-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@drawable/faceback" android:minLevel="0" android:maxLevel="10" />//显示这张图片的范围是0-10
    <item android:drawable="@drawable/user" android:minLevel="11" android:maxLevel="20"/>//显示这张图片的范围是11-20
</level-list>

LevelListDrawable levelListDrawable = (LevelListDrawable) imageView.getDrawable();
levelListDrawable.setLevel(12);

Transition定义文件

<?xml version="1.0" encoding="utf-8"?>
<transition xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/bg_normal" />
    <item android:drawable="@drawable/bg_selected" />
</transition>

TransitionDrawable transitionDrawable = (TransitionDrawable) ((Button)v).getBackground();

transitionDrawable.startTransition(500);//500毫秒内过渡

Clip定义文件

<?xml version="1.0" encoding="utf-8"?>
<clip xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/user"
    android:clipOrientation="horizontal"
    android:gravity="left" />

ClipDrawable clipDrawable = (ClipDrawable) imageView.getDrawable();
clipDrawable.setLevel(clipDrawable.getLevel()+1000);//每次调用就会增加1000，进度条的效果。

圆角矩形定义文件，应用于控件

<Button
   android:background="@drawable/rectangle"/>

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:startColor="#FFFF0000"
        android:endColor="#80FF00FF"
        android:angle="270"/>
    <padding android:left="7dp"
        android:top="7dp"
        android:right="7dp"
        android:bottom="7dp" />
    <corners android:radius="8dp" />
     <stroke
        android:width="2dp"
        android:color="#FFFFFF"
        android:dashWidth="8dp"
        android:dashGap="4dp" />
</shape>