Android iconify 使用详解
android-iconify 使用详解 ,下文图文并茂给大家介绍的非常详细,具体内容详情请参考下文。
1、android-iconify简介
- iconify的github地址:https://github.com/JoanZapata/android-iconify
- 项目地址:http://joanzapata.com/android-iconify
- iconify是一个矢量图标库,包含使用 Dave Gandy 制作的超过370中矢量字体图标,可以使Android应用开发者免于制作多种适用于不同屏幕大小尺寸的图片,从而提高开发者工作效率。
- 适用场景:
1、iconify原作者提供了三种他自定义的控件:IconTextView、IconButton、IconToggleButton,可以直接使用这三类控件来显示iconify中提供的字体图标;
2、在java代码中通过使用一个IconDrawable为具有setIcon(Drawable drawable)方法的控件设置该字体图标
- 优点:由于这些图标均是矢量字体图标,所以不仅可以无限放大而不会失真,模糊,而且可以将适用于text的属性应用于这些矢量图标上,从而实现改变图标颜色、添加阴影等效果
- 缺点:目前在xml文件中使用图标库中的资源时,需要自己对照查阅不同图标所对应的标记,自己手敲标记,这样不仅麻烦,而且容易出错。
2、使用android-iconify
2.1 添加依赖
在需要使用iconify的app的build.gradle的dependencies中添加依赖(下面添加了整个库,在实际开发过程中,可以只添加自己需要的某一个或几个库即可):
dependencies {
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)
}
2.2 初始化android-iconify
自定义一个继承自Application类的类:
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());
}
}
2.3 配置Application
<application
android:name="com.application.MyApplication"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
2.4 在布局文件中的使用
其中fa xxx 是Font Awesome的图标库。icon-scan icon-wx-pay 是自定义阿里图标库
<?xml version="1.0" encoding="utf-8"?
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="100dp"
android:layout_marginTop="30dp"
android:gravity="center"
android:orientation="vertical"
<TextView
android:id="@+id/id_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="example delegate"
tools:ignore="HardcodedText" /
<com.joanzapata.iconify.widget.IconTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:shadowColor="#22000000"
android:shadowDx="0"
android:shadowDy="5"
android:shadowRadius="1"
android:text="Welcome {fa-smile-o} {fa-hand-peace-o} !"
android:textColor="#2A9BDA"
android:textSize="30sp" /
<com.joanzapata.iconify.widget.IconTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:shadowColor="#22000000"
android:shadowDx="3"
android:shadowDy="3"
android:shadowRadius="1"
android:text="I {fa-heart-o} to {fa-code} on {fa-android}"
android:textColor="#FF0000"
android:textSize="40sp" /
<com.joanzapata.iconify.widget.IconButton
android:id="@+id/id_icon_ib"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@null"
android:clickable="true"
android:shadowColor="#22000000"
android:shadowDx="3"
android:shadowDy="3"
android:shadowRadius="1"
android:text="I {fa-heart-o}"
android:textColor="@color/selector_text_press_color"
android:textSize="40sp" /
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:gravity="center"
android:orientation="horizontal"
<ImageButton
android:layout_width="50dp"
android:layout_height="50dp"
android:background="@drawable/alipay_button_style" /
<ImageButton
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_marginLeft="30dp"
android:background="@drawable/wx_button_style" /
</LinearLayout
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:gravity="center"
android:orientation="horizontal"
<com.joanzapata.iconify.widget.IconTextView
android:layout_width="50dp"
android:layout_height="50dp"
android:clickable="true"
android:shadowColor="#22000000"
android:text="{fa-weixin}"
android:textColor="@color/selector_text_press_color"
android:textSize="40sp" /
<com.joanzapata.iconify.widget.IconTextView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginLeft="30dp"
android:clickable="true"
android:text="{fa-cc-visa}"
android:textColor="@color/selector_text_press_color"
android:textSize="40sp" /
</LinearLayout
<com.joanzapata.iconify.widget.IconTextView
android:id="@+id/id_itv_wxicon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="{icon-scan}"
android:textSize="40sp" /
<com.joanzapata.iconify.widget.IconTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="{icon-wx-pay}"
android:textSize="40sp" /
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="30dp"
android:layout_marginTop="10dp"
android:gravity="center"
android:orientation="horizontal"
<com.joanzapata.iconify.widget.IconTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="{fa-cog}"
android:textSize="30dp" /
<com.joanzapata.iconify.widget.IconTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:text="{fa-cog spin}"
android:textSize="30dp" /
<com.joanzapata.iconify.widget.IconTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:text="{fa-refresh spin}"
android:textSize="30dp" /
<com.joanzapata.iconify.widget.IconTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:text="{fa-spinner spin}"
android:textSize="30dp" /
<ImageView
android:id="@+id/id_iv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp" /
</LinearLayout
</LinearLayout
</ScrollView
3、自定义FontModule
3.1 下载资源
3.2 添加资源自定义FontModule
将上文截图中的 iconfont.ttf 复制到assets目录
自定义FontModule可以参考FontAwesomeModule,需要实现IconFontDescriptor 接口以及实现Icon接口来添加我们具体的图标
public class IconFontModule implements IconFontDescriptor {
@Override
public String ttfFileName() {
return "iconfont.ttf";//上文复制的字体文件
}
@Override
public Icon[] characters() {
return IconFonts.values();
}
}
public enum IconFonts implements Icon {
// 将/&#x替换成u
icon_scan('ue609'),
icon_ali_pay('ue65e'),
icon_wx_pay('ue615'),
icon_qq_pay('ue60d');
private char character;
IconFonts(char character) {
this.character = character;
}
@Override
public String key() {
return name().replace('_', '-');
}
@Override
public char character() {
return character;
}
}
4、在代码中使用
IconDrawable iconDrawable = new IconDrawable(this, FontAwesomeIcons.fa_key)
.colorRes(R.color.colorAccent)
.actionBarSize();
imageView.setImageDrawable(iconDrawable);
5、使用到的资源文件
支付宝默认状态支付宝点击状态微信正常状态微信点击状态
selector_text_press_color.xml
<?xml version="1.0" encoding="utf-8"?
<selector xmlns:android="http://schemas.android.com/apk/res/android"
<item android:state_pressed="true" android:color="@color/colorAccent"/
<item android:color="@color/colorGreen"/
</selector
alipay_button_style.xml
<?xml version="1.0" encoding="utf-8" ?
<selector xmlns:android="http://schemas.android.com/apk/res/android"
<item android:state_pressed="true" android:drawable="@drawable/alipay_pressed" /
<item android:drawable="@drawable/alipay_normal" /
</selector
wx_button_style.xml
<?xml version="1.0" encoding="utf-8" ?
<selector xmlns:android="http://schemas.android.com/apk/res/android"
<item android:state_pressed="true" android:drawable="@drawable/wx_pressed" /
<item android:drawable="@drawable/wx_normal" /
</selector
colors.xml
<?xml version="1.0" encoding="utf-8"?
<resources
<color name="colorPrimary" #3F51B5</color
<color name="colorPrimaryDark" #303F9F</color
<color name="colorAccent" #FF4081</color
<color name="colorGreen" #04b00f</color
</resources
总结
以上所述是小编给大家介绍的Android iconify 使用详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对ZaLou.Cn网站的支持!
- ggolot2 画ROC曲线
- 47. 访问MySql数据库实现增删改查 | 厚土Go学习笔记
- 39. channel管道 | 厚土Go学习笔记
- springmvc学习第二天
- 厚土Go学习笔记 | 38. goroutine轻量级线程
- 厚土Go学习笔记 | 37. 图片(image)生成器
- 编写地道的Go代码
- 开发你不能忽略的问题?JavaScript(JS)
- 厚土Go学习笔记 | 36. web服务指定路径下的get参数接收与处理
- 用R进行文本分析初探——包含导入词库和和导入李白语句
- Golang事务模型
- 厚土Go学习笔记 | 35. web服务器实现动态路径
- 过滤器Filter精华知识点,怎能不看
- JavaMail开发示例,学习要看对资料
- java教程
- Java快速入门
- Java 开发环境配置
- Java基本语法
- Java 对象和类
- Java 基本数据类型
- Java 变量类型
- Java 修饰符
- Java 运算符
- Java 循环结构
- Java 分支结构
- Java Number类
- Java Character类
- Java String类
- Java StringBuffer和StringBuilder类
- Java 数组
- Java 日期时间
- Java 正则表达式
- Java 方法
- Java 流(Stream)、文件(File)和IO
- Java 异常处理
- Java 继承
- Java 重写(Override)与重载(Overload)
- Java 多态
- Java 抽象类
- Java 封装
- Java 接口
- Java 包(package)
- Java 数据结构
- Java 集合框架
- Java 泛型
- Java 序列化
- Java 网络编程
- Java 发送邮件
- Java 多线程编程
- Java Applet基础
- Java 文档注释
- 【Rust日报】2020-07-25 RustScan:一个Rust实现的更快的Nmap
- 常用功能加载宏——单元格字符处理
- 【翻译】Rust生命周期常见误区
- 代码管理
- 【翻译】200行代码讲透RUST FUTURES (3)
- ECCV2020 | FReLU:旷视提出一种新的激活函数,实现像素级空间信息建模
- 字符处理——大小写转换编码知识扩展
- 【Rust日报】2020-07-26 - Easy Rust 让Rust文档更容易理解
- VBA使用API_04:标准控件
- OpenCV与图像处理(五)
- 常用功能加载宏——工作表目录
- VBA操作VBA——VBA工程对象
- 前端|3D立体视频翻转动画
- 利用STS临时密钥服务快速搭建直传页面的实践
- 常用功能加载宏——单元格聚光灯