android开发那些事儿（二）--Drawable资源

在Android应用中，常常会用到Drawable资源，比如图片资源等，在Android开发中我们是用Drawable类来Drawable类型资源的。

Drawable资源一般存储在应用程序目录的\res\drawable目录下,当然依据分辨率的高低可以分别存储不同分辨率的资源到如下几个目录：

\res\drawable-hdpi

\res\drawable-ldpi

\res\drawable-mdpi

\res\drawable-xdpi

其SDK文档中声明如下：

我们看到Drawable是一个抽象类（abstract class），它有好多子类（SubClass）来操作具体类型的资源，比如BitmapDrawable是用来操作位图，ColorDrawable用来操作颜色，

ClipDrawable用来操作剪切板等。

图片资源

图片资源是简单的Drawable资源，目前Android支持的图片格式有：gif、png、jpg等。我们只需要把图片资源放置到\res\drawable目中，那么在编译后的R.java类中就会生成图片资源的资源ID

我们在程序中就可以通过调用相关的方法来获取图片资源（程序中如果要访问drawable_resource_file_name，那么可以如此：[packagename].R.drawable.drawable_resource_file_name）。

注：Android中drawable中的资源名称有约束，必须是： [a-z0-9_.]（即：只能是字母数字及_和.），而且不能以数字开头，否则编译会报错： Invalid file name: must contain only [a-z0-9_.]

以下代码片段演示了如何访问一个图片资源(资源名称drawablefilename):

ImageView imageView=(ImageView)findViewById(com.jeriffe.app.R.id.ImageView1);
imageView.setImageResource(com.jeriffe.app.R.drawable.drawablefilename);

StateListDrawable资源

StateListDrawable内可以分配一组Drawable资源，StateListDrawable 被定义在一个XML文件中，以 <selector>元素起始。其内部的每一个Drawable资源内嵌在<item>元素中。

当StatListDrawable资源作为组件的背景或者前景Drawable资源时，可以随着组件状态的变更而自动切换相对应的资源，例如，一个Button可以处于不同的状态(按钮按下、获取焦点)

我们可以使用一个StateListDrawable资源，来提供不同的背景图片对于每一个状态。，当组件的状态变更时，会自定向下遍历StateListDrawable对应的xml文件来查找第一个匹配的Item。

StatListDrawable资源所支持的组件状态如下图所示：

以下代码片段是一个StateListDrawable资源的XML文件描述样例：

XML 文件存储在： res/drawable/button_statelist.xml:

<span class="kwrd" style="color: rgb(0, 0, 255);"><?</span><span class="html" style="color: rgb(128, 0, 0);">xml</span> <span class="attr" style="color: rgb(255, 0, 0);">version</span><span class="kwrd" style="color: rgb(0, 0, 255);">="1.0"</span> <span class="attr" style="color: rgb(255, 0, 0);">encoding</span><span class="kwrd" style="color: rgb(0, 0, 255);">="utf-8"</span>?<span class="kwrd" style="color: rgb(0, 0, 255);">></span>
<span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">selector</span> <span class="attr" style="color: rgb(255, 0, 0);">xmlns:android</span><span class="kwrd" style="color: rgb(0, 0, 255);">="http://schemas.android.com/apk/res/android"</span><span class="kwrd" style="color: rgb(0, 0, 255);">></span><span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">item</span> <span class="attr" style="color: rgb(255, 0, 0);">android:state_pressed</span><span class="kwrd" style="color: rgb(0, 0, 255);">="true"</span><span class="attr" style="color: rgb(255, 0, 0);">android:drawable</span><span class="kwrd" style="color: rgb(0, 0, 255);">="@drawable/button_pressed"</span> <span class="kwrd" style="color: rgb(0, 0, 255);">/></span> <span class="rem" style="color: rgb(0, 128, 0);"><!-- pressed --></span><span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">item</span> <span class="attr" style="color: rgb(255, 0, 0);">android:state_focused</span><span class="kwrd" style="color: rgb(0, 0, 255);">="true"</span><span class="attr" style="color: rgb(255, 0, 0);">android:drawable</span><span class="kwrd" style="color: rgb(0, 0, 255);">="@drawable/button_focused"</span> <span class="kwrd" style="color: rgb(0, 0, 255);">/></span> <span class="rem" style="color: rgb(0, 128, 0);"><!-- focused --></span><span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">item</span> <span class="attr" style="color: rgb(255, 0, 0);">android:state_hovered</span><span class="kwrd" style="color: rgb(0, 0, 255);">="true"</span><span class="attr" style="color: rgb(255, 0, 0);">android:drawable</span><span class="kwrd" style="color: rgb(0, 0, 255);">="@drawable/button_focused"</span> <span class="kwrd" style="color: rgb(0, 0, 255);">/></span> <span class="rem" style="color: rgb(0, 128, 0);"><!-- hovered --></span><span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">item</span> <span class="attr" style="color: rgb(255, 0, 0);">android:drawable</span><span class="kwrd" style="color: rgb(0, 0, 255);">="@drawable/button_normal"</span> <span class="kwrd" style="color: rgb(0, 0, 255);">/></span> <span class="rem" style="color: rgb(0, 128, 0);"><!-- default --></span>
<span class="kwrd" style="color: rgb(0, 0, 255);"></</span><span class="html" style="color: rgb(128, 0, 0);">selector</span><span class="kwrd" style="color: rgb(0, 0, 255);">></span>

