メニューを閉じる

テクノデジタルグループ

メニューを開く

2016.08.12

プログラミング

Xcode WKWebViewでズーム操作を禁止する

坂東です。

WebViewは新しいほど良いというポリシーなので、Xcodeでは当然WKWebViewを使用しています。

素のWebViewよりは大分マシなのですがそれでも挙動が解せない部分はある。
ピンチイン/アウトによるズーム操作を無効にするところでハマったので共有します。

ダメだった例

htmlのmetaに「user-scalable=no」を書く。
Safariでは効いたのですがWKWebViewでは効きませんでした。

うまく動いた例

これを参考に
https://gist.github.com/paulofierro/66aea963303df735aa00

以下の部分だけ追記したらうまく行きました。

   // ピンチズーム禁止
   NSString *source = @"var meta = document.createElement('meta'); \
   meta.name = 'viewport'; \
   meta.content = 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no'; \
   var head = document.getElementsByTagName('head')[0];\
   head.appendChild(meta);";
   WKUserScript *script = [[WKUserScript alloc] initWithSource:source injectionTime:WKUserScriptInjectionTimeAtDocumentEnd forMainFrameOnly:YES];
   WKUserContentController *userContentController = [WKUserContentController new];
   [userContentController addUserScript:script];
   
   WKWebViewConfiguration *configuration = [WKWebViewConfiguration new];
   configuration.userContentController = userContentController;
   configuration.processPool = appDelegate.processPool;
   
   _mainWeb = [[WKWebView alloc] initWithFrame:CGRectZero configuration:configuration];

理由はまだ理解できてないのですが、動的にやんないと動いてくんないんでしょうかね。

おわり。

 


【記事への感想募集中!】

記事への感想・ご意見がありましたら、ぜひフォームからご投稿ください!
  • こんな記事が読んでみたい、こんなことが知りたい、調べてほしい!という意見も募集中!
  • いただいた感想は今後の記事に活かしたいと思います!

感想フォームはこちら


【テクノデジタルではエンジニア/デザイナーを積極採用中です!】

下記項目に1つでも当てはまる方は是非、詳細ページへ!
  • 自分でアプリを作ってみたい
  • ITで世の中にワクワクを生み出したい
  • 使いやすさ、デザインにこだわったWebサイトを開発したい

採用情報の詳細はこちら


Qangaroo(カンガルー)

  • 徹底した見やすさと優れた操作性で、テストの「見える化」を実現。
  • テストの進捗が見える。開発がスマートに進む。
  • クラウド型テスト管理ツール『Qangaroo(カンガルー)』

【テクノデジタルのインフラサービス】

当社では、多数のサービスの開発実績を活かし、
アプリケーションのパフォーマンスを最大限に引き出すインフラ設計・構築を行います。
AWSなどへのクラウド移行、既存インフラの監視・運用保守も承りますので、ぜひご相談ください。
詳細は下記ページをご覧ください。

https://www.tcdigital.jp/infrastructure/

最近の記事