![[iOS 10] SFSafariViewControllerのバーの色を変更できるようになりました](https://devio2023-media.developers.io/wp-content/uploads/2016/09/ios10_400x400.png)
[iOS 10] SFSafariViewControllerのバーの色を変更できるようになりました
2016.10.24
この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。
iOS 9まで
iOS 9までは以下のようにSFSafariViewControllerのViewプロパティのtintColorを設定することでバー（ツールバーなど）内のコントロールの色を変更することはできましたが、バーの色を変更するようなAPIは提供されていませんでした。
import UIKit
import SafariServices
class ViewController: UIViewController {
@IBAction func didTapButton(sender: AnyObject) {
let url = NSURL(string: "https://dev.classmethod.jp/author/kato-jun/")
let vc = SFSafariViewController(URL: url!)
// バー内のコントロールの色が変わる
vc.view.tintColor = UIColor.redColor()
presentViewController(vc, animated: true, completion: nil)
}
}
実行結果
iOS 10から
iOS 10ではSFSafariViewControllerに以下のプロパティが追加されました。
preferredBarTintColorpreferredControlTintColor
これらのプロパティを設定することでバー内のコントロールの色に加え、バーの色も変更することができるようになりました。
ただし、Safariアプリの方でPrivate Browsing Modeが有効になっていると、これらのプロパティを設定しても反映されないのでご注意ください。
以下のサンプルコードでは、バーの色を黒、バー内のコントロールの色を赤に変更しています。
import UIKit
import SafariServices
class ViewController: UIViewController {
@IBAction func didTapButton(_ sender: AnyObject) {
let url = URL(string: "https://dev.classmethod.jp/author/kato-jun/")
let vc = SFSafariViewController(url: url!)
// バーの色が変わる
vc.preferredBarTintColor = UIColor.black
// バー内のコントロールの色が変わる
vc.preferredControlTintColor = UIColor.red
present(vc, animated: true)
}
}
実行結果
ちなみに
試してわかったことですが、preferredBarTintColorの色に合わせてそれに合うようにプログレスの色も自動で変わるようです。
preferredBarTintColorが白（UIColor.white）の場合
preferredBarTintColorが黒（UIColor.black）の場合
まとめ
iOS 10でバーの色を変えられるようになったことでアプリのテーマカラーなどをSFSafariViewControllerにも設定できるようになりました。
そういった意味で、少しずつSFSafariViewControllerがアプリに組み込みやすくなってきたと思います。
