Android使用字體圖標(biāo)

介紹

字體圖標(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" />

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容