欢迎大家下载我个人开发的app安琪花园
首先列举一下android 自带的drawable有哪些
LevelListDrawable
TransitionDrawable
InsetDrawable
BitmapDrawable
ShapeDrawable
LayerDrawable
StateListDrawable
ScaleDrawable
ClipDrawable
单纯的通过上面的名字,你能知道每一种drawable的 使用场景吗?
对于我个人而言,这里面有很多drawable,之前我都不知道有这种drawable
更别说他的使用场景了。
我用得比较多的是ShapeDrawable, StateListDrawable, LayerDrawable, 其它的drawable我都没有怎么听说过。但是最近看了一本书里面解释到了这些drawable研究了一下,发现真的很实用。
对于每一种drawable的效果图请下载github上面的代码自己运行亲自试一下
github地址
接下来对每一种drawable进行分析
BitmapDrawable
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="@drawable/ic_launcher"
android:antialias="true"
android:dither="true"
android:tileMode="repeat"
>
</bitmap>
效果图
BitmapDrawable比较简单, 至于这里面的每一种属性大家可以自己 去一个一个的试。
android:src
这个很简单,就是图片的资源id。
android:antialias
是否开启图片抗锯齿功能。
android:dither
是否开启抖动效果。
android:gravity
可以配置图片的显示位置,如果控件的宽高大于图片的话,可以设置具体显示的位置
android:tileMode
平铺模式。这个选项有如下几个值:"disabled" "clamp" "repeat" "mirror"
具体每一个值是 什么意思大家可以改变每一个值 来试试 上面的示例用的是repeat
ShapeDrawable
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<stroke
android:width="3dp"
android:color="#ff0000"
android:dashWidth="2dp"
android:dashGap="3dp" />
<corners android:radius="5dp"/>
</shape>
效果图
ShapeDrawable可以说是平时开发的过程中用的比较多的,里面的属性大家应该也能掌握,就不一一的列出来了。
LayerDrawable
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/shape_drawable" />
<item
android:bottom="10dp"
android:drawable="@drawable/bitmap_drawable"
android:left="10dp"
android:right="10dp"
android:top="10dp" />
<item android:gravity="center">
<shape android:shape="oval">
<solid android:color="#ff0000"/>
<size android:width="30dp"
android:height="30dp"
/>
</shape>
</item>
</layer-list>
效果图
LayerDrawable可以说是android开发中用得比较多的,将BitmapDrawable, ShapeDrawable叠加生成layerDrawable其效果图就是上面这样的。
LayerDrawable对应的XML标签是<layer-list>,它表示一种层次化的Drawable集合,通过将不同的Drawable放置在不同的层上面从而达到一种叠加后的效果
LayerList里面可以包含多个item
StateListDrawable
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/bitmap_drawable" android:state_selected="true" />
<item android:drawable="@drawable/shape_drawable" />
</selector>
这个效果图 就不贴出来了,凡是做android的应该都能看得懂上面的这个代码,
大家只需要知道View的常见状态有:
- android:state_selected
- android:state_pressed
- android:state_focused
- android:state_checkable
- android:state_checked
- android:state_enable
LevelListDrawable
<?xml version="1.0" encoding="utf-8"?>
<level-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="@drawable/bitmap_drawable"
android:maxLevel="2"
android:minLevel="0" />
<item
android:drawable="@drawable/shape_drawable"
android:maxLevel="4"
android:minLevel="3" />
</level-list>
当我调用如下代码时:
val drawalbe = ContextCompat.getDrawable(this, R.drawable.level_drawalbe) as? LevelListDrawable
bg.background = drawalbe
drawalbe?.level = 3
效果图
这个时候控件的背景就变成了shape_drawable,
如果把drawable的level设置为小于3大于0的,背景就变成了bitmap_drawable。
默认的话level为0, 显示的是bitmap_drawable.
如果设置的level值 不在上面设置的整数范围内, 则设置背景是 没有效果的
TransitionDrawable
<?xml version="1.0" encoding="utf-8"?>
<transition xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/bmp_img" />
<item android:drawable="@drawable/ic_launcher" />
</transition>
在代码中的一个使用情况如下:
val drawable = ContextCompat.getDrawable(this, R.drawable.transition_drawable) as? TransitionDrawable
bg.background = drawable
drawable?.startTransition(4000)
TransitionDrawable对应于<transition>标签,它用于实现两个Drawable之间的淡入淡出效果.
只需要调用startTransition方法即可,如果还原的话 调用reverseTransition。
以前不知道有这个 drawable的时候 , 要实现这样的效果 还得去写动画 感觉还 挻麻烦的
InsetDrawable
InsetDrawable对应于<inset>标签,它可以将其他Drawable内嵌到自己当中,并可以在四周留出一定的间距。当一个View希望自己的背景比自己的实际区域小的时候,可以采用InsetDrawable来实现.
其实InsetDrawable能实现的效果, 用LayerDrawable也能实现。
如:
<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/bmp_img"
android:inset="15dp"/>
效果图
明显能看到背景图片是留了边距的,比实际的view要小。
ScaleDrawable, ClipDrawable
这两个drawable感觉用处不大。很少用到。好奇的朋友 可以自己去试试