我使用这个开源库完全就是因为方便,可以让我更加专注的学习 Android 其它方面的知识,而不在图标上浪费时间。写这篇文章也完全是为了方便自己使用这个开源库,毕竟时间长了,就记不清怎么使用了,还是学习后留下学习的笔记比较好。
对应项目已经放在 Github 上面。
一、添加依赖
compile 'com.mikepenz:iconics-core:2.8.2@aar'
compile 'com.android.support:appcompat-v7:${supportLibVersion}'
- 1
- 2
- 1
- 2
这两行添加的是 android-Iconics 开源库的核心依赖,是必须添加的。而第二行的 appcompat-v7 库一般在新建项目时就会默认添加,而后面的 ${supportLibVersion} 则表示的当前support库的最新版本。我在使用时用的是25.2.0版本。
compile 'com.mikepenz:google-material-typeface:3.0.1.0.original@aar'
compile 'com.mikepenz:material-design-iconic-typeface:2.2.0.2@aar'
compile 'com.mikepenz:fontawesome-typeface:4.7.0.0@aar'
compile 'com.mikepenz:octicons-typeface:3.2.0.2@aar'
compile 'com.mikepenz:meteocons-typeface:1.1.0.2@aar'
compile 'com.mikepenz:community-material-typeface:1.8.36.1@aar'
compile 'com.mikepenz:weather-icons-typeface:2.0.10.2@aar'
compile 'com.mikepenz:typeicons-typeface:2.0.7.2@aar'
compile 'com.mikepenz:entypo-typeface:1.0.0.2@aar'
compile 'com.mikepenz:devicon-typeface:2.0.0.2@aar'
compile 'com.mikepenz:foundation-icons-typeface:3.0.0.2@aar'
compile 'com.mikepenz:ionicons-typeface:2.0.1.2@aar'
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
这几行在添加时,就不是必须的了,它表示的是各种图标库,你只要选择自己喜欢用的添加上去就好了。
那么怎么才能找到自己喜欢的图标呢?其实在Android-Iconics开源库中,作者在Google Play商店上提供了一个应用,可以查看所有的图标,然后通过每个图标对应的字符串就可以使用这个图标了。应用的使用图片如下:
这个应用我已经放在了百度云里,密码:jvbu
二、在XML文件中使用
1、使用开源库中的自定义控件
在自定义的开源库中为了方便大家的使用,它还自定义了四个控件分别是IconicsButton,IconicsCompatButton,IconicsImageView,IconicsTextView。大家只需要添加依赖之后,就可以直接使用。
<com.mikepenz.iconics.view.IconicsImageView
android:id="@+id/iconicsImageView"
android:layout_width="72dp"
android:layout_height="72dp"
android:layout_gravity="center"
app:iiv_icon="@string/gmd_ac_unit"
app:iiv_color="@color/colorPrimary"
app:iiv_size="36dp"/>
<com.mikepenz.iconics.view.IconicsButton
android:id="@+id/iconicsButton"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="{gmd-sort} IconicsButton"/>
<com.mikepenz.iconics.view.IconicsTextView
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="{gmd-ac-unit}This is a Android-Iconics"/>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
从上面可以看出,图标可以嵌入到文字中,说明其实所有的图标都是字体文件中的特殊符号。
IconicsImageView其实还有android:src
属性,经过实验测试,app:iiv_icon
属性覆盖了android:src
属性,所有请以app:iiv_icon
系列属性为主。
实现结果如下图:
2、在常用控件中使用Android-Iconics图标
官方说明上说在普通控件上使用图标有两种方法:
1、在onCreate函数中加入代码
@Override
protected void onCreate(Bundle savedInstanceState) {
LayoutInflaterCompat.setFactory(getLayoutInflater(), new IconicsLayoutInflater(getDelegate()));
//...
super.onCreate(savedInstanceState);
//...
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 1
- 2
- 3
- 4
- 5
- 6
- 7
2、重写attchBaseContext函数
@Override
protected void attachBaseContext(Context newBase) {
super.attachBaseContext(IconicsContextWrapper.wrap(newBase));
}
- 1
- 2
- 3
- 4
- 1
- 2
- 3
- 4
但是我失败了。。我只能在TextView控件的android:text
属性中加入图标,但是,却不能使用ImageView控件中的app:ico_icon
等一系列属性,我也不知道为什么,大概是我还学习得不够吧!
还有重要的一点要说,就是使用上述两种方法的其中一种后,开源库自定义的控件中除IconicsImageView外,其它的就不能显示图标了,就是说不能在文字中添加图标了!。
三、以Drawable方式使用
以Drawable方式主要是在代码中使用,可以动态地改变图标,现在为IconicsButton控件添加一个单击监听器,来动态地改变IconicsImageView的图标。
public class MainActivity extends AppCompatActivity {
private IconicsButton iconicsButton;
private IconicsImageView iconicsImageView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
iconicsButton = (IconicsButton) findViewById(R.id.iconicsButton);
iconicsImageView = (IconicsImageView) findViewById(R.id.iconicsImageView);
iconicsButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
iconicsImageView.setIcon(getIcon(GoogleMaterial.Icon.gmd_ac_unit, 36, Color.GRAY));
}
});
}
private IconicsDrawable getIcon(IIcon icon, int dp, int color) {
return new IconicsDrawable(this).icon(icon).sizeDp(dp).color(color);
}
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
具体实现效果如下:
四、高级使用方法:自定义图标
使用这个开源库就是为了方便,如果有人喜欢研究,可以自己做一个自定义的图标库出来。
五、总结
在使用这个开源库时,就以使用开源库自定义的控件IconicsImageView为主,其它一般控件就在代码中时再添加图标,所有导致使用这个开源库有一个缺点,那就是无法预览。即使是IconicsImageView,也不能预览。