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

简介: androd 自定义矢量图,和使用矢量图

自定义矢量图


首先 添加依赖:


//字体图标
//因为这个库的版本 和当前 项目的版本不兼容,所以加入
//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


0a2653c851af460fa595bd959398a8f1.png


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


2d65d23f6d4748949b924e4057485923.png


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


4cebaac233b3433da32a72337a77fc60.png


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


6de278e6d6694ce5bb08e7e842b7e74b.png


网页文件打开如下图


8ec4f2997fb246878c34ecd6d122b7c6.png


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


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());
    }
}


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


还有就是设置清单文件


0a2653c851af460fa595bd959398a8f1.png


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


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


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 ,进行初始化,和上面的一样。


可以点进去看一下:


2d65d23f6d4748949b924e4057485923.png


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


如下所示:


4cebaac233b3433da32a72337a77fc60.png


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



相关文章
Photoshop绘制立体风格的拾色器图标
Photoshop绘制立体风格的拾色器图标
52 0
|
数据安全/隐私保护
Opengl ES之水印贴图
Opengl ES之连载系列
147 0
|
XML 前端开发 JavaScript
推荐一个C#操作SVG图形矢量图的开源项目
一个支持.Net Framework 与 .Net Core版本的SVG图形操作库。这个项目集成了SVG各项API,让开发人员可以在.Net很轻松的实现SVG图形的操作,通过SVG文件转换为图片文件。
436 0
推荐一个C#操作SVG图形矢量图的开源项目
|
并行计算 iOS开发 MacOS
Metal每日分享,颜色转换滤镜效果
Metal每日分享,颜色转换滤镜效果
Metal每日分享,颜色转换滤镜效果
|
并行计算 iOS开发 MacOS
Metal每日分享,纯色图片滤镜效果
Metal每日分享,纯色图片滤镜效果
Metal每日分享,纯色图片滤镜效果
|
XML 图形学 数据格式
SVG 可缩放矢量图形
SVG 可缩放矢量图形
102 0
|
JavaScript
酷炫的SVG 动态图标
原文:酷炫的SVG 动态图标                                                                      在  loading.io 上能看到好多效果惊艳的loading图标。
2236 0
|
C#
C# 绘制PDF图形——基本图形、自定义图形、色彩透明度
引言 在PDF中我们可以通过C#程序代码来添加非常丰富的元素来呈现我们想要表达的内容,如绘制表格、文字,添加图形、图像等等。在本篇文章中,我将介绍如何在PDF中绘制图形,并设置图形属性的操作。   文章中将分以下要点进行介绍: 1. 绘制基本图形(线条、椭圆、圆形、矩形、三角形) 2. 绘制自定义图形 3. 绘制图形并设置图形透明度   所需工具:Spire.PDF for .NET 4.0 提示:安装后,直接引用安装路径下Bin文件夹中的dll文件到项目程序中即可。
1425 0