相信大家在开发过程中经常需要绘制一些比较简单的图形,例如:分割线、按钮、圆形...等。但是笔者在开发初期总是遇到各种问题,以至于一个简单的效果都实现不了。网上也没有比较全面系统的介绍文章。今天就把自己整理出来的一些东西分享出来,希望可以帮助到一下开发新手,因为毕竟我现在也还算是一个新手嘛。(PS:大神勿喷)
简介:
Drawable 是 android.graphics.drawable 包下的一个类。
直接已知子类有:
BitmapDrawable,ClipDrawable,ColorDrawable,DrawableContainer,GradientDrawable,InsetDrawable,LayerDrawable,NinePatchDrawable,PictureDrawable,RotateDrawable, ScaleDrawable, ShapeDrawable
顾名思义,Drawable这个类就是主要用来实现图形的绘制的。
Shape 的用法总结:
shape是比较基础的形状绘制工具,一般用shape定义的xml文件存放在drawable目录下,若项目没有该目录则新建一个,而不要将它放到drawable-hdpi等目录中。
使用shape可以自定义形状,支持下面四种类型的形状,通过android:shape 属性指定:
rectangle : 矩形,常用于绘制矩形、圆角矩形、按钮背景等。
oval : 椭圆形,用得比较多的是画正圆吧,笔者没怎么用过。
line : 线形,可以画实线和虚线。
ring : 环形,可以画环形进度条。
solid : 设置形状填充的颜色,只有android:color一个属性android:color 填充的颜色
padding : 设置内容与形状边界的内间距,可分别设置左右上下的距离
android:left 左内间距
android:right 右内间距
android:top 上内间距
android:bottom 下内间距
gradient : 设置形状的渐变颜色,可以是线性渐变、辐射渐变、扫描性渐变
android:type 渐变的类型
linear 线性渐变,默认的渐变类型
radial 放射渐变,设置该项时,android:gradientRadius也必须设置
sweep 扫描性渐变
android:startColor 渐变开始的颜色
android:endColor 渐变结束的颜色
android:centerColor 渐变中间的颜色
android:angle 渐变的角度,线性渐变时才有效,必须是45的倍数,0表示从左到右,90表示从下到上
android:centerX 渐变中心的相对X坐标,放射渐变时才有效,在0.0到1.0之间,默认为0.5,表示在正中间
android:centerY 渐变中心的相对X坐标,放射渐变时才有效,在0.0到1.0之间,默认为0.5,表示在正中间
android:gradientRadius 渐变的半径,只有渐变类型为radial时才使用
android:useLevel 如果为true,则可在LevelListDrawable中使用
corners : 设置圆角,只适用于rectangle类型,可分别设置四个角不同半径的圆角,当设置的圆角半径很大时,就可变成弧形边了
android:radius 圆角半径,会被下面每个特定的圆角属性重写
android:topLeftRadius 左上角的半径
android:topRightRadius 右上角的半径
android:bottomLeftRadius 左下角的半径
android:bottomRightRadius 右下角的半径
stroke : 设置描边,可描成实线或虚线。
android:color 描边的颜色
android:width 描边的宽度
android:dashWidth 设置虚线时的横线长度
android:dashGap 设置虚线时的横线之间的距离
一、line 绘制直线
1、绘制一条实线
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="line">
<stroke
android:width="1dp"
android:color="@android:color/holo_blue_light"/>
</shape>
一般
只需要通过stroke来绘制, width 表示实线的宽度,color 即实线的颜色。
2、绘制一条虚线
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="line">
<stroke
android:width="1dp"
android:color="@color/colorPrimaryDark"
android:dashGap="3dp"
android:dashWidth="6dp"/>
</shape>
同样只需要借助stroke即可。这里的dashWidth 表示短实线的长度,dashGap 表示实线之间的间隙宽度。
注意:
在绘制虚线时,经常会出现运行在手机或虚拟机上依旧显示为实线,经笔者研究是因为硬件加速导致的,需要手动设置关闭硬件加速就可以显示出虚线效果了。常见关闭硬件加速的效果有以下几种:
(1)、在 xml 文件中设置 android:layerType="software"
(2)、通过 findViewById() 找到对应的控件来设置
(3)、可以对单个的Activity控制是否启用硬件加速:
(4)、在Applciation级别控制硬件加速的开关:
提示:硬件加速的问题可以查阅:http://blog.chenming.info/blog/2012/09/18/android-hardware-accel/
3、绘制竖虚线
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="90">
<shape
android:shape="line">
<stroke
android:width="1dp"
android:color="@color/colorPrimaryDark"
android:dashGap="6dp"
android:dashWidth="6dp"/>
</shape>
</rotate>
绘制出来的直线默认是横线,如果想要绘制竖线,需要在 xml 文件的 shape 标签外边加上 rotate 标签通过 fromDegree 属性来制定旋转的角度,从而达到绘制竖线的目的。笔者在绘制竖虚线的过程中发现虽然旋转后可以绘制出竖线,但是在引用布局中的宽高设置有些问题,倒是竖线不能显示足够的长度,只能显示一小截。需要根据需要将引用的宽高设置到一定值,再通过 margin 设置赋值来抵消对周围控件位置的影响。总是较为复杂,建议还是让美工提供切图比较合理一些。