書類の拡大・縮小
書類をピンチイン・アウトで拡大・縮小を可能としたい。
対応方針は、以下
- インチイン・アウトをハンドリング
- 特定のコントロール(mobile-zoom-in,mobile-zoom-out)をクリック or JS 実行
現状の処理の流れ
- DocumentWebFragment.ktのsetupWebView()内の
webSettings.displayZoomControls = falseによって全てのページでのピンチインアウトができないようになっている - webviewのタッチイベントは同ファイル、setClickListeners()メソッド内の
it.setOnScrollChangeListenerで行われている。
webview関連で使用できるメソッド
- https://developer.android.google.cn/reference/kotlin/android/webkit/WebView
- https://developer.android.google.cn/reference/kotlin/android/webkit/WebSettings
- https://developer.android.com/reference/kotlin/android/view/MotionEvent
検証
(1)2本の指でタップしている時の1本目の指の座標と2本目の指の座標を取得して、距離によってピンチインアウトを判定する
⇒ DocumentWebFragment.ktのit.setOnTouchListenerによって指の動きを監視しているが、MotionEvent.ACTION_POINTER_2_DOWN、MotionEvent.ACTION_POINTER_UPにてタップしたとき、指を離したときの座標を取得できることを確認
下記の計算式で距離を算出予定:
ピンチ前の1本目の指の座標(Bx, By)、2本目の指の座標(Bx2, By2)とすると
BPL = |Bx2 - Bx| + |By2 - By|・・・①
ピンチ後の1本目の指の座標(Ax, Ay)、2本目の指の座標(Ax2, Ay2)とすると、
APL = |Ax2 - Ax| + |Ay2 - Ay|・・・②
①と②の大小でピンチインかアウトかを判定、閾値以上であれば、DOM呼び出し
⇒ DOMを呼び出せることも確認
(2)ドキュメントビューワを表示している時は、標準のピンチインアウトを有効にする
webSettings.displayZoomControls = true
⇒標準のピンチインアウトを有効にしてピンチインアウトができることを確認
(1)で仮実装、動作確認
- ピンチ時の2本の指の座標取得、距離の算出、DOM呼び出しでピンチインアウトの処理が行われることを確認
- メモリについて増えないことを確認
6/27 onScaleメソッドでリアルタイムに拡大縮小率を取得し、DOMを呼び出すよう修正
(修正方針)
DocumentWebFragment.ktにてピンチを取得するために、新しくScaleGestureDetector.SimpleOnScaleGestureListenerを継承したPinchGestureListenerクラスを追加
webview.setOnTouchListenerにて、画面をタッチしている指が1本の場合はスワイプ検知、2本の場合はピンチの検知を行う。
PinchGestureListenerクラスのonScaleメソッドにてリアルタイムに拡大縮小率を取得し、初期よりも0.25大きくなっていたらピンチアウト、0.25小さくなっていればピンチインと判定し、DOM呼び出しを行う。
(動作確認)
問題なく動作することを確認