androd ionicons 自定义矢量图,和使用矢量图

自定义矢量图

首先 添加依赖:

//字体图标
//因为这个库的版本 和当前 项目的版本不兼容,所以加入
//exclude group:表示只要包含com.android.support的都排除
api ('com.joanzapata.iconify:android-iconify-ionicons:2.2.2'){
    exclude group:'com.android.support'
}
api ('com.joanzapata.iconify:android-iconify-fontawesome:2.2.2'){
    exclude group:'com.android.support'
}

1,在 网上 下载 .ttf 文件,然后新建一个assets 文件夹,将 .ttf 文件放进去。

网址为 :

https://www.iconfont.cn/

http://code.zoomla.cn/boot/font.html

androd ionicons 自定义矢量图,和使用矢量图

然后选择添加到购物车,然后打开购物车,在右上角,

androd ionicons 自定义矢量图,和使用矢量图

点击下载代码,完成后解压

androd ionicons 自定义矢量图,和使用矢量图

将第一个打开,第二个.ttf文件进行保存,如下图

androd ionicons 自定义矢量图,和使用矢量图

网页文件打开如下图
androd ionicons 自定义矢量图,和使用矢量图

记住这个号,下面将会使用

2,创建枚举类,继承自 Icon,实现方法,

public enum EcIcons implements Icon {

    //这个号 就是网页里对应的东西,前面的icon_scan 可以随便起,但是注意必须加 _
    icon_scan('\ue694'),


    private char character;
    EcIcons(char character) {
        this.character = character;
    }

    //图标的键,例如'fa-ok'
    @Override
    public String key() {
        return name().replace('_', '-');
    }

    //与字体中的键匹配的字符
    @Override
    public char character() {
        return character;
    }
}

构造器要传入的值 在下载的文件中 有个.xml 的文件,打开后 找对应的就行

3,创建类 继承自 IconFontDescriptor ,然后加载文件,和 刚才定义的枚举对象。

public class FontEcModule implements IconFontDescriptor {
    @Override
    public String ttfFileName() {
        return "iconfont.ttf";
    }

    @Override
    public Icon[] characters() {
        return EcIcons.values();
    }
}

4,定义一个类,继承自Application ,然后对字体进行初始化,注意一定要在清单文件中 设置name 的属性 等于 继承自 Application的类。

public class ExampleApp extends Application {
    @Override
    public void onCreate() {
        super.onCreate();

     /*   Latte.init(this)
                .WithApiHost("127.0.0.1")
                .withIcon(new FontAwesomeModule())
                .withIcon(new FontEcModule())
                .configure();*/

        Iconify.IconifyInitializer initializer = Iconify.with(new  FontEcModule());
    }
}

上面注释的 地方是我分装的,没有注释的则是 正常使用的。

还有就是设置清单文件

androd ionicons 自定义矢量图,和使用矢量图

上面在 application中进行了初始化,然后进行使用就好了。

5,使用如下,布局中使用IconTextView ,text属性对应的值就是 EcIons 枚举类中对应的值,注意中间的下划线必须改为 -,也就是减号。

<com.joanzapata.iconify.widget.IconTextView
    android:id="@+id/icon_test"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="{fa-coffee}"
    tools:ignore="HardcodedText" />

直接使用自带的,不需要自定义这个麻烦,如下所示

Iconify.IconifyInitializer initializer = Iconify.with(new FontAwesomeModule());

在上面进行初始化,创建一个类继承自application ,进行初始化,和上面的一样。

可以点进去看一下:
androd ionicons 自定义矢量图,和使用矢量图

这个已经是别人写好的,直接用就可以了,点击第二个方法里面 返回的类,就是对应的矢量图,复制前面的字段,使用的使用将下划线改为中划线就ok,

如下所示:

androd ionicons 自定义矢量图,和使用矢量图

这些都可以在上面第二个网址里面找到。