以下是Button的Layout文件：

<span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">Button</span><span class="attr" style="color: rgb(255, 0, 0);">android:layout_height</span><span class="kwrd" style="color: rgb(0, 0, 255);">="wrap_content"</span><span class="attr" style="color: rgb(255, 0, 0);">android:layout_width</span><span class="kwrd" style="color: rgb(0, 0, 255);">="wrap_content"</span><span class="attr" style="color: rgb(255, 0, 0);">android:background</span><span class="kwrd" style="color: rgb(0, 0, 255);">="@drawable/button"</span> <span class="kwrd" style="color: rgb(0, 0, 255);">/></span>

当然我们也可以通过代码来设置Button的背景图片：

Button imageButton=(Button)findViewById(R.id.imageButton);imageButton.setBackgroundResource(com.jeriffe.app.R.drawable.button_statelist);

ShapeDrawable资源

ShapeDrawable资源绘制一个特定的形状，比如矩形、椭圆等。如果你想自己动态的绘制二位图形，那么我们就可以使用ShapeDrawable资源对象，用ShapeDrawable,我们可以绘制我们所能想象的形状。。一个ShapeDrawable 需要一个Shape对象来管理呈现资源到UI Screen,如果没有Shape设置，那么会默认使用RectShape对象。

ShapeDrawable 被定义在一个XML文件中，以 <shape> 元素起始。其内部的每一个Drawable资源内嵌在<item>元素中

以下代码片段便是一个ShapeDrawable的XML定义

<span class="kwrd" style="color: rgb(0, 0, 255);"><?</span><span class="html" style="color: rgb(128, 0, 0);">xml</span> <span class="attr" style="color: rgb(255, 0, 0);">version</span><span class="kwrd" style="color: rgb(0, 0, 255);">="1.0"</span> <span class="attr" style="color: rgb(255, 0, 0);">encoding</span><span class="kwrd" style="color: rgb(0, 0, 255);">="UTF-8"</span>?<span class="kwrd" style="color: rgb(0, 0, 255);">></span>
<span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">shape</span> <span class="attr" style="color: rgb(255, 0, 0);">xmlns:android</span><span class="kwrd" style="color: rgb(0, 0, 255);">="http://schemas.android.com/apk/res/android"</span> <span class="attr" style="color: rgb(255, 0, 0);">android:shape</span><span class="kwrd" style="color: rgb(0, 0, 255);">="oval"</span><span class="kwrd" style="color: rgb(0, 0, 255);">></span><span class="rem" style="color: rgb(0, 128, 0);"><!-- 定义填充渐变颜色 --></span><span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">gradient</span> <span class="attr" style="color: rgb(255, 0, 0);">android:startColor</span><span class="kwrd" style="color: rgb(0, 0, 255);">="#00f"</span> <span class="attr" style="color: rgb(255, 0, 0);">android:endColor</span><span class="kwrd" style="color: rgb(0, 0, 255);">="#00f"</span> <span class="attr" style="color: rgb(255, 0, 0);">android:angle</span><span class="kwrd" style="color: rgb(0, 0, 255);">="45"</span><span class="attr" style="color: rgb(255, 0, 0);">android:type</span><span class="kwrd" style="color: rgb(0, 0, 255);">="sweep"</span><span class="kwrd" style="color: rgb(0, 0, 255);">/></span> <span class="rem" style="color: rgb(0, 128, 0);"><!-- 设置内填充 --></span><span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">padding</span> <span class="attr" style="color: rgb(255, 0, 0);">android:left</span><span class="kwrd" style="color: rgb(0, 0, 255);">="7dp"</span> <span class="attr" style="color: rgb(255, 0, 0);">android:top</span><span class="kwrd" style="color: rgb(0, 0, 255);">="7dp"</span> <span class="attr" style="color: rgb(255, 0, 0);">android:right</span><span class="kwrd" style="color: rgb(0, 0, 255);">="7dp"</span> <span class="attr" style="color: rgb(255, 0, 0);">android:bottom</span><span class="kwrd" style="color: rgb(0, 0, 255);">="7dp"</span> <span class="kwrd" style="color: rgb(0, 0, 255);">/></span><span class="rem" style="color: rgb(0, 128, 0);"><!-- 设置圆角矩形 --></span><span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">corners</span> <span class="attr" style="color: rgb(255, 0, 0);">android:radius</span><span class="kwrd" style="color: rgb(0, 0, 255);">="8dp"</span> <span class="kwrd" style="color: rgb(0, 0, 255);">/></span>
<span class="kwrd" style="color: rgb(0, 0, 255);"></</span><span class="html" style="color: rgb(128, 0, 0);">shape</span><span class="kwrd" style="color: rgb(0, 0, 255);">></span>

