下記ブログの転載です！
https://rc-code.info/ios/post-236/
iOSのWKWebViewConfigrationに設定するWKPreferencesのminimumFontSizeが効かないケースがあったので調査＆備忘録。
WKWebView の使い方
WKWebViewの基本的な使い方に関しては こちら にまとめております。
合わせてご覧ください。
WKPreferences minimumFontSize の設定方法
WKPreferencesはWebビューの基本設定をカプセル化するオブジェクトです。（公式ドキュメント）
このうちminimumFontSizeはptサイズでフォントの最小サイズを決めるプロパティです。
まずは使い方を記載します。
import UIKit
// ① WebKit の import
import WebKit
class ViewController: UIViewController {
var webView: WKWebView!
override func loadView() {
// ② WKWebViewConfiguration の生成
let webConfiguration = WKWebViewConfiguration()
// ③ WKPreferences の生成
let preferences = WKPreferences()
// ④ WKPreferences の minimumFontSize プロパティに値を指定
preferences.minimumFontSize = 100.0
// ⑤ WKWebViewConfiguration に WKPreferences のインスタンスを設定
webConfiguration.preferences = preferences
// ⑥ WKWebView に Configuration を引き渡し initialize
webView = WKWebView(frame: CGRect(x: 150, y: 200, width: 200, height: 20), configuration: webConfiguration)
// ⑦ view に WKWebView を割り当て
view = webView
}
override func viewDidLoad() {
super.viewDidLoad()
loadView()
webView.load(URLRequest(url: URL(string: "https://www.apple.com/")!))
}
}
上記のように、まずWKPreferencesのインスタンスを生成し、このプロパティであるminimumFontSizeに最小サイズにしたいフォントサイズをpt換算で指定します。
そしてWKPreferencesインスタンスをWKWebViewConfigurationにセットし、このWKWebViewConfigurationをWKWebViewの設定として使います。
minimumFontSize が効かないケース
さて本題ですが、このWebViewで様々なサイトを見てみると、minimumFontSizeを設定しているにも関わらず、指定フォントサイズ以下なってしまう場合が見受けられます。
検証した結果、この事象にはCSSのtext-size-adjustというスタイルが影響していることが分かりました。
text-size-adjust スタイルとは？
text-size-adjust (ベンダープレフィックスだと-webkit-text-size-adjust) は、一部のデバイスで使われるテキストの自動拡大アルゴリズムを制御するスタイルです。
対応していないブラウザーはこのプロパティを無視します。
一部のモバイル端末には、縦向き (Portrate) と横向き (Landscape) が切り替わった際に文字サイズを自動調整する機能があり、text-size-adjustはこの自動調整を制御します。
text-size-adjust が設定されると minimumFontSize が効かなくなる
検証を行なった結果、text-size-adjustによって縮小されたサイズはminimumFontSizeによって制限されたフォントサイズよりも小さくなることが分かりました。
念の為、その他のスタイル指定でフォントサイズの制限が無視されないか検証しています。
検証内容
最下部 Playground の Resources ディレクトリに様々なスタイル定義によるフォントサイズ変更を含んだHTMLファイルを用意しました。
minimumFontSizeを設定した WKWebViewにて、このHTMLをそれぞれ表示した結果、text-size-adjustを設定したHTMLのみ、minimumFontSizeで指定した値よりフォントサイズが小さくなりました。
下記画像が、minimumFontSizeに100を設定し、上部テキストに様々なスタイル定義で40px相当のフォントサイズを指定した画像です。
下記テキストは比較用のプレーンなテキストです。
見た通り、スタイルで指定された40pxを無視し、minimumFontSizeに指定されている100pt相当の大きさで表示されています。
変わって次の画像がtext-size-adjustにを指定した時の画像です。
こちらの上部テキストでは、スタイルで指定された40pxが無視され、minimumFontSizeに指定されている100ptが適用されるはずですが、text-size-adjustに指定している10%が適用され、4px (40pxの10％)相当の大きさになっています。
まとめ
全ての要素・スタイルを検証できているわけではないので確実ではないですが、WKPreferencesのminimumFontSizeを指定しているのにフォントが想定以下のサイズになってしまうようであれば、text-size-adjustの設定を疑ってみるのが良いかもしれません。
検証Playground
検証環境
Mac: 10.13.6
XCode: 10.1
Swift: 4.2.1
参考ドキュメント
WebKit
WKWebViewConfiguration
WKPreferences
text-size-adjust