Android5.0+高级动画开发-[初识矢量图SVG与VectorDrawable]

android中利用矢量图VectorDrawable打造酷炫动画 1. 初识矢量图SVG与VectorDrawable 位图:有一个一个像素点组成的,放大会失真 矢量图:实际是一条path路径,每一个像素点是根据GPU实时计算出来,放大缩小不会失真 SVG和Vector的区别: SVG,即Scalable Vector Graphics 矢量图,这种图像格式在前端中已经使用的非常广泛了,详见WIKI:https://en.wikipedia. 阅读详情

      《Android5.0+高级动画开发》讲的是如何借助VectorDrawable技术,贝赛尔曲线技术,PathMeasure技术实现酷炫动画。相比之前学习过的帧动画,补间动画,属性动画,它们有哪些值得我们学习的地方呢?Android为什么在5.0以后推出了VectorDrawable技术?徐大神为什么要推荐和分享这些技术?废话到此结束,接下来记录下学习[初识矢量图SVG与VectorDrawable]这一小节的重点知识点。

知识点1:

网络上使用的图片一般有两种类型,一种是栅格图(.jpeg .gif .png),一种是矢量图(SVG),其是栅格图放大会失真,矢量图放大不会失真,如下图:



知识点2:

SVG -全称Scalable Vector Graphics,是一种W3C推荐的用来描述两维矢量图形的语言。目的是提供一种灵活而实用的图形格式,并在 XML 中表示出来。SVG 的特性集包括嵌套式转换、剪辑路径、羽化遮罩、光栅过滤器效果、模板对象,可扩展性等,支持动画、缩放视图、各种图形原语、分组、超链接、结构化元数据、CSS、DOM 扩展集,并可以轻易地嵌入到其他 XML 文档中。一般用于Web端。



rect标签:代表画一个矩形,circle标签:代表画一个图形,polyline标签:代表画一条折线,line标签:代表画一条直线

知识点3:

VectorDrawable是Android中的矢量图,只抽取了SVG中的Path标签来画所有图形,提高了矢量图在Android系统中的加载与解析效率。VectorDrawable常用语法:

  M=moveto(M X,Y):将画笔移动到指定坐标位置

  L = lineto(L X,Y):画直线到指定的坐标位置

 Z=closepath():关闭路径

 H=horizontal lineto(H X) :画水平线到指定的X 坐标位置

 V=vertical lineto(V Y):画垂直线到指定的Y坐标位置

知识点4:

