在 iOS 中使用 iconfont

如何使用自定義字體

在講icon font以前,首先先來看看普通自定義字體是如何在ios中使用的,兩個原理是同樣的。這裏以 KaushanScript-Regular爲例:
 
Step 1: 導入字體文件
將字體文件拖入項目(ios支持的字體格式有:.ttf、.otf,其餘格式不肯定):
 
 
而後再在項目的資源池中確認字體文件是否加入項目,打開xcode項目的Build Phases中查看:
 
Step 2: 配置.plist文件
在.plist文件中註冊新加入的字體,.plist文件每每以「[appname]-Info.plist」的形式存在於「Supporting Files」文件夾內。 在.plist文件中添加新屬性「Fonts provided by application」,該屬性的值是一個數組,這意味着能夠在這裏註冊多個字體。
 
 
Step 3: 找到字體集名稱
註冊完,咱們須要檢測是否註冊成功且取得新字體名稱,檢測方法就是把全部安裝了的字體都打印出來,看看新註冊的字體是否在裏面:
 
  1. for (NSString* family in [UIFont familyNames]) 
  2.     NSLog(@"%@", family); 
  3.     for (NSString* name in [UIFont fontNamesForFamilyName: family]) 
  4.     { 
  5.         NSLog(@"  %@", name); 
  6.     } 
 
 
運行完,查看控制檯裏打印出的全部字體集中是否有新註冊的字體,若是有,說明註冊成功,並將字體名(在這裏是「Kaushan Script」)記住留到後面用。
 
 
Step 4: 使用新字體
最後,就是使用你最新加入的字體啦:
  1. UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(10, 60, 300, 50)]; 
  2. label.font = [UIFont fontWithName:@"Kaushan Script" size:35]; 
  3. label.text = @"icon font"; 
  4. label.textColor = UIColorFromRGB(0xFF7300); 
  5. [self.view addSubview:label]; 
 
效果:
 
開始使用icon font
圖標字體也是字體,使用方式和上面所說的差很少,只是在套用上有些差異;這裏拿 fontello的圖標字體庫爲例。
 
1.選擇須要的圖標
在fontello的圖標字體庫選擇本身須要的圖標,並下載生成的字體文件。
 
2.按照上面的步驟將圖標字體註冊到項目中
3.找到圖標對應的unicode碼
使用 FontLab Studio 5工具打開字體文件(好比fontello.ttf),就能夠看到圖標與unicode碼之間的對應關係啦。
 
 
4.使用圖標
 
  1. UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(10, 60, 300, 50)]; 
  2. label.font = [UIFont fontWithName:@"fontello" size:35]; 
  3. label.text = @"\U0000E802 \U0000E801 \U0000E803 \U0000E804 \U0000E805 \U0000E81A"; 
  4. label.textColor = UIColorFromRGB(0xFF7300); 
  5. [self.view addSubview:label]; 
 
 
 
5.使用emoji表情庫
這裏還可使用蘋果emoji表情庫的圖標,這裏不須要新加字體庫,只要找到emoji圖標和unicode之間的對應關係就好,可是這些圖標都不是矢量圖,縮放請自重。
  1. UILabel *label5 = [[UILabel alloc] initWithFrame:CGRectMake(10, 480, 300, 50)]; 
  2. label5.text = @"\U0000e42a\U0000e525\U0000e41c"; 
  3. [self.view addSubview:label5]; 
 
6.效果
 
7.使用自制圖標字體
若是上面介紹的圖標庫還知足不了你的需求,或者須要的圖標分佈在多個圖標庫而不能集中到一個字體文件中;那麼你可能須要 本身去製做圖標字體文件了。
 
總結
這樣,在iOS開發上,不只能夠直接去開源圖標庫找現成的圖標用到項目中,並且還能夠輕鬆地改變圖標的顏色、大小,相信能夠解放很多設計師和工程師的工做量。
 
上代碼
 
圖標字體庫
etao圖標字體庫(這裏有個問題要注意,etao的圖標字體名爲「Untitled1」,是否是生成字體的同窗疏忽啦?)
 
參考資料

 

 

 

 

原文連接:css

http://www.cocoachina.com/industry/20131111/7327.htmlhtml

https://github.com/JohnWong/IconFont ios

相關文章
相關標籤/搜索