android使用SVG

为什么要使用SVG.

SVG可以减小app体积。

SVG具有体积小、加载速度快、放大缩小无拉伸的特点。

Android中加载图片主要有两个阶段：获取本地资源时间+图片渲染时间。

经过试验：

png或jpeg的获取本地资源时间2923us, 渲染时间49um 总和2972us

svg获取本地资源时间247us ，627us 总和874us。

加载效率是png和jpeg的3倍。

SVG是一种采用XML来描述二维图形的语言，所以它可以直接打开xml文件来修改和编辑

SVG着重将图片的着色和绘制路径记录在SVG文件中，调用时重新渲染。

SVG介绍：

     1）SVG，即Scalable Vector Graphics 可伸缩矢量图形，这种图像格式在前端中已经使用的非常广泛了。
           SVG的W3C的解释： http://www.w3school.com.cn/svg/svg_intro.asp
           首先要解释下什么是矢量图像，什么是位图图像？
           1、矢量图像：SVG是W3C 推出的一种开放标准的文本式矢量图形描述语言,他是基于XML的、专门为网络而设计的图像格式，
               SVG是一种采用XML来描述二维图形的语言，所以它可以直接打开xml文件来修改和编辑。
           2、位图图像：位图图像的存储单位是图像上每一点的像素值，因而文件会比较大，像GIF、JPEG、PNG等都是位图图像格式。
     2）Vector，在Android中指的是Vector Drawable，也就是Android中的矢量图，
               可以说Vector就是Android中的SVG实现(并不是支持全部的SVG语法,现已支持的完全足够用了)

准备工作：

一、SVG文件图像转化

（1）、SVG转化成android的Vector工具：

http://inloop.github.io/svg2android/

（2）、将SVG转换成图像并编辑

http://editor.method.ac/

     （3）.使用AndroidStudio插件完成SVG添加（Vector Asset Studio）
                   详细：http://www.jianshu.com/p/d6c39f2dd5e7
                   AS会自动生成兼容性图片(高版本会生成xxx.xml的SVG图片；低版本会自动生成xxx.png图片)

     （4）.有些网站可以找到SVG资源
                   SVG下载地址： http://www.shejidaren.com/8000-flat-icons.html
                                  http://www.flaticon.com/

                                  http://www.iconfont.cn/plus --- 阿里巴巴

                   图片转成SVG https://vectormagic.com/

兼容问题，5.0以上的可以直接用：

一、兼容5.0以下的版本

   1、使用Android Studio 2.2以上的版本，gradle版本在2.0以上，准备步骤

   1.1、添加
·   defaultConfig {
       vectorDrawables.useSupportLibrary = true

   }
   1.2、添加
   compile 'com.android.support:appcompat-v7:25.3.1' //需要是23.2 版本以上的

   1.3、Activity需要继承与AppCompatActivity

   1.4、布局文件当中添加
       xmlns:app="http://schemas.android.com/apk/res-auto"

   2、使用在Actvity前面添加一个flag设置

       static {
           AppCompatDelegate.setCompatVectorFromResourcesEnabled(true);
       }

   2.1 ImageView/ImageButton
       XML app:srcCompat
       代码里面使用无区别

   2.2 Button 不支持app:srcCompat
       Xml 使用在Button的selector

   2.3 RadioButton 直接使用

   2.4 textview的drawable 直接使用



   2.5 使用的动态Vector Drawable
       主要是不能直接修改 pathData
       不能使用自定义interpolator

android代码：

ic_check.xml:

check_anim.xml:

<?xml version="1.0" encoding="utf-8"?>

check_animator.xml:

<?xml version="1.0" encoding="utf-8"?>

main_activity.xml

<?xml version="1.0" encoding="utf-8"?>

MainActivity.java:

public class MainActivity extends AppCompatActivity {    static {        AppCompatDelegate.setCompatVectorFromResourcesEnabled(true);    }    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);    }    public  void anim(View view){        ImageView imageView = (ImageView) view;        Drawable drawable = imageView.getDrawable();        ((Animatable)drawable).start();    }}

实现效果：

android使用SVG_第1张图片

android使用SVG

更多相关文章

随机推荐