9
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

WebViewでPullToRefreshの実装

Posted at

はじめに

  • Chrome みたいに PullToRefresh でウェブページを更新してみたいなと思って実装してみたものの、
    ハマりどころがあったので、それの紹介になります。

単純な実装の問題点

  • 「WebView + PullToRefresh」 などで検索してみると SwipeRefreshLayout を使った実装例がよく出てきます。
よくあるレイアウト例
<SwipeRefreshLayout>
  <FrameLayout>
    <WebView />
  </FrameLayout>
</SwipeRefreshLayout>
  • 実際、サンプル通りの実装でなんとかなるのですが、
    Google マップのような指でぐりぐり動かすウェブアプリの場合悲惨な事が起きます。

pull1.JPG

  • SwipeRefreshLayout が TouchEvent を吸ってしまって、地図が動かせなくなります…

解決策

  • Chromium の実装を眺めてた所 OverScroll を監視していて、コンテンツサイズが WebView のサイズを越えない
    (=スクロールバーが表示されない)場合には SwipeRefreshLayout を有効にしないといった処理になっていました。
  • Chromium は WebViewCore から多種多様なイベントを貰っているので同じ実装は出来ません。
  • そこでアレンジしたものを git にあげておきましたので、実装を見てみて下さい。
    80行程度の小さなものです。
    https://github.com/lovetanpopo/PullToRefreshWebView
9
5
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
9
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?