Android开发中iconify的使用

一、iconify简介

• iconify的github地址：https://github.com/JoanZapata/android-iconify

• 项目地址：http://joanzapata.com/android-iconify

• 教程地址：http://blog.joanzapata.com/iconify-just-got-a-lot-better/

• demo地址：https://play.google.com/store/apps/details?id=com.joanzapata.android.icons.sample

         或者：https://github.com/JoanZapata/android-iconify/tree/master/android-iconify-sample

• iconify是一个矢量图标库，包含使用 Dave Gandy 制作的超过370中矢量字体图标，可以使Android应用开发者免于制作五种适用于不同屏幕大小尺寸的图片，从而提高开发者工作效率。

• 优点：由于这些图标均是矢量字体图标，所以不仅可以无限放大而不会失真，模糊，而且可以将适用于text的属性应用于这些矢量图标上，从而实现改变图标颜色、添加阴影等效果

• 缺点：目前在xml文件中使用图标库中的资源时，需要自己对照作者给出的sample查阅不同图标所对应的标记，自己手敲标记，这样不仅麻烦，而且容易出错

• 适用场景：

1. iconify原作者提供了三种他自定义的控件：IconTextView、IconButton、IconToggleButton，可以直接使用这三类控件来显示iconify中提供的字体图标；

2.  在java代码中通过使用一个IconDrawable为具有setIcon（Drawable drawable）方法的控件设置该字体图标

二、使用步骤（我使用的编译器是Android Studio）

1. 在需要使用iconify的app的build.gradle的dependencies中添加依赖（下面添加了整个库，在实际开发过程中，可以只添加自己需要的某一个或几个库即可）：
   

dependencies {
    compile 'com.joanzapata.iconify:android-iconify-fontawesome:2.2.1' // (v4.5)
    compile 'com.joanzapata.iconify:android-iconify-entypo:2.2.1' // (v3,2015)
    compile 'com.joanzapata.iconify:android-iconify-typicons:2.2.1' // (v2.0.7)
    compile 'com.joanzapata.iconify:android-iconify-material:2.2.1' // (v2.0.0)
    compile 'com.joanzapata.iconify:android-iconify-material-community:2.2.1' // (v1.4.57)
    compile 'com.joanzapata.iconify:android-iconify-meteocons:2.2.1' // (latest)
    compile 'com.joanzapata.iconify:android-iconify-weathericons:2.2.1' // (v2.0)
    compile 'com.joanzapata.iconify:android-iconify-simplelineicons:2.2.1' // (v1.0.0)
    compile 'com.joanzapata.iconify:android-iconify-ionicons:2.2.1' // (v2.0.1)}

2.  自定义一个继承自Application类的类：

import android.app.Application;
import com.joanzapata.iconify.Iconify;
import com.joanzapata.iconify.fonts.EntypoModule;
import com.joanzapata.iconify.fonts.FontAwesomeModule;
import com.joanzapata.iconify.fonts.IoniconsModule;
import com.joanzapata.iconify.fonts.MaterialCommunityModule;
import com.joanzapata.iconify.fonts.MaterialModule;
import com.joanzapata.iconify.fonts.MeteoconsModule;
import com.joanzapata.iconify.fonts.SimpleLineIconsModule;
import com.joanzapata.iconify.fonts.TypiconsModule;
import com.joanzapata.iconify.fonts.WeathericonsModule;
public class MyApplication extends Application {
    @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());
    }
}

3.  在manifest文件中的application中声明使用自定义的MyApplication：

<application
    android:name="com.application.MyApplication"
    android:icon="@mipmap/ic_launcher"
    android:label="@string/app_name">

4.  经过以上几步就可以在应用中使用iconify图标了，如在布局文件中的使用：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.activity.NewTaskActivity"
    android:gravity="center_horizontal">
    <com.joanzapata.iconify.widget.IconTextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/iconify_tv"
        android:text="{fa-heart @color/color_iconify_heart_pink 48sp}   {fa-star #FFFF00 44sp}   {fa-gift #FF00FF 48sp}"
        android:layout_marginTop="@dimen/activity_vertical_margin"
        android:layout_margin="@dimen/activity_horizontal_margin"
        android:gravity="center" />
    <com.joanzapata.iconify.widget.IconButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/iconify_btn"
        android:layout_below="@+id/iconify_tv"
        android:layout_marginLeft="30dp"
        android:text="{entypo-facebook #008B00 35sp}"/>
    <com.joanzapata.iconify.widget.IconToggleButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/iconify_toggle"
        android:layout_below="@+id/iconify_btn"
        android:layout_marginLeft="30dp"
        android:textOff="{fa-lock}"
        android:textOn="{fa-unlock}"
        android:textSize="35sp"
        android:textColor="#677EFF"/>
</RelativeLayout>

5.  效果图如下：

6.  在代码中使用：

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.menu_main, menu);
   /* 设置menu的图标为iconify中的图标*/
    menu.findItem(R.id.action_settings).setIcon(
            new IconDrawable(this, FontAwesomeIcons.fa_user)
                    .colorRes(R.color.color_iconify_music_quartz)
                    .actionBarSize());
    return true;
}

7. 效果图如下：



8. 问题：在使用ImageView.setImageIcon(Drawable drawable)时，图标总是没有显示出来，不知道什么原因，还需要后面再看看