Swift 3時代のUIColorとそれを扱う便利なライブラリを作りました


概要

  • Xcode 8 / Swift 3 での UIColor の指定について
  • UIColorを簡単に指定できるライブラリ (CSS3ColorsSwift) をつくりました

Swift バージョンによる UIColorの違い

Swift 3 以降 多くのクラスのメソッドやプロパティが変更になりました。
UIColor の特定の色を指定するタイププロパティも変更され、名前に冗長さがなくなりました。

Swift 2

view.backgroundColor = UIColor.whiteColor()

Swift 3

view.backgroundColor = UIColor.white

// UIColorは省略可能
view.backgroundColor = .white

クラス名の省略は Swift 2 でも可能でしたが、宣言が class funcclass var になったことで()も必要ないため、読みやすくなります。

自由に色を設定するための幾つかの方法

RGBa指定のよくやるやつ

extension UIColor {
    convenience init(hex: UInt, alpha: CGFloat = 1.0) {
        let red: CGFloat = CGFloat((rgb & 0xFF0000) >> 16) / 255.0
        let green: CGFloat = CGFloat((rgb & 0x00FF00) >> 8) / 255.0
        let blue: CGFloat = CGFloat(rgb & 0x0000FF) / 255.0
        self.init(red: red, green: green, blue: blue, alpha: alpha)
    }
}

UIColor(hex: 0x00ff00)  // green

Color Literal

Xcode 8ではColor Literalという仕組みで 色を見た目にわかりやすく設定できるようになりました。
Color Literalについては こちらのコラム で詳しく紹介されていて参考になります。

ライブラリを作りました

CSS3ColorsSwift

RGBaの指定ではパッと見た目にわかりづらい。Color Literalは微妙な違いがわからないし、設定方法が面倒。
そう思ってCSS3で定義されている X11 Colors を簡単に設定できるようにするライブラリを作りました。
UIColorextensionになっていて、131色定義しています。 (実際の色数より少ない理由は、下記の『注意点』で説明しています)

使い方

CocoaPods, Carthage でインストールできるのでREADMEを御覧ください。

view.backgroundColor = .lightGreen

注意点

UIColor にデフォルトで定義されているものは二通りの対応をしています。

  • red, blue など名前もカラーコードも一致するものは、このライブラリに含めませんでした。
  • green, orange など名前は一致するが違うカラーコードの場合は、タイププロパティ名の後ろにCSS3を付けています。
名前 カラーコード
.green #00FF00
.greenCSS3 #008000

名前空間を利用すれば同じ名前を使うこともできましたが、UIColor.NameSpace.green のように長く入力したくなかったのでこのようにしました。

Xcode Snippet

UIColorの名前空間を侵すようなことをしたくないという人のために、色の名前でColor Literalが入力しやすくするXcodeのSnippetファイルを作っておきました。

こちらは、CSS3の色とUIColorで定義されている色も合わせて146色あります。

インストール方法

# bash, zsh
$ git clone https://github.com/WorldDownTown/CSS3ColorsSwift.git && cp CSS3ColorsSwift/XcodeSnippets/*.codesnippet ~/Library/Developer/Xcode/UserData/CodeSnippets/

# fish
$ git clone https://github.com/WorldDownTown/CSS3ColorsSwift.git; and cp CSS3ColorsSwift/XcodeSnippets/*.codesnippet ~/Library/Developer/Xcode/UserData/CodeSnippets/

さいごに

issue でも Pull Rquest でも構いません。コントリビュート待っています。
https://github.com/WorldDownTown/CSS3ColorsSwift