Xcode 9 のベクター機能がさらなる次元に
バイナリ内にベクターデータを入れて、任意のサイズでキレイな画像を表示
このmono氏のツイートに、さらっと「ベクター維持指定」と書いてあります。これはもしやと思い調べると
など、英語の記事が出てきました。日本語のは無いようなので書きます。（追記：ありました。 https://qiita.com/hikaruna/items/e6fbc283f0b3e21fd2f3）
これらによると
- バイナリにPDFベクターデータを含めて、実行時に処理され、にじみのない画像が表示される
- Xcode 9で作成したアプリをiOS 11で実行した時
- コードで書かれたものでもストーリボードでも出来る
ということで、まさしく俺達が待ち望んだ機能です。
注意点は
- アセットカタログのPreserve Vector Dataをオンにすること
です。
やってみました
Sketchで10x10のpdfデータを作成し、それをソース上で貼り付けます。
override func viewDidLoad() {
super.viewDidLoad()
let imgView = UIImageView(image: UIImage(named: "Test"))
self.view.addSubview(imgView)
imgView.frame = CGRect(x: 50.0, y: 50.0, width: 250.0, height: 250.0)
}
左がPreserve Vector Dataをオン、右がオフです。iPhoneXのシミュレートなので、右は3倍の30x30の画像が作られて表示されています。
ただ
Storyboard上に貼った画像に対して作用させるやりかたがよくわかりません。
（追記）Xcode 9.2では、Storyboard上に貼った画像の場合、画像の縦や横を指定して大きさを決定するとだめで、周りとの関係から画像の大きさが確定するとOKという状況でした。縦や横の指定はだめですが、縦横比の指定はOKでした。
（追記）なにがよいのか
この機能のなにがよいのか書いてなかった。
120x120の画像を表示するなら、120x120でpdfを作って、コンパイル時に120x120 240x240 360x360の画像を作成する従来のやり方で特に不都合はないのではないか、という意見もありそうです。
この機能のよいところは、120x120が130x130に仕様変更されたときに触る箇所が一箇所になるところです。
従来のやり方だと、Xcodeで表示の大きさを変更し、画像作成ソフトでpdfを作り直し、それをXcodeに登録するという手間がありました。また、最終的に決定してからpdfを作り直す作業をすればよいと考え、そのまま忘れてマッチしない画像でリリースしてしまう恐れもあります。これを防ぐことが出来るという点が今回の新機能のメリットです。
（追記）pdfファイルのアルファ
pdf最強かと思ったら、Sketchでpdfファイルを作るときは、アルファが100%以外でグラデーションが作れない。アルファ100%のグラデーションの場合は可能で、アルファを固定（100%以外でも）で単色の場合もOKだが、アルファの値をグラデーションさせるとだめ。Sketchの仕様なのか、pdfの仕様なのか、何かの不具合なのか謎。
（追記）ボタンの画像に適用
setImageではなく、setBackgroundImageを使って背景の方に設定すると効くようです。setImageはだめでした(Xcode 9.2)。
ボタンのタイプは.systemより.customのほうがいいです。.systemだと押したときに勝手に半透明になる(Xcode 10.1 iOS12.1)。
