Android使用Font Awesome顯示小圖標(一)

Android中傳統(tǒng)的顯示圖標的方式

在平常的開發(fā)中,如果我們需要在界面上顯示某個小圖標,比如搜索按鈕,返回按鈕,這時我們需要美工給我們切對應的png圖片,并放進對應的drawable文件夾中,這樣隨著圖標的越來越多,APK體積也會越來越大。

什么是Font Awesome

Font Awesome是一個專為Bootstrap設計的字體文件,我們可以通過向顯示字體一樣方便的顯示我們想要顯示的圖標。對于Android,F(xiàn)ont Awesome使用TextView顯示小圖標,而且無需使用png圖片,只需使用一個ttf文件,并且在這些字體中的圖片都是矢量圖,是可以放大和縮小的,這就意味著每個圖標都能在所有大小的屏幕上完美呈現(xiàn)。

Font Awesome的優(yōu)點和缺點

優(yōu)點
  • 只需使用一個ttf文件,無需美工切png圖,大大減小了apk體積,你可以驕傲的對美工MM說,這些圖標都包在我身上了,你只要喝喝咖啡就行了(崇拜的眼光已經投過來)。
  • 可以自己設置顏色,大小。Font Awesome使用TextView顯示圖標,你可以像設置字體顏色和大小一樣,設置這個圖標,可以起到很好的適配作用(媽媽再也不用擔心我的適配問題)。
缺點
  • 圖標有限,很難滿足所有的需求,但是可以結合傳統(tǒng)的切圖方式。

那么重點來了,怎么使用呢

1. 下載Font Awesome,在此雙手奉上下載好的文件fontawesome-webfont.ttf\
2. 把下載后的fontawesome-webfont.ttf放到assets文件夾中(不知道在哪?你可以轉行了!)
3. 編寫string.xml,可以在http://fontawesome.io/cheatsheet/#中查看圖標對應的字符串(往下拉,你就看到了- -!),添加你想要的圖標到string.xml中(你想要添加好的xml?抱歉我沒有!想要哪張自己加唄),如下:

其中name值可以按照自己的命名規(guī)則取名

4. 編寫布局,在TextView中使用該字符串,就可以顯示對應的圖標了,如下:

其中android:text引用你要顯示的圖標對應的string資源,android:textColor設置圖標顏色,android:textSize設置圖標大小(跟設置字體大小顏色一樣樣的)。

5. JAVA代碼中引用

首先找到assets中的fontawesome-webfont.ttf,代碼如下:

Typeface font = Typeface.createFromAsset(getAssets(), "fontawesome-webfont.ttf");

然后為需要的TextView設置setTypeface(font)就可以了,代碼如下:

TextView tvIcon= (TextView) findViewById(R.id.tv_icon);

tvIcon.setTypeface(font);

大功告成,最終的效果圖如下:

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容