DrawerLayout内のWebView

f:id:amyu_dev:20140612000510p:plain
いい加減更新しないと忘れ去られる。
今回は短めに。

DrawerLayoutのGesture

みんな大好き、DrawerLayout。
いろんなGoogleの公式アプリでも使用されている、このレイアウト。
見た目も綺麗だし、どんどん使っていきたいところですね。

さて、DrawerLayoutって実は便利そうに見えてかなり不便だったりします。
例えば、横スクロール。
Googleで"DrawerLayout Horizontal Scroll"とググれば腐るほどStackOverFlowがヒットします。
しかし、どの解決法を読んでもあまり解決できないのが… なところ。
横スクロール自体がDrawerLayoutのGestureと被ってしまうため、DrawerLayout内の横スクロールを取ることが出来ないんです。
Oh... Shock

そう、WebViewも例外ではありません。
しかし、WebViewで表示されるコンテンツは2~3年前と比べ、圧倒的にスマホの画面対応が済んでおり、横移動することはほとんどありません。
だったら、DrawerLayoutで横スクロールがかぶること無いよね?って思うわけです。
そこが今回の軽い、軽いTips。

気持ち悪いWebView と DrawerLayout

実際に実装してみるとわかると思いますが、実はあまりうまくいかないんです。
画面対応が済んで、"横移動することがほとんどない"と言っても横移動のGesture、横移動というのは取れてしまうんです。
ということは、横移動が入った瞬間そのGestureはWebViewからDrawerLayoutのGestureになってしまいます。

例えば、横に1pxも動かさないで完璧な縦スクロールを行うことが出来るのなら、今回の問題はおきません。
ただ、自動テストやBOT出ない限り、人間は絶対に横移動を入れてしまします。
すると、その途端縦スクロールができなくなり、DrawerLayoutがキモい動作をしてしまうんです。

あまり引き伸ばすのも面倒なので解決編へ。

解決編

縦スクロールだけ強制的に行わせればいいんです。
そこで考えたのが、

       <RelativeLayout
                android:layout_width="300dp"
                android:layout_height="match_parent"
                android:layout_gravity="end">

            <ScrollView
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="#00000000">

                <WebView
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        />

            </ScrollView>
        </RelativeLayout>

WebView自体をScrollViewに囲ませることです。

すると、なんと!期待する動作になるんですよーーー!
そう、解決策は、ScrollViewでかこ…

では、ないんです。
実はこれ機種単位で期待通りに動かないものがあるらしんです。
Androidマスターに教えてもらいました。

実は過去に全く同じことをやったと。
その時の解決策が…

「ListViewの1列目にWebViewを入れたんだよねー」


え?
いや、確かに動くと思います…
なんというか、予想の斜め上を行くというか…
さすが、Androidマスターはものしりでした…

最後に

というのが数カ月前の出来事だったりします。
いつかまとめようと思い、普通に忘れてました。
なんというか、こういう裏ワザまだあるので適当にまとめていきます。

ではではー