我们可以用ShapeDrawable 来设置组件的背景色（用setBackgroundDrawable()方法），如上的代码片段可设置一个TextEdit的背景色为蓝色的椭圆形状。当然我们也可以绘制自定义的View

我们构建自定义形状的View时，由于ShapeDrawable 有其自己的draw()方法，我们可以构建一个View视图的子类，然后override View.onDraw()方法，如下代码片段是一个样例：

 <span class="kwrd" style="color: rgb(0, 0, 255);">public</span> <span class="kwrd" style="color: rgb(0, 0, 255);">class</span> CustomDrawableView extends View {<span class="kwrd" style="color: rgb(0, 0, 255);">private</span> ShapeDrawable mDrawable;<span class="kwrd" style="color: rgb(0, 0, 255);">public</span> CustomDrawableView(Context context) {super(context);<span class="kwrd" style="color: rgb(0, 0, 255);">int</span> x = 10;<span class="kwrd" style="color: rgb(0, 0, 255);">int</span> y = 10;<span class="kwrd" style="color: rgb(0, 0, 255);">int</span> width = 300;<span class="kwrd" style="color: rgb(0, 0, 255);">int</span> height = 50;mDrawable = <span class="kwrd" style="color: rgb(0, 0, 255);">new</span> ShapeDrawable(<span class="kwrd" style="color: rgb(0, 0, 255);">new</span> OvalShape());mDrawable.getPaint().setColor(0xff74AC23);mDrawable.setBounds(x, y, x + width, y + height);}<span class="kwrd" style="color: rgb(0, 0, 255);">protected</span> <span class="kwrd" style="color: rgb(0, 0, 255);">void</span> onDraw(Canvas canvas) {mDrawable.draw(canvas);}}

基于上述代码我们可以在我们的Activity中编程的构建自定义视图：

CustomDrawableView mCustomDrawableView;<span class="kwrd" style="color: rgb(0, 0, 255);">protected</span> <span class="kwrd" style="color: rgb(0, 0, 255);">void</span> onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);mCustomDrawableView = <span class="kwrd" style="color: rgb(0, 0, 255);">new</span> CustomDrawableView(<span class="kwrd" style="color: rgb(0, 0, 255);">this</span>);setContentView(mCustomDrawableView);}

当然我们也可以使用XML文件来描述：自定义的Drawable类必须重载view (Context, AttributeSet) 构造函数。接着我们添加Layout文件如下：

 <span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">com.example.shapedrawable.CustomDrawableView</span>android:layout_width="fill_parent"android:layout_height="wrap_content"<span class="kwrd" style="color: rgb(0, 0, 255);">/></span>

ClipDrawable

ClipDrawable资源定义在一个XML中，表示裁剪(Clips)一个其他资源基于ClipDrawable资源的Level。你可以控制裁剪的Drawable的宽度高度及gravity属性，ClipDrawable常常被用来作为一个progressbars的实现。

以下样例是一个ClipDrawable资源：

