Android - Resource 之 Drawable小结 - JavaScript

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

本篇直接选择性地翻译官方开发指南

=============================

Drawable有十种类型，如下

（1） - Bitmap file：这个简单，也可以用xml来更详细的定义，先按下不写。。。。

（2） - Nine-Patch File: 这个是一个自定义绽放区域的Bitmap，一般以.9.png为后缀，可能用 SDK/tools/draw9patch.bat来生成，实际上这个工具在图片外边缘添加一个一像素的边框用来标记“缩放区域”，如下

调整一下后，会得到这样的效果：

（3） - Layer List：一个多层级的Drawable，按顺序绘制到屏幕：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<bitmap android:src="@drawable/android_red"
android:gravity="center" />
</item>
<item android:top="10dp" android:left="10dp">
<bitmap android:src="@drawable/android_green"
android:gravity="center" />
</item>
<item android:top="20dp" android:left="20dp">
<bitmap android:src="@drawable/android_blue"
android:gravity="center" />
</item>
</layer-list>

效果如下：

（4） - State List: 就是根据该Drawable的状态来决定用哪个Drawable来显示，例如是一个Button有(pressed、focused、niether)各种状态。

例子如下：

<?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/button_pressed" /> 
<item android:state_focused="true"
android:drawable="@drawable/button_focused" /> 
<item android:state_hovered="true"
android:drawable="@drawable/button_focused" /> 
<item android:drawable="@drawable/button_normal" /> 
</selector>

（5） - Level List: 在一个View中根据其level显示不同的drawable，创建一个LevelListDrawable。例子：

<level-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:maxLevel="4" android:drawable="@drawable/stat_sys_battery_0" />
<item android:maxLevel="14" android:drawable="@drawable/stat_sys_battery_10" />
<item android:maxLevel="29" android:drawable="@drawable/stat_sys_battery_20" />
<item android:maxLevel="49" android:drawable="@drawable/stat_sys_battery_40" />
<item android:maxLevel="69" android:drawable="@drawable/stat_sys_battery_60" />
<item android:maxLevel="89" android:drawable="@drawable/stat_sys_battery_80" />
<item android:maxLevel="100" android:drawable="@drawable/stat_sys_battery_100" />
</level-list>

然后在View中，把ImageView的src设置为该xml，调用:

imageView.getDrawable().setLevel(50);

android会自动选择对应的图片，显示剩余电量就是这样实现的。选择的规则是选maxLevel大于或等于setLevel传入参数的item.

（6） - Transition Drawable: 用于定义一个能够淡入淡出的效果，创建一个TransitionDrawable。例子：/drawable/transition.xml

<?xml version="1.0" encoding="utf-8"?>
<transition xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="@drawable/ic_m_48"
android:top="20dp"
android:left="20dp"/>
<item android:drawable="@drawable/ic_2_h"/>
</transition>

在Layout中引用如下：

在回调函数中进行如下调用：

public void TransitionDrawableTest(View view){
ImageButton button = (ImageButton) findViewById(R.id.btn_3);
TransitionDrawable drawable = (TransitionDrawable) button.getDrawable();
drawable.startTransition(500);
}

（7）- Inset Drawable:嵌入某个Drawable，可以保留一定的边缘。当一个View的背景比View本身大小要小的时候，这个很好用。创建一个InsetDrawable。

例子很简单：

<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/background"
android:insetTop="10dp"
android:insetLeft="10dp" />

（8） - Clip Drawable:裁剪的Drawable，进度条时十分好用。

clip.xml如下：

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

activity里的ImageView与seelbar:

在activity的onCreate函数里为seekbar添加一个Listener：

SeekBar seekbar = (SeekBar)findViewById(R.id.seelbar);
seekbar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
@Override
public void onStopTrackingTouch(SeekBar seekBar) {
}
@Override
public void onStartTrackingTouch(SeekBar seekBar) {
}
@Override
public void onProgressChanged(SeekBar seekBar, int progress,
boolean fromUser) {
// TODO Auto-generated method stub
ClipDrawable drawable = (ClipDrawable) imageview.getBackground();
drawable.setLevel(progress);
}
});

效果：

（9）Scale Drawable:用于改变其他drawable大小的一个drawable（太拗口），指向一个ScaleDrawable。

<?xml version="1.0" encoding="utf-8"?>
<scale
xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/drawable_resource"
android:scaleGravity=["top" | "bottom" | "left" | "right" | "center_vertical" |
"fill_vertical" | "center_horizontal" | "fill_horizontal" |
"center" | "fill" | "clip_vertical" | "clip_horizontal"]
android:scaleHeight="percentage"
android:scaleWidth="percentage"/>

例子：

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/logo"
android:scaleGravity="center_vertical|center_horizontal"
android:scaleHeight="80%"
android:scaleWidth="80%" />

（10） - Shape Drawable:定义图形。可以自定义背景渐变。文法：

<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape=["rectangle" | "oval" | "line" | "ring"] >
<corners
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="integer"
android:endColor="color"
android:gradientRadius="integer"
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
android:width="integer"
android:height="integer" />
<solid
android:color="color" />
<stroke
android:width="integer"
android:color="color"
android:dashWidth="integer"
android:dashGap="integer" />
</shape>