とある案件を依頼されて、開発しているんだけど、お客様の要件からすると、ガッツリネイティブアプリで開発するよりも、WEBサイトを構築してWebViewで参照した方が、予算も抑えられて良さそう。
ってことで、サイト側はWordPressで構築。
早速、WebViewでアクセスしてみたんだけど、サイトの至る所が正常に表示されない。
JavaScriptを有効にする
WebViewって、何もしないで表示するとJavaScriptが無効になっているんですね。
JavaScriptを有効にするにはこんな感じ。
// JavaScript有効 webView.getSettings().setJavaScriptEnabled(true);
LocalStorageを有効にする
よくあるメニュー。あれもJavaScriptを使用してみるみたい。
タップしてもリンク先に遷移しない。
エラーを追ってみたら「LocalStorage」を有効にしないといけないみたい。
表示速度を上げる為でしょうか?端末にデータを保存してるんですね。これは知らなかった。
LocalStorageを有効にするにはこんな感じ。
String databasePath = this.getApplicationContext().getDir("localstorage", Context.MODE_PRIVATE).getPath(); // LocalStorage有効 webView.getSettings().setDomStorageEnabled(true); webView.getSettings().setDatabasePath(databasePath);
シングルウィンドウで開く
あとはaタグでtarget=”_blank”指定してて複数ウィンドウが起動してしまうと面倒なことになるので
シングルウィンドウで開く指定。
// シングルウィンドウで開く webView.getSettings().setJavaScriptCanOpenWindowsAutomatically(false); webView.getSettings().setSupportMultipleWindows(false);
リンクのクリックを有効にする
WebViewはそのままでは、リンクをタップしても何も遷移しないのでリンクのクリックを有効にする。
// リンクのクリックを有効 webView.setWebViewClient(new WebViewClientLink());
メソッドの中はこんな感じ。
/** * webViewでタップされたリンク先を開く * * @param view(WebView) * url(String) * @return boolean * @see * */ private class WebViewClientLink extends WebViewClient { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return true; } }
ブラウザの戻るを実装する
あとは端末の「戻る」ボタンが押された時の制御。
ブラウザの表示履歴がある時は、「ブラウザの戻る」と同じ制御にして、無い場合はアプリ終了。
/** * 「戻る」押下時に呼び出される * * @param キーイベント * event(KeyEvent) * @return boolean * @see * */ public boolean dispatchKeyEvent(KeyEvent event) { if (event.getAction() == KeyEvent.ACTION_DOWN) { switch (event.getKeyCode()) { case KeyEvent.KEYCODE_BACK: // ネットワークに接続している時だけ if (mCommon.isConnected(me)) { if (webView.canGoBack()) { // 閲覧履歴がある場合は戻る webView.goBack(); return true; } } } } return super.dispatchKeyEvent(event); }
これで、標準のブラウザアプリとほぼ同じ挙動になります。
てか、そう考えるとブラウザアプリって、とても簡単なアプリなのかもしれません。
株式会社woodsmallの小林でした。
https://woodsmall.co.jp/
コメント