<span class="kwrd" style="color: rgb(0, 0, 255);"><?</span><span class="html" style="color: rgb(128, 0, 0);">xml</span> <span class="attr" style="color: rgb(255, 0, 0);">version</span><span class="kwrd" style="color: rgb(0, 0, 255);">="1.0"</span> <span class="attr" style="color: rgb(255, 0, 0);">encoding</span><span class="kwrd" style="color: rgb(0, 0, 255);">="utf-8"</span>?<span class="kwrd" style="color: rgb(0, 0, 255);">></span><span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">clip</span> <span class="attr" style="color: rgb(255, 0, 0);">xmlns:android</span><span class="kwrd" style="color: rgb(0, 0, 255);">="http://schemas.android.com/apk/res/android"</span><span class="attr" style="color: rgb(255, 0, 0);">android:drawable</span><span class="kwrd" style="color: rgb(0, 0, 255);">="@drawable/android"</span><span class="attr" style="color: rgb(255, 0, 0);">android:clipOrientation</span><span class="kwrd" style="color: rgb(0, 0, 255);">="horizontal"</span><span class="attr" style="color: rgb(255, 0, 0);">android:gravity</span><span class="kwrd" style="color: rgb(0, 0, 255);">="left"</span> <span class="kwrd" style="color: rgb(0, 0, 255);">/></span>

下面的ImageView布局文件应用Clipdrawable资源：

<span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">ImageView</span><span class="attr" style="color: rgb(255, 0, 0);">android:id</span><span class="kwrd" style="color: rgb(0, 0, 255);">="@+id/image"</span><span class="attr" style="color: rgb(255, 0, 0);">android:background</span><span class="kwrd" style="color: rgb(0, 0, 255);">="@drawable/clip"</span><span class="attr" style="color: rgb(255, 0, 0);">android:layout_height</span><span class="kwrd" style="color: rgb(0, 0, 255);">="wrap_content"</span><span class="attr" style="color: rgb(255, 0, 0);">android:layout_width</span><span class="kwrd" style="color: rgb(0, 0, 255);">="wrap_content"</span> <span class="kwrd" style="color: rgb(0, 0, 255);">/></span>

下面的代码获取drawable并且增加其裁剪，以便于渐增的显示图像

ImageView imageview = (ImageView) findViewById(R.id.image);ClipDrawable drawable = (ClipDrawable) imageview.getDrawable();drawable.setLevel(drawable.getLevel() + 1000);

当然我们可以使用一个Timer来实现图片的渐增显示。

注意: 默认的Level值是0，表示图片被这个裁剪，故图片是不可见的。当值达到10000是代码裁剪为0，图片可以完全显示。

AnimationDrawable

AnimationDrawable

AnimationDrawable通过定义一系列的Drawable对象构建一个基于帧的动画(frame-by-frame animations)，可以被用来作为视图的背景色。

最简单的构建一个帧动画是在XML文件中构建一个动画,我们可以设定动画作为视图的背景色，通过调用AnimationDrawable.start()方法来运行动画。

如下代码片段是一个AnimationDrawable资源的XML文件,资源文件位置：res\drawable\spin_animation.xml

<span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">animation-list</span> <span class="attr" style="color: rgb(255, 0, 0);">xmlns:android</span><span class="kwrd" style="color: rgb(0, 0, 255);">="http://schemas.android.com/apk/res/android"</span><span class="attr" style="color: rgb(255, 0, 0);">android:oneshot</span><span class="kwrd" style="color: rgb(0, 0, 255);">="true"</span><span class="kwrd" style="color: rgb(0, 0, 255);">></span><span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">item</span> <span class="attr" style="color: rgb(255, 0, 0);">android:drawable</span><span class="kwrd" style="color: rgb(0, 0, 255);">="@drawable/rocket_thrust1"</span> <span class="attr" style="color: rgb(255, 0, 0);">android:duration</span><span class="kwrd" style="color: rgb(0, 0, 255);">="200"</span> <span class="kwrd" style="color: rgb(0, 0, 255);">/></span><span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">item</span> <span class="attr" style="color: rgb(255, 0, 0);">android:drawable</span><span class="kwrd" style="color: rgb(0, 0, 255);">="@drawable/rocket_thrust2"</span> <span class="attr" style="color: rgb(255, 0, 0);">android:duration</span><span class="kwrd" style="color: rgb(0, 0, 255);">="200"</span> <span class="kwrd" style="color: rgb(0, 0, 255);">/></span><span class="kwrd" style="color: rgb(0, 0, 255);"><</span><span class="html" style="color: rgb(128, 0, 0);">item</span> <span class="attr" style="color: rgb(255, 0, 0);">android:drawable</span><span class="kwrd" style="color: rgb(0, 0, 255);">="@drawable/rocket_thrust3"</span> <span class="attr" style="color: rgb(255, 0, 0);">android:duration</span><span class="kwrd" style="color: rgb(0, 0, 255);">="200"</span> <span class="kwrd" style="color: rgb(0, 0, 255);">/></span>
<span class="kwrd" style="color: rgb(0, 0, 255);"></</span><span class="html" style="color: rgb(128, 0, 0);">animation-list</span><span class="kwrd" style="color: rgb(0, 0, 255);">></span>

我们可以看到，AnimationDrawable资源文件以<animation-list>元素为根，包含一系列的<Item>节点，每一个节点定义了一个帧(frame)及持续时常。

上述动画运行了3个帧，通过设置android:oneshot 属性(attribute)为true，动画会循环一次并停留在最后一帧，如果为false那么会轮询(loop)的运行动画

我们可以通过编码来加载播放动画：

 <span class="rem" style="color: rgb(0, 128, 0);">// Load the ImageView that will host the animation and</span><span class="rem" style="color: rgb(0, 128, 0);">// set its background to our AnimationDrawable XML resource.</span>ImageView img = (ImageView)findViewById(R.id.spinning_wheel_image);img.setBackgroundResource(R.drawable.spin_animation);<span class="rem" style="color: rgb(0, 128, 0);">// Get the background, which has been compiled to an AnimationDrawable object.</span>AnimationDrawable frameAnimation = (AnimationDrawable) img.getBackground();<span class="rem" style="color: rgb(0, 128, 0);">// Start the animation (looped playback by default).</span>frameAnimation.start();

注意：AnimationDrawable. start()方法不能够在Activity的onCreate()方法中调用，因为AnimationDrawable还未完全的附加(attached)到Window,如果你不需要交互而立即播放动画，那么可以在onWindowFocusChanged() 方法中，这个方法会在你的Activity Windows获取焦点是触发。

结束语

至此我们的Drawable资源就介绍完了，当然还有好多的Drawable子类未进行介绍，感兴趣的可以关注SDK文档。

android开发那些事儿（二）--Drawable资源相关推荐

Android开发笔记（二十四）res目录的结构与配置
res目录结构 res是Android项目工程中存放各类的目录,主要包括布局.图形与配置等等.res的子目录主要有: anim : 存放动画的描述文件 drawable : 存放各类图形的描述文件,包 ...
Android开发——SVGA格式动画内容资源替换
Android开发--SVGA格式动画内容资源替换随着接触的项目类型越来越多,目前格式个样的炫酷动画也随之而来,既然原生动画实现起来复杂,且有一个快捷灵活的动画为何不用呢,那让我们来好好学习一下如何 ...
Android开发笔记（二十七）对象序列化
什么是序列化程序中存储和传递信息,需要有个合适的数据结构,最简单的是定义几个变量,变量多了之后再分门别类,便成了聚合若干变量的对象.代码在函数调用时可以直接传递对象,但更多的场合例如与文件交互.与网 ...
android开发实验报告二,《Android 移动应用开发》实验报告-范本2（33页）-原创力文档...
实验1<Android活动的使用> 实验学时: 2 每组人数: 1 实验类型: 1 (1:基础性 2:综合性 3:设计性 4:研究性) 实验要求: 1 (1:必修 2:选修 3:其它) 实 ...
Android开发笔记（二十五）assets目录下的文件读取
AssetManager工具类 assets目录用于存放应用程序的资产文件,该目录下的文件不会被系统编译,所以无法通过R.*.*这种方式来访问.Android专门为assets目录提供了一个工具类As ...
Android开发笔记（二十三）文件对话框FileDialog
日期和时间对话框对话框是人机交互的有力工具,Android自带了几个常用的对话框,包括AlertDialog提示对话框.ProgressDialog进度对话框.DatePickerDialog日期选 ...
Android开发笔记（二十一）横幅轮播页Banner
ViewPager ViewPager的概念在前面的博文< Android开发笔记(十九)底部标签栏TabBar>中,我们提到可以在一个主页面里通过选项卡方式,切换到不同的子页面.那么在 ...
Android开发笔记（二十）顶部导航栏ActionBar
标题栏ActionBar ActionBar是在Android3.0之后引入的,所以Android2.x之前的版本不能直接使用ActionBar.现在ActionBar广泛用做APP的顶部导航栏,它在 ...
android开发那些事儿（一）
一.android中jdk的新特性与android target版本 android开发时用到switch语法,switch判断string类型,这个特性jdk1.7以上才有(我当时装的是1.8),竟 ...

android开发那些事儿（二）--Drawable资源

AnimationDrawable

android开发那些事儿（二）--Drawable资源相关推荐

最新文章

热门文章