Tech iOS

iOS13ダークモード対応

投稿日:2019年10月23日 更新日:

はじめに

こんにちは、nukkyです。
今回はiOS13から追加されたダークモードの対応に関して書いていこうと思います。

一時しのぎ

iOS 13 SDKでは、デフォルトでダークモードに対応している状態とみなされるみたいなので、
これについては、Info.plistでUIUserInterfaceStyleキーにlightを指定することで、アプリ内では常にライトモード扱いとなり、そもそもダークモードにしないという対応も可能そうです。
ただし、公式ドキュメントに以下の記述があります。

Supporting Dark Mode is strongly encouraged. Use the UIUserInterfaceStyle key to opt out only temporarily while you work on improvements to your app’s Dark Mode support.

「ダークモードへの対応を強く推奨します。UIUserInterfaceStyleキーは作業が完了するまでの一時しのぎに限られる」というような内容になっています。
時期ははっきりわかりませんがUIUserInterfaceStyleキーの使用でリジェクトをされる未来も十分あり得るため、アプリの更新・配信を今後も行うならダークモードへの対応は必須かと思います。

実装

上記の通り、ダークモードはiOS13からの対応になるのでXcodeは11以上を用意してください。

UI Element Colors

iOS13SDKにプリセットされている、UI Element Colors(.systemBackgroundColorなど)を使うと自動で下記の対応をしてくれます。

  • 色を指定するviewがmodalyかどうかで濃さを変えてくれる
  • iOS13以前の端末の場合、代替の色を指定してくれる(Color Set同様)
    例).systemBackgroundColor の場合、whiteなど

システムと同じ色を使うのが適当なケースではこれらを利用しましょう。
こちらのプリセットでダークモード対応に必要な機能はすでに用意してくれているのでそれを活用したほうが良い場合もあります。
https://developer.apple.com/documentation/uikit/uicolor/ui_element_colors

Color Set

かといって、アプリ独自のカラーでライトもダークも対応したい!ということはあると思います。
その際はAssets CatalogのColor Set(iOS11~)で対応しましょう。
Color Setのメリットは以下のとおりです。

  • Storyboard Xib, codeで色が使える
  • Light, Darkの色指定が可能

カラーのタイプはここで選択します。

UI Element Colorsで用意されている色を指定することもできます。

ここを選択すると、

このように以前にはなかったカラーアセットを選択することができます。

コードで描きたい

ビューの生成時などにダークモードかどうかを判定して静的な色をセットしても、アプリ動作中にモードが切り替わったときに追随できなくなってしまいます。
モード切り替え時に追随できるようにするには、ダイナミックカラーを利用します。 UIColor にクロージャーを渡して、クロージャーの中でモードごとの色を返すようにすることで、動的な色を作れるイニシャライザが新たに導入されました。

カスタムのカラーを定義する

アプリ独自のカラーセットを UIColor のエクステンションに定義して、実際に色を指定する箇所ではこちらを利用する方法もあります。ダークモード導入以前からこのように定義しているアプリも多いと思うのでここを修正することでダークモードに対応することもできます。
またダイナミックカラーを返すようにすることで、モード切り替え時も自動的に色が置き換わるようになります。

画像をモードで動的に変更したい

このような場合はupdateViewConstraints()やviewWillLayoutSubviews()に現在のモードの判定を行い画像の更新を行いましょう。
ダークモードの判定は以下のメソッドで行えます。

 

さいごに

私のように、めんどくさがって対応を後回しにしてたり、まだ何をやったらいいかわからない方の助けになれれば幸いです。

おすすめ書籍

[改訂新版]Swift実践入門 ── 直感的な文法と安全性を兼ね備えた言語 WEB+DB PRESS plus 詳解 Swift 第4版 [改訂新版]Swiftポケットリファレンス (POCKET REFERENCE)

blog-page_footer_336




blog-page_footer_336




-Tech, iOS
-,

執筆者:


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


関連記事

Go言語

GoフレームワークGinでミドルウェアを使ってログインAPIを実装

1 はじめに2 ログインAPIの作成3 ログインのセッション管理4 ミドルウェア4.1 gin.Default()4.2 Logger4.3 Recovery4.4 sessions5 独自ミドルウェ ...

[C#]Genericsの使い方をまとめてみた。その2

1 はじめに2 Genericsの構文3 型パラメーター4 制約条件5 規定値6 さいごに7 おすすめ書籍 はじめに こんにちはsuzukiです。ブログを書いているときAndroid10が発表され、ア ...

【Unity】StarterAssetのThirdPersonControllerにアニメーションを追加する

1 はじめに2 Animationの追加3 Animatorの編集4 コードの修正5 さいごに6 おすすめ書籍 はじめに こんにちはsuzukiです。今回はThirdPersonControllerに ...

入門スクラム〜スクラムフレームワーク

1 はじめに2 スクラムの特徴2.1 シンプルなフレームワークであること2.2 素早い反復を繰り返すこと2.3 検査・適応・透明性3 スクラムの役割3.1 プロダクトオーナー3.2 スクラムマスター3 ...

swift

SwiftでPDFを表示する(iOS11以前対応版)

1 はじめに1.1 前提条件2 実装3 さいごに はじめに こんにちは、nukkyです。 SwiftでPDFを表示したい場合iOS11以降ならPDFKitがありますが、自分の様にまだ11以前のOSにも ...

フォロー

blog-page_side_responsive

2019年10月
 12345
6789101112
13141516171819
20212223242526
2728293031  

アプリ情報

私たちは無料アプリもリリースしています、ぜひご覧ください。 下記のアイコンから無料でダウンロードできます。