原文鏈接:在iOS中使用圖標字體?
在開發(fā)阿里數(shù)據(jù)iOS版客戶端的時候,由于項目進度很緊,項目里的所有圖標都是用最平常的背景圖片方案來實現(xiàn)。而為了要兼容普通屏與Retina屏的設(shè)備纤怒,蘋果要求每個背景圖都要以兩種尺寸存(a.png和a@2x.png)骨杂,這讓設(shè)計師們增加了成本,因為他們每次都得出兩份背景圖標莫瞬。
現(xiàn)在在web開發(fā)上儡蔓,icon font技術(shù)的應(yīng)用很廣泛郭蕉,它不僅在解決多分辨率顯示問題上很有成效,而且在使用它的時候還能降低不少設(shè)計和開發(fā)成本喂江。
那么它能不能應(yīng)用到ios開發(fā)上來呢召锈?帶著這個疑問,我在github上找到了FontasticIcons和ios-fontawesome获询,但是這兩個OC包對icon資源封裝都有限涨岁,而且擴展也不是很方便。
既然能在ios上使用icon font吉嚣,那么怎么用呢梢薪?經(jīng)過一番摸索,發(fā)現(xiàn)使用原理和自定義字體差不多瓦戚,只有個別操作不太一樣沮尿,接下來我給大家詳細介紹一下。
如何使用自定義字體
在講icon font之前较解,首先先來看看普通自定義字體是如何在ios中使用的畜疾,兩個原理是一樣的。這里以KaushanScript-Regular為例:
Step 1: 導(dǎo)入字體文件
將字體文件拖入項目(ios支持的字體格式有:.ttf印衔、.otf啡捶,其他格式不確定):
然后再在項目的資源池中確認字體文件是否加入項目,打開xcode項目的Build Phases中查看:
Step 2: 配置.plist文件
在.plist文件中注冊新加入的字體奸焙,.plist文件往往以“[appname]-Info.plist”的形式存在于
“Supporting Files”文件夾內(nèi)瞎暑。 在.plist文件中添加新屬性“Fonts provided by
application”,該屬性的值是一個數(shù)組与帆,這意味著可以在這里注冊多個字體了赌。
Step 3: 找到字體集名稱
注冊完,我們需要檢測是否注冊成功且取得新字體名稱玄糟,檢測方法就是把所有安裝了的字體都打印出來勿她,看看新注冊的字體是否在里面:
for(NSString*?familyin[UIFont?familyNames])
{
NSLog(@"%@",?family);
for(NSString*?namein[UIFont?fontNamesForFamilyName:?family])
{
NSLog(@"??%@",?name);
}
}
運行完,查看控制臺里打印出的所有字體集中是否有新注冊的字體阵翎,如果有逢并,說明注冊成功,并將字體名(在這里是“Kaushan Script”)記住留到后面用郭卫。
Step 4: 使用新字體
最后砍聊,就是使用你最新加入的字體啦:
UILabel?*label?=?[[UILabel?alloc]?initWithFrame:CGRectMake(10,?60,?300,?50)];
label.font?=?[UIFont?fontWithName:@"Kaushan?Script"size:35];
label.text?=?@"icon?font";
label.textColor?=?UIColorFromRGB(0xFF7300);
[self.view?addSubview:label];
效果:
開始使用icon font
圖標字體也是字體,使用方式和上面所說的差不多贰军,只是在套用上有些差別玻蝌;這里拿fontello的圖標字體庫?為例。
1.選擇需要的圖標
在fontello的圖標字體庫選擇自己需要的圖標,并下載生成的字體文件灶伊。
2.按照上面的步驟將圖標字體注冊到項目中
3.找到圖標對應(yīng)的unicode碼
使用FontLab Studio 5工具打開字體文件(比如fontello.ttf)疆前,就可以看到圖標與unicode碼之間的對應(yīng)關(guān)系啦寒跳。
4.使用圖標
UILabel?*label?=?[[UILabel?alloc]?initWithFrame:CGRectMake(10,?60,?300,?50)];
label.font?=?[UIFont?fontWithName:@"fontello"size:35];
label.text?=?@"\U0000E802?\U0000E801?\U0000E803?\U0000E804?\U0000E805?\U0000E81A";
label.textColor?=?UIColorFromRGB(0xFF7300);
[self.view?addSubview:label];
在Objective-C中聘萨,自定義的unicode碼需要以“\U0000E802”這樣的格式存在。
5.使用emoji表情庫
這里還可以使用蘋果emoji表情庫的圖標童太,這里不需要新加字體庫米辐,只要找到emoji圖標和unicode之間的對應(yīng)關(guān)系就好,但是這些圖標都不是矢量圖书释,縮放請自重翘贮。
UILabel?*label5?=?[[UILabel?alloc]?initWithFrame:CGRectMake(10,?480,?300,?50)];
label5.text?=?@"\U0000e42a\U0000e525\U0000e41c";
[self.view?addSubview:label5];
6.效果
7.使用自制圖標字體
如果上面介紹的圖標庫還滿足不了你的需求,或者需要的圖標分布在多個圖標庫而不能集中到一個字體文件中爆惧;那么你可能需要自己去制作圖標字體文件了狸页。
總結(jié)
這樣,在iOS開發(fā)上扯再,不僅可以直接去開源圖標庫找現(xiàn)成的圖標用到項目中芍耘,而且還可以輕松地改變圖標的顏色、大小熄阻,相信可以解放不少設(shè)計師和工程師的工作量斋竞。
上代碼
圖標字體庫
etao圖標字體庫(這里有個問題要注意,etao的圖標字體名為“Untitled1”秃殉,是不是生成字體的同學(xué)疏忽啦坝初?)
參考資料
Common Mistakes With Adding Custom Fonts to Your iOS App