震驚当悔!Icon使用極其簡(jiǎn)單傅瞻? Android-Iconics 開(kāi)源庫(kù)介紹

前情提要:公司不讓UI干重活,讓我自己找圖標(biāo)盲憎。然后推薦使用這個(gè)開(kāi)源庫(kù)嗅骄。優(yōu)質(zhì)Icon多到數(shù)不清,還可以隨意修改icon的顏色饼疙,大小溺森,使用起來(lái)略爽。簡(jiǎn)書(shū)和掘金上搜不到相關(guān)博客窑眯,踩了點(diǎn)坑屏积,凡事只能靠自己啊。

項(xiàng)目demo地址請(qǐng)點(diǎn)擊這里

一磅甩、添加依賴(lài)

compile "com.mikepenz:iconics-core:2.8.2@aar"

compile 'com.android.support:appcompat-v7:25.1.0'

二炊林、選擇需要依賴(lài)的圖標(biāo)庫(kù)

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'    

每個(gè)圖標(biāo)庫(kù)都有自己的網(wǎng)站,可以在上面挑選自己喜歡的圖標(biāo)卷要,查找對(duì)應(yīng)的圖標(biāo)id
Font Awesome
ionicons

已Font Awesome 為例

三渣聚、icon前綴和依賴(lài)庫(kù)對(duì)應(yīng)表

  1. Google Material Design Icons
    "gmd"
    ORIGINAL by Google compile 'com.mikepenz:google-material-typeface:+.original@aar'
  2. Material Design Iconic Font
    "gmi"
    Google Material Iconic compile 'com.mikepenz:material-design-iconic-typeface:+@aar'
  3. Fontawesome
    "faw"
    compile 'com.mikepenz:fontawesome-typeface:+@aar'
  4. Meteocons
    "met"
    compile 'com.mikepenz:meteocons-typeface:+@aar'
  5. Octicons
    "oct"
    compile 'com.mikepenz:octicons-typeface:+@aar'
  6. Community Material
    "cmd"
    compile 'com.mikepenz:community-material-typeface:+@aar'
  7. Weather Icons
    "wic"
    compile 'com.mikepenz:weather-icons-typeface:+@aar'
  8. Typeicons
    "typ"
    compile 'com.mikepenz:typeicons-typeface:+@aar'
  9. Entypo
    "ent"
    compile 'com.mikepenz:entypo-typeface:+@aar'
  10. Devicon
    "dev"
    compile 'com.mikepenz:devicon-typeface:+@aar'
  11. Foundation Icons
    "fou"
    compile 'com.mikepenz:foundation-icons-typeface:+@aar'
  12. Ionicons
    "ion"
    compile 'com.mikepenz:ionicons-typeface:+@aar'

四、以Drawable方式使用(在代碼中動(dòng)態(tài)替換圖片)

new IconicsDrawable(this)
.icon(FontAwesome.Icon.faw_android) //icon Id
.color(Color.RED)
.sizeDp(24) //icon 大小 dp值

private void initView() {
        final CheckBox cb_icon = (CheckBox) findViewById(R.id.cb_icon);
        int themeColor = getResources().getColor(R.color.colorAccent);
        int blackColor = getResources().getColor(R.color.black);
        int sizeDp = 20;
        final Drawable drawable = new IconicsDrawable(this)
                .icon(FontAwesome.Icon.faw_ticket).color(themeColor).sizeDp(sizeDp);
        final Drawable drawableDis = new IconicsDrawable(this).icon(FontAwesome.Icon.faw_angle_right).color(blackColor).sizeDp(sizeDp * 2);
        cb_icon.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
                if (isChecked)
                    cb_icon.setCompoundDrawables(null, drawable, null, null);
                else {
                    cb_icon.setCompoundDrawables(null, drawableDis, null, null);
                }
            }
        });
        cb_icon.setChecked(true);
    }

五僧叉、直接在XML文件中使用

  1. 使用開(kāi)源庫(kù)自定義的控件
<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.IconicsTextView
           android:text="abc{ion-ios-cloud-upload}defgh{faw-adjust}ijk{ion-ios-cloud-upload}"
           android:textColor="@android:color/holo_red_dark"
           android:layout_width="wrap_content"
           android:layout_height="56dp"
           android:textSize="16sp"/>
       <com.mikepenz.iconics.view.IconicsButton
           android:text="{faw-adjust} Button"
           android:layout_width="120dp"
           android:layout_height="60dp"/>

  1. 使用普通控件(需要注冊(cè))
    有兩種方法
  2. 在onCreate函數(shù)中加入代碼
@Override
protected void onCreate(Bundle savedInstanceState) {
  LayoutInflaterCompat.setFactory(getLayoutInflater(), new IconicsLayoutInflater(getDelegate()));
  super.onCreate(savedInstanceState);
}
  1. 重寫(xiě)attchBaseContext函數(shù)
@Override
protected void attachBaseContext(Context newBase) {
    super.attachBaseContext(IconicsContextWrapper.wrap(newBase));
}

然后就可以使用了

<ImageView
            android:layout_width="25dp"
            android:layout_height="25dp"
            app:ico_color="@color/black"
            app:ico_icon="ion_ios_eye"
            android:layout_marginRight="15dp"
            app:ico_size="30dp"
            />

六奕枝、這里有一個(gè)坑

在所有步驟都正確完成后,AS還是會(huì)紅線報(bào)錯(cuò)


翻遍了issues彪标,有說(shuō)把

xmlns:app="http://schemas.android.com/apk/res-auto"
改成
xmlns:app="http://schemas.android.com/apk/tool"
然而并沒(méi)有軟用倍权。

https://github.com/mikepenz/Android-Iconics/issues/174
看到了這個(gè)issue,直接添加

Iconics.init(getApplicationContext());
Iconics.registerFont(new GoogleMaterial());

//注:應(yīng)該和 LayoutInflaterCompat.setFactory(getLayoutInflater(), new IconicsLayoutInflater(getDelegate()));作用類(lèi)似

然后報(bào)著試一試的心態(tài)捞烟,直接運(yùn)行薄声,竟然可以!果然是我太年輕么L饣D妗!

七苍息、總結(jié)

使用起來(lái)實(shí)在是方便缩幸,對(duì)比阿里的Iconfont。Icon質(zhì)量也挺不錯(cuò)竞思。
Android-Iconics庫(kù)的地址
還有一個(gè)類(lèi)似的庫(kù)Android-Iconify的庫(kù)地址 表谊。

參考

http://blog.csdn.net/cuipp0509/article/details/60778152

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市盖喷,隨后出現(xiàn)的幾起案子爆办,更是在濱河造成了極大的恐慌,老刑警劉巖课梳,帶你破解...
    沈念sama閱讀 210,914評(píng)論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件距辆,死亡現(xiàn)場(chǎng)離奇詭異余佃,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)跨算,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,935評(píng)論 2 383
  • 文/潘曉璐 我一進(jìn)店門(mén)爆土,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人诸蚕,你說(shuō)我怎么就攤上這事步势。” “怎么了挫望?”我有些...
    開(kāi)封第一講書(shū)人閱讀 156,531評(píng)論 0 345
  • 文/不壞的土叔 我叫張陵立润,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我媳板,道長(zhǎng)桑腮,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 56,309評(píng)論 1 282
  • 正文 為了忘掉前任蛉幸,我火速辦了婚禮破讨,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘奕纫。我一直安慰自己提陶,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,381評(píng)論 5 384
  • 文/花漫 我一把揭開(kāi)白布匹层。 她就那樣靜靜地躺著隙笆,像睡著了一般。 火紅的嫁衣襯著肌膚如雪升筏。 梳的紋絲不亂的頭發(fā)上撑柔,一...
    開(kāi)封第一講書(shū)人閱讀 49,730評(píng)論 1 289
  • 那天,我揣著相機(jī)與錄音您访,去河邊找鬼铅忿。 笑死,一個(gè)胖子當(dāng)著我的面吹牛灵汪,可吹牛的內(nèi)容都是我干的檀训。 我是一名探鬼主播,決...
    沈念sama閱讀 38,882評(píng)論 3 404
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼享言,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼峻凫!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起览露,我...
    開(kāi)封第一講書(shū)人閱讀 37,643評(píng)論 0 266
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤荧琼,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體铭腕,經(jīng)...
    沈念sama閱讀 44,095評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,448評(píng)論 2 325
  • 正文 我和宋清朗相戀三年多糠,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了累舷。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,566評(píng)論 1 339
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡夹孔,死狀恐怖被盈,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情搭伤,我是刑警寧澤只怎,帶...
    沈念sama閱讀 34,253評(píng)論 4 328
  • 正文 年R本政府宣布,位于F島的核電站怜俐,受9級(jí)特大地震影響身堡,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜拍鲤,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,829評(píng)論 3 312
  • 文/蒙蒙 一贴谎、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧季稳,春花似錦擅这、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,715評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至铛漓,卻和暖如春溯香,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背票渠。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 31,945評(píng)論 1 264
  • 我被黑心中介騙來(lái)泰國(guó)打工逐哈, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人问顷。 一個(gè)月前我還...
    沈念sama閱讀 46,248評(píng)論 2 360
  • 正文 我出身青樓昂秃,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親杜窄。 傳聞我的和親對(duì)象是個(gè)殘疾皇子肠骆,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,440評(píng)論 2 348

推薦閱讀更多精彩內(nèi)容