アプリ内で外部フォント(カスタムフォント)を使用し表示させる方法を紹介します。
INDEX
使用する外部フォントと手順
使用できるフォントの種類
- PostScript Type1ベースのOpenType (拡張子 .otf)
- TrueTypeベースのOpenType (拡張子 .ttf)
概要
- フォントの準備とPostScript名の調査
- Xcodeプロジェクトにフォントファイルをインポート
- アプリケーションの info.plist にフォント情報を追加
- コードから利用する
外部フォントを表示する
-
フォントの準備とPostScript名の調査
- まず最初に Mac に標準でインストールされている Font Book を起動し、使用したいフォントのPostScript名を調べます。
Font Book で使用したいフォントを選択し、「プレビュー」>「フォント情報を表示」 で確認します。
- 今回使用する Arial Black の Regular は Arial-Black というPostScript名になっています。
- ついでにフォントファイルをデスクトップにコピーしておきます。
-
Xcodeプロジェクトにフォントファイルをインポート
- デスクトップにコピーしたフォントファイルを Xcodeプロジェクトの Supporting Files にドラッグします。
- Copy items…、Create groups…、ターゲットのアプリ項目をチェックし「Finish」でインポートが完了です。
-
アプリケーションの info.plist にフォント情報を追加
- プロジェクト を選択し Infoタブ > Custom iOS Target Properties の適当な項目で「右クリック」>「Add Row」を選択
- Fonts provided by application と入力し(途中から自動で補完されます)項目を追加。
- Value に拡張子を含む フォントファイル名(PostScript名ではない)を入力。
-
コードから利用する
- 先ほど FontBook で調べた PostScript名 をコードで下記のように指定すればフォントが出力されます。
- [code]
CGSize winSize = [[UIScreen mainScreen] bounds].size;
UILabel *myLabel = [[UILabel alloc] init];
myLabel.frame = CGRectMake(0, 0, 250, 50);
myLabel.center = CGPointMake(winSize.width/2, winSize.height/2);
myLabel.font = [UIFont fontWithName:@”Arial-Black” size:32];
myLabel.textAlignment = NSTextAlignmentCenter;
myLabel.text = @”Arial Black!”;
[self.view addSubview:myLabel];
[/code] - 無事出力されました。
-
まとめ
オリジナルフォントを制作し、アプリ上で表示させた時の感動は何事にも代えがたいです。
フォント一つでアプリの表情もガラリと変わってくるので、UIデザインの一環として、カスタムフォントにこだわってみるのもいいかもしれませんね。
この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。