矢量图SVG在线制作工具-SVG Editor(http://editor.method.ac)




SVG转VectorDrawable 在线工具(https://inloop.github.io/svg2android/)


AndroidStudio中也提供了转化工具,而且SVG之所以可以转化为VectorDrawable是因为SVG语法比较固定,所有SVG图形归根到底都是Path,而 VectorDrawable正是提取了SVG中的Path。




Android动画总结系列(6)——矢量图形与矢量动画 本文总结了矢量图形和矢量动画的使用方法。 阅读详情

相关推荐

Android矢量图形开发:SVG与VectorDrawable实战指南

矢量图形技术通过数学公式定义图形,具有无限缩放不失真的特性,在移动开发领域能有效解决多屏幕密度适配问题。Android平台通过VectorDrawable体系实现矢量图形支持,其核心原理是将SVG标准路径数据转换为XML定义的绘制指令。这种技术显著减小APK体积,提升开发效率,特别适合图标、简单插画等场景。实际开发中需注意SVG到VectorDrawable的转换规则,利用Android Studio的Vector Asset Studio工具可快速实现资源导入。对于性能敏感场景,建议控制矢量图复杂度,在列

anjichan4261的博客 424

(十六)SVG

版权声明:本文为博主原创文章,未经博主允许不得转载。 本文纯个人学习笔记,由于水平有限,难免有所出错,有发现的可以交流一下。 一、概述1.SVGSVG,全称为 Scalable Vector Graphics 可伸缩矢量图形。 附:w3school 的链接 http://www.w3school.com.cn/svg/svg_intro.asp什么是 SVG SVG 指可伸缩矢量图形

孤独灬啸月 1375

Android开发之将Android SVG 转 VectorDrawable矢量图的方法

Android SVG to VectorDrawable介绍两种方法如下 方法一 使用在线的三方网站即可我推荐两个: http://inloop.github.io/svg2android/ http://svg.zhangningning.com.cn/ 1.先下载svg:blob:https://www.figma.com/2f2f8ea9-f5bf-4339-ba9c-0e262a3dd0e3 2.将下载的svg图片拖进去会自动转换 3.这样就将svg图片转成VectorDra..

xiayiye5的博客 5185

图片压缩知识梳理(6) VectorDrawable 及 AnimatedVectorDrawable 使用详解

一、Vector优点 VectorDrawable主要有两个优点:屏幕自适应和体积小。 如果我们使用的是普通的png或者jpg图片,那么为了能让图片在不同分辨率的机型上能够很好地展现,通常会在各个drawable文件夹下放置不同分辨率大小的图片文件,而VectorDrawable则不需要,仅仅只使用一套资源,就能够适应任何分辨率的手机。 对于某些图片,VectorDrawable素材的大小要比p...

weixin_34111790的博客 380

【Android】将SVG转换成VectorDrawable XML资源

本文章主要讲述如何将SVG格式转换为安卓的Vector 的XML格式的图标.

CS@zeny的博客 2270

Android中使用SVG

简介 可缩放矢量图形(英语:Scalable Vector Graphics,SVG)是一种基于可扩展标记语言(XML),用于描述二维矢量图形的图形格式。SVG由W3C制定,是一个开放标准。——摘自维基百科 它和位图(Bitmap)相对,SVG不会像位图一样因为缩放而让图片质量下降。图像与分辨率无关,收放自如,适配安卓机坑爹的分辨率真是一劳永逸。它的优点在于节约空间,使用方便 Android也...

Errol's Blog 6831

Android 5.0+高级动画开发 矢量图动画 轨迹动画 路径变换

第1章 课程介绍为了成就更多高逼格的人才,我专门整理了Android5.0以后主推的实现酷炫动画的新技术,教你掌握实现动画的高逼格技巧。课程中我会详细讲解每个动画效果实现的原理和所用的技术,并带你一步一步的实现每个动画效果,让你在学完本次课程后,能够举一反三,再也不必担心设计MM的设计你没法实现了,也再也不用担心,老板的脑洞无...第2章 矢量图VectorDrawable...

weixin_34244102的博客 299

SVG在Android上的使用

阿里巴巴图片库:https://www.iconfont.cn/collections/detail?cid=9638 一:什么是SVG SVG是指可伸缩矢量图形 (Scalable Vector Graphics),它不同于传统的位图(像GIF、JPEG、PNG等都是位图图像格式),不是通过存储图像中每一点的像素值来保存与使用图形,而是通过 XML 文件来定义一个图形,通过一些特定的语法和规则来绘制出我们所需的图像——同样是使用一张图片,SVG 的方式是事先定义好怎么去画这个图,然后等要用的时候再把它

u012693479的博客 8524

Android 5.0+ 高级动画开发系列 矢量图动画

转载请注明出处:http://blog.csdn.net/smartbetter/article/details/54708200 春节假期刚到,就赶紧抽出点时间写点技术文章,这篇文章已经酝酿了很长时间了。我们经常可以看见很多拥有酷炫动画的App,并且给人感觉具有高逼格的气息,自从Google更新Android 5.0以来,Android世界变的异常丰富多彩,本篇主要讲解 Android

BillyLu的博客 1993

干货 _ Android高级动画

干货 _ Android高级动画,详细解析android动画原理和实现

Android中使用SVG实现炫酷动画效果

Android中使用SVG实现炫酷动画效果Android中使用SVG实现炫酷动画效果

Android VectorDrawable与SVG 实现炫酷动画

Android VectorDrawable与SVG 实现炫酷动画 转载请标明出处: dsad 本文出自:【Alex_MaHao的博客】 项目中的源码已经共享到github,有需要者请移步【Alex_MaHao的github】 Android 从 5.0 提供了新的API VectorDrawable,通过该对象,我们可以使用矢量图SVG。在编写xml文件中,通过关键的几个标签

茅屋 1万+

Android动画机制全解析source

Android动画机制全解析source

Android VectorDrawable与SVG

VectorDrawableAndroid L开始提供了新的API VectorDrawable 可以使用SVG类型的资源,也就是矢量图,这里对VectorDrawable和SVG做一些简要的介绍。

xu_fu的专栏 4万+

Android SVG动画PathView源码解析与使用教程(API 14)

博客地址 http://blog.csdn.net/sbsujjbcy/article/details/47417661

【Android】Android开发之常用的loading等待效果实现,仿微博等待动画。两种实现方式详解

博文介绍:http://blog.csdn.net/qq_21376985/article/details/52847317 【Android】Android开发之常用的loading等待效果实现,仿微博等待动画。两种实现方式详解

Andrid5.0新特性——SVG(可缩放矢量图)

什么是SVG(Scalable Vector Graphics) SVG一种用于描述图像的标记语言。类似HTML。 SVG严格遵从XML语法,并用文本格式的描述性语言来描述图像内容,因此是一种和图像分辨率无关的矢量图形格式。 标准制定开发历史 2001年9月4日,发布SVG 1.0。 2003年1月4日,发布SVG 1.1。 2003年1月14日,推出SVG移动子版本:SVG Tin

7614

Android矢量图Demo

SVG矢量图形在android项目中的使用,包括简单地动画。

上一篇: Android自定义控件系列案例【五】
张科勇
博客等级 码龄11年 46粉丝 26原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值