SVG图片格式学习

1.SVG 指可伸缩矢量图形 (Scalable Vector Graphics)
2.SVG 用来定义用于网络的基于矢量的图形
3.SVG 使用 XML 格式定义图形
4.SVG 图像在放大或改变尺寸的情况下其图形质量不会有所损失
5.SVG 是万维网联盟的标准
6.SVG 与诸如 DOM 和 XSL 之类的 W3C 标准是一个整体

SVG形状

SVG 有一些预定义的形状元素,可被开发者使用和操作:

  • 矩形 <rect>
  • 圆形 <circle>
  • 椭圆 <ellipse>
  • 线 <line>
  • 折线 <polyline>
  • 多边形 <polygon>
  • 路径 <path>

SVG Path介绍

  • M = moveto 相当于 android Path 里的moveTo(),用于移动起始点
  • L = lineto 相当于 android Path 里的lineTo(),用于画线
  • H = horizontal lineto 用于画水平线
  • V = vertical lineto 用于画竖直线
  • C = curveto 相当于cubicTo(),三次贝塞尔曲线
  • S = smooth curveto 同样三次贝塞尔曲线,更平滑
  • Q = quadratic Belzier curve quadTo(),二次贝塞尔曲线
  • T = smooth quadratic Belzier curveto 同样二次贝塞尔曲线,更平滑
  • A = elliptical Arc 相当于arcTo(),用于画弧
  • Z = closepath 相当于closeTo(),关闭path

SVG编辑器

常用的在线编辑器: http://editor.method.ac/
Inkscape也是好用的工具:https://inkscape.org/zh/

Android兼容问题

在Android 5.0之后默认支持,但是之前的版本要适配兼容,兼容5.0之前请看:https://www.jianshu.com/p/1bb7707d0291

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,834评论 25 709
  • SVG 意为可缩放矢量图形(Scalable Vector Graphics)。SVG 使用 XML 格式定义图像...
    MinicupSimon阅读 15,838评论 0 20
  • 先看一个动画效果,这种小飞机沿路径飞行(路径部分线段变成绿色是录屏软件出了问题)。 这种动画效果最常见于发送信息后...
    泱泱悲秋阅读 4,160评论 3 11
  • 引导:微信引入的SVG技术。 http://mp.weixin.qq.com/s?__biz=MzAwNDY1OD...
    lichao3140阅读 683评论 0 0
  • 2017年10月11日身修家和 美丽中国李琼 种子践行日记 第 50天 🔥服务众生:分享 我订阅的心理学文章...
    江南木子阅读 382评论 0 0