安卓android中小图标使用优化(svg矢量图与iconfiy)

在开发安卓中会遇到各类各样的小图片(icon),裁剪繁琐,拉伸容易失真,png图片积累到必定量的时候,使包的体积变大,svg图与iconfiy这个第三方库能够解决以上的问题,但只试用于icon,背景图片等还须要本身进行优化;java

  • android如何使用svg图,
    下面的文章说的比较详细:Android使用矢量图

    svg是xml文件通常是kb级别,占用内存小;
    svg矢量图只能在api>21,android5.0之后进行使用,往前也能兼容,不过api<15就不能兼容了,textview的使用矢量图须要本身填坑;虽然如此,根据奥卡姆剃刀原理,安卓原生api中提供了大量的矢量图可使用,若是对风格要求不严,直接能够在img标签下引用原生的drawable矢量图.国内外的icon网站基本都有svg图下载,代码转换一下就能够直接使用了.android

    根据我的使用svg经验,通常从资源网站下载的很小不超过kb级的小图片,ps一下直接能用的,就不必使用svg跟iconfiy了,svg须要各类适配各类转换各类坑,并且文件大小不必定比png小,iconfiy虽然体积小,但毕竟多引入了一个包,一个包的大小至少200k以上。git

  • iconfiy的使用思路是用自定义的textview代替imgview,因此体积会更小:

    具体使用方法见:github官网说明github

dependencies {api

compile 'com.joanzapata.iconify:android-iconify-fontawesome:2.2.2' // (v4.5)
//以上的资源足够用,下面的不一样的库基本能够不用,有特殊须要再依赖也行,具体的图片资源的搜索,在下文会
//专门列出
compile 'com.joanzapata.iconify:android-iconify-entypo:2.2.2' // (v3,2015)
compile 'com.joanzapata.iconify:android-iconify-typicons:2.2.2' // (v2.0.7)
compile 'com.joanzapata.iconify:android-iconify-material:2.2.2' // (v2.0.0)
compile 'com.joanzapata.iconify:android-iconify-material-community:2.2.2' // (v1.4.57)
compile 'com.joanzapata.iconify:android-iconify-meteocons:2.2.2' // (latest)
compile 'com.joanzapata.iconify:android-iconify-weathericons:2.2.2' // (v2.0)
compile 'com.joanzapata.iconify:android-iconify-simplelineicons:2.2.2' // (v1.0.0)
compile 'com.joanzapata.iconify:android-iconify-ionicons:2.2.2' // (v2.0.1)

}less

@Override
public void onCreate() {
    super.onCreate();
    Iconify
        .with(new FontAwesomeModule())//经常使用
        //如下的类似基本能够不用
        .with(new EntypoModule())
        .with(new TypiconsModule())
        .with(new MaterialModule())
        .with(new MaterialCommunityModule())
        .with(new MeteoconsModule())
        .with(new WeathericonsModule())//若是有天气需求就加上这个库
        .with(new SimpleLineIconsModule())
        .with(new IoniconsModule());
}

}ionic

  • iconfiy的优势是体积小,使用方便,缺点是你须要知道对应的图片资源标识符如 {fa-smile-o},图片很差搜索,资源标识符更很差找到.没有图片资源,不知道如何引用字体,如无米之炊.
    如下按照iconfiy的依赖,分别找到ttf的下载资源与图片的搜索地址,你们能够根据项目的需求、本身爱好分别加载不一样库;

iconify基本把国外的icon网站资源一网打尽.
iconify资源网址ide


iconify资源不是很全,能够到他依赖的icon资源网站进行图片搜索:
android-iconify-entypo
entypo ttf下载地址
entypo图片搜索地址
android-iconify-fontawesome
fontawesome图片搜索地址
fontawesome ttf下载地址
android-iconify-ionicons
ionicons ttf下载与图片搜索地址
android-iconify-material
material ttf资源下载地址
material图片搜索地址
android-iconify-material-community
material-community下载与搜索地址
android-iconify-meteocons
meteocons资源
android-iconify-sample
iconify-sample下载与搜索地址
android-iconify-simplelineicons
simplelineicons ttf下载
simplelineicons 图片搜索
android-iconify-typicons
typicons ttf下载与图片搜索地址
android-iconify-weathericons
weathericons ttf下载与图片搜索地址svg

iconfiy官网说明中的
Icon options(字体后样式变化),与Show an icon where you need a?Drawable(在代码中的应用)也是颇有用的,须要本身进行发挥;字体

  • 注意:在开发时,若是直接从源码粘贴字体标志须要把'_'替换成'-':如
    注意1
    特别注意:在低版本的iconfiy中weathericons有问题,由于做者没有在WeathericonsIcons.java这个类中

的key()中替换成'-':
@Overridepublic String key() {??? return name().replace('_', '_');}
图片描述
若是直接从资源网站找到则不需进行替换,直接黏贴通常可使用,可是会有搜索出来的图片没法使用的状况,
这时就须要自定义iconfiy了;

  • 自定义:支付宝支付等图标等国内特点的图片国外的资源通常没有,这时就须要本身阿里的图库中自定义字体了,比较不错的文章有(再也不进行赘述):
    阿里图库的自定义icon
    Fontello的自定义

  • IconToggleButton??也比较有意思,有兴趣能够试试:

    <com.joanzapata.iconify.widget.IconToggleButton
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:textOff="{fa-smile-o 20sp spin}"
           android:textOn="{icon-indemnity}"/>
           
         
         
         
         public class MainActivity extends AppCompatActivity {
            @Override
           protected void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           setContentView(R.layout.activity_main);
           final IconToggleButton tb  = findViewById(R.id.toggleBt);
           findViewById(R.id.toggleBt).setOnClickListener(new View.OnClickListener() {
               @Override
               public void onClick(View view) {
                   if (tb.isChecked()){
                       //逻辑1
                   }else {
                       //逻辑2
                   }
               }
           });
       }

}

相关文章
相关标签/搜索