RubyMotionでナビゲーションバーをフラットデザインにする方法

ナビゲーションバーのフォントやスタイルを一括で適用するための方法が分からなかったのでまとめます。

なお、本記事は次の記事の続編です。

RubyMotionでナビゲーションバーや本文に日本語フォントを指定する方法 - Qiita
http://qiita.com/y-ken/items/68199d09a60ec701764c

ナビゲーションバーをフラットデザインにする方法

次のGistを参考に、移植しました。
なお、デザイン適用と同時にフォントを20ポイントから16ポイントに縮小しています。
https://gist.github.com/bensheldon/5751863

app_delegate.rb

# -*- coding: utf-8 -*-
class AppDelegate
  def application(application, didFinishLaunchingWithOptions:launchOptions)
    @window = UIWindow.alloc.initWithFrame(UIScreen.mainScreen.bounds).tap do |window|
      window.rootViewController = UINavigationController.alloc.initWithRootViewController(QiitaViewController.new)
      window.makeKeyAndVisible
    end
    navigation_appearance
    true
  end

  def navigation_appearance
    # Background Color
    UINavigationBar.appearance.setBackgroundImage UIImage.alloc.init, # use an empty image
      forBarMetrics: UIBarMetricsDefault
    UINavigationBar.appearance.setBackgroundColor "#3076B4".to_color
    # Remove Shadow
    UINavigationBar.appearance.setShadowImage UIImage.alloc.init # use an empty image

    UINavigationBar.appearance.setTitleTextAttributes({
      UITextAttributeTextColor => UIColor.whiteColor,
      UITextAttributeTextShadowColor => UIColor.clearColor,
      UITextAttributeTextShadowOffset =>  NSValue.valueWithUIOffset(UIOffsetMake(0,0)),
      UITextAttributeFont => UIFont.fontWithName("HiraKakuProN-W6", size: 16)
    })
    true
  end
end

これで次の画像のように、フラットデザイン化が行えるようになります。

デフォルトのスタイル

フラットデザイン