效果图,可以设置液体百分比
1,为什么要选择SVG?主要有这几方面的原因:
1,SVG 是可伸缩的矢量图形,在浏览器中改变尺寸,其图形质量不会有所损失。
2,相比其它位图,SVG图像文件更小,可压缩性更强。
3,SVG 可以被记事本等阅读器、搜索引擎访问。
4,SVG 图像中的文本是可选的,同时也是可复制的。
5,SVG 可以制作成整体或局部动画。
2.<Path>标签
简单介绍一下标签
M = moveto(M X,Y) :将画笔移动到指定的坐标位置
L = lineto(L X,Y) :画直线到指定的坐标位置
H = horizontal lineto(H X):画水平线到指定的X坐标位置
V = vertical lineto(V Y):画垂直线到指定的Y坐标位置
C = curveto(C X1,Y1,X2,Y2,ENDX,ENDY):三次贝赛曲线
S = smooth curveto(S X2,Y2,ENDX,ENDY):三次贝赛曲线
Q = quadratic Belzier curve(Q X,Y,ENDX,ENDY):二次贝赛曲线
T = smooth quadratic Belzier curveto(T ENDX,ENDY):映射前面路径后的终点
A = elliptical Arc(A RX,RY,XROTATION,FLAG1,FLAG2,X,Y):弧线
Z = closepath():关闭路径
有几点要注意:
坐标轴为以(0,0)为中心,X轴水平向右,Y轴水平向下。
所有指令大小写均可。大写绝对定位,参照全局坐标系;小写相对定位,参照父容器坐标系
指令和数据间的空格可以省略
同一指令出现多次可以只用一个
3.Android中使用SVG
draw文件点击new -> Vector Asset
Local SVG file: 可以选择本地的SVG文件
Material Icon: 可以选择自带的SVG
Resource name: 当然就是xml文件的名字
Size: 图片大小
Override defalut size from Material Design: 勾选后替代默认的大小
Opactity: 透明度
Enable atuo mirroring for RTL layout: 用于镜像显示
4,自定义view加载svg
5.0以上
var vectorDrawable: Drawable = context.getDrawable(R.drawable.terpretation_icon); vectorDrawable.setBounds(0, 0, icon_w, icon_h);
5.0以下 使用兼容包
1,引入新的兼容库 compile 'com.android.support:appcompat-v7:23.2.0'或者比这还新的
2,`build.gradle 中加入以下一行代码
defaultConfig {
vectorDrawables.useSupportLibrary = true
}
var dr:VectorDrawableCompat? = VectorDrawableCompat.create(resources,R.drawable.terpretation_icon,null);
dr?.setBounds(0,0,icon_w,icon_h)
5,项目地址