介紹
字體圖標(biāo)是指將圖標(biāo)做成字體文件(.ttf),從而代替?zhèn)鹘y(tǒng)的png等圖標(biāo)資源。
使用字體圖標(biāo)的優(yōu)點(diǎn)和缺點(diǎn)分別為:
優(yōu)點(diǎn):
1. 可以高度自定義圖標(biāo)的樣式(包括大小和顏色),對(duì)于個(gè)人開(kāi)發(fā)者尤其適用
2. 可以減少項(xiàng)目和安裝包的大?。ㄌ貏e你的項(xiàng)目中有很多圖片icon時(shí),效果將是M級(jí))
3. 幾乎可以忽略屏幕大小和分辨率,做到更好的適配
4. 使用簡(jiǎn)單
……
缺點(diǎn):
1. 只能是一些簡(jiǎn)單的icon,不能代替如背景圖、9圖等資源
2. 一些需要文字說(shuō)明的icon,圖片資源將會(huì)是更好的選擇
3. 對(duì)設(shè)計(jì)的要求更高,不同icon可能擁有不同的邊距,這時(shí)要切換icon時(shí)還要設(shè)置大小
4. 由于邊距的存在可能存在無(wú)法填滿控件的情況
5. 無(wú)法在android studio中進(jìn)行實(shí)時(shí)預(yù)覽
……
字體圖標(biāo)對(duì)大部分項(xiàng)目來(lái)說(shuō)都是一種更好的選擇
使用
1. 將字體文件導(dǎo)入項(xiàng)目中
直接將字體文件(.ttf)放入assets中
2.在application中初始化TypeFace
注意:android的界面渲染只有16.7ms,在渲染時(shí)才加載字體明顯是不明智的選擇,會(huì)造成明顯的卡頓,其中最明顯的表現(xiàn)在activity的跳轉(zhuǎn)會(huì)造成較長(zhǎng)的時(shí)間的延遲。
publicclassBaseApplicationextendsApplication{
privatestaticBaseApplication instance;
publicstaticsynchronizedBaseApplicationgetInstance() {
returninstance;
}
//字體圖標(biāo)
privateTypeface iconTypeFace;
publicTypefacegetIconTypeFace() {
returniconTypeFace;
}
@Override
publicvoidonCreate() {
super.onCreate();
instance =this;
iconTypeFace = Typeface.createFromAsset(getAssets(),"fonts/Material-Design-Iconic-Font.ttf");
}
}
記得在AndroidManifest.xml中配置你的application
3. 繼承文本框,自定義圖標(biāo)控件
只需要給圖標(biāo)控件加載application中加載的字體圖標(biāo)
publicclassIconViewextendsTextView{
publicIconView(Context context) {
super(context);
init();
}
publicIconView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
publicIconView(Context context, AttributeSet attrs,intdefStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
privatevoidinit() {
//? ? ? ? 設(shè)置字體圖標(biāo)
this.setTypeface(BaseApplication.getInstance().getIconTypeFace());
}
}
4.在strings中定義各圖標(biāo)的unicode編碼(使用\u前綴)
例如:
<stringname="icon_spniner">\uf3ec</string>
<stringname="icon_flag">\uf162</string>
<stringname="icon_home">\uf175</string>
注意:圖標(biāo)的unicode編碼由設(shè)計(jì)師給出,一般在提供字體圖標(biāo)的網(wǎng)站上也可找到對(duì)應(yīng)的unicode編碼
5.直接在布局中使用
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<com.mrw.iconfonttest.IconView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@android:color/holo_green_light"
android:textSize="30sp"
android:text="@string/icon_flag"
/>
<com.mrw.iconfonttest.IconView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@android:color/holo_red_light"
android:textSize="50sp"
android:text="@string/icon_home"
/>
<com.mrw.iconfonttest.IconView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@android:color/holo_blue_light"
android:textSize="70sp"
android:text="@string/icon_spniner"
/>
</LinearLayout>
6.運(yùn)行便可看到文章開(kāi)頭處的演示頁(yè)面
寫(xiě)在最后
如你所見(jiàn),使用字體圖標(biāo)可以高度自定義圖標(biāo)的大小和顏色,對(duì)于個(gè)人開(kāi)發(fā)者來(lái)說(shuō)是一個(gè)特別好的消息,再也不用在找圖標(biāo)時(shí)考慮顏色和大小了。
資源分享:
http://zavoloklom.github.io/material-design-iconic-font/">android 5.0的material-design-iconic-font
https://github.com/mikepenz/Android-Iconics">github的開(kāi)源項(xiàng)目:android-iconics(提供了另一種字體圖標(biāo)的使用方法)
http://typicons.com/">typicons
http://fontawesome.io/">fontawesome
http://csdnimg.cn/release/phoenix/production/markdown_views-d4dade9c33.css" />