[iOS 11][Xcode 9][新機能] Asset Catalogで色を定義できるようになりました

icon-xcode-6

Asset Catalogで色を定義できるようになった

下記はXcode Release Notesからの引用です。

Asset catalogs now support named colors that can be used in source files and Interface Builder. (28900538)

やってみた

Color Setを作成

xcassetsを選択して右クリック > 「New Color Set」をクリックします。

named_color_001

Color Setが追加されます。Attributes inspectorで色の名前や対象デバイス、色の定義ができます。

named_color_002

Color Spaceは以下から選択可能です。

named_color_003

Input Methodは以下から選択可能です。

named_color_004

試しに「Main」という名前の色を16進数で定義してみました。

named_color_005

storyboardやxibから定義した色を参照、設定

Asset Catalogで定義した色はstoryboardやxibから参照、設定可能です。
以下のようにViewの背景色に設定してみました。

named_color_006

プレビューがこちら。

named_color_007

コードから定義した色を使う

コードからもAsset Catalogで定義した色を使えます。 以下のようにUIColor(named: )で名前を指定します。 ただし、このAPIはiOS 11以上でないと使えないので11以下をサポートする場合は分岐が必要になります。

override func viewDidLoad() {
    super.viewDidLoad()

    if #available(iOS 11.0, *) {
        view.backgroundColor = UIColor(named: "Main")
    } else {
        // Fallback on earlier versions
    }
}

iOS 11、iPhone Xのシミュレーターで実行した結果がこちらです。

named_color_008

iOS 11以上じゃないと使えない

例えば、Deployment Targetを10.0にしてAsset Catalogで色を定義すると、以下のようなwarningが表示されます。

You're targeting iOS 10.0, but named colors can only be accessed from an Asset Catalog in iOS 11.0 and later.

つまり、コードから使おうがstoryboardやxibから使おうがiOS 11以上でないと使えないということです。

おわりに

iOS 11以上が必要ですが、今後UIColorはコードではなくAssetで定義し、管理することになるかもしれません。
覚えておきましょう。

AWS Cloud Roadshow 2017 福岡