koogawa log

iOS、Android、foursquareに関する話題

iOS 7から追加されたDynamic Typeを使ってみた

iOS 7から突如、設定画面に「文字サイズを変更」が出現しました。

f:id:koogawa:20130917235109p:plain

「Dynamic Type機能をサポートしているAppでは、下のスライダで指定したサイズでテキストが表示されます」とのことらしいですが、Dynamic Type機能をサポートするにはどうすればよいのでしょうか。

とりあえずWWDC 2013 のセッションを見てみる

こちらから試聴できます「Using Fonts with Text Kit

f:id:koogawa:20130917235126p:plain

ビデオを観てみたところ、どうやらText KitのUIFontDescriptorというものを使うらしいです。

実装してみる

1. まずはUITextViewをひとつ作ります

f:id:koogawa:20130917235157p:plain

2. Text Styleを設定

次にテキストのスタイルを設定します。Dynamic Typeでは、文字のサイズを数値で指定するのではなく、次のようなスタイルを指定するようです。

  • Headline
  • Body
  • Subheadline
  • Footnote
  • Caption1
  • Caption2

選択したスタイルによって、文字のサイズ等が自動的に調整されるようです。

UIFontDescriptor *fontDescriptor = [UIFontDescriptor preferredFontDescriptorWithTextStyle:UIFontTextStyleBody]; 

3. テキスト属性を設定

文字列には太字、斜体などの属性も指定できるようです。

  • Italic
  • Bold
  • Expanded

 など、いろいろ選べるようですが、斜体と太字以外は試していません。

UIFontDescriptor *boldFontDescriptor = [fontDescriptor fontDescriptorWithSymbolicTraits:UIFontDescriptorTraitBold];

4. UIFontを生成してUITextViewにセット。

fontWithDescriptor:size: というメソッドを使用して生成したUIFontオブジェクトをUITextViewにセットします。 

UIFont *boldFont = [UIFont fontWithDescriptor:boldFontDescriptor size:0.0];

self.textView.font = boldFont;

サイズには 0 を指定しておかないと、設定画面からフォントサイズを指定しても効果がなくなるようです。

5. ノーティフィケーション追加

このままだと設定画面からフォントサイズを変更しても何も起こりませんでした。

調べたところ、NSNotificationCenterで UIContentSizeCategoryDidChangeNotification を監視することで、設定の変更を感知できことがわかりました。

[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(preferredContentSizeChanged:) name:UIContentSizeCategoryDidChangeNotification object:nil];

実行結果

とりあえず、設定画面の文字サイズが反映されるようになりました。これでDynamic Typeに対応できたのかな?まだまだ調査段階なのでツッコミ、訂正など歓迎です!m(_ _)m

f:id:koogawa:20130918001210p:plain

f:id:koogawa:20130918001344p:plain

f:id:koogawa:20130918001357p:plain

こちらの記事もどうぞ

 Dynamic Typeに対応したUITableViewを作ってみた - koogawa blog