KotlinでHelloWorldとWebViewを使ってみた

これまでただ単に入れていただけのAndroid Studioを触ってみることにした。まずは弊サイトを表示するアプリを作ってみようかと思い、Webviewで表示することを目指すことにする。

開発環境のセットアップ

Homebrewで整える。

以前にインストールだけしていたので、まずはアップデート

1
2
3
4
5
6
7

$brew cask upgrade android-studio

==> Upgrading 1 outdated package:
android-studio 3.1.4.0,173.4907809 -> 3.5.2.0,191.5977832
==> Upgrading android-studio
==> Downloading https://dl.google.com/dl/android/studio/install/3.5.2.0/android-studio-ide-191.5977832-mac.dmg
######################################################################## 100.0%

完了。3.1.4から3.5.2にアップデートされた。

Nextを押したところ、足りないコンポーネントのインストールが始まった。

Hellow Worldの実行（エミュレータ）

立ち上げ直すてデバッグしようとしたら、設定がないから自分で設定しなさいとのこと。なるほどわからん。

再度最初からやり直したら今度はフリーズしないでBuildできた。

webviewは置いたものの “net::ERR_CHACHE_MISS” でつまづく

webviewを実行するアプリを起動することはできるようになったため、このサイトを表示するだけの単純なアプリをデバッグしてみることにする。

起動すると、”net::ERR_CHACHE_MISS” というエラーが表示されてサイトに接続されない。エミュレータからHost端末の回線を拾えていないのかと思い（だとしてもCHACHE_MISSは変だが）エミュレータ上でChromeを起動してインターネット接続ができるかを確かめる。

できる。

となると、アプリからインターネット接続ができていないということなので、その点に絞って確認した。

小一時間ほどググってようやく、AndroidManifest.xmlに

1

<uses-permission android:name="android.permission.INTERNET" />

と記載しないと、文字通りインターネット接続ができないことを知った。一つ賢くなった。

“net::ERR_ACCESS_DENIED” でつまづく

上記の設定を入れた後に、再度デバッグしてみると、エラーメッセージが変わった。

一歩前進した！と喜ぶも今度はこっちの改善手法が全くわからない。再度悩む。

結論としては、

というコメント。「まさかぁ」と思いながら、エミュレータからアンインストールして再度ビルドしなおしたら接続できた。マジでか。

Kotlinでエミュレータでデバッグする

webviewを利用するので、デバッグも入れておきたかった。こちらはリファレンスを読んだらすぐにわかった。

1

WebView.setWebContentsDebugginEnabled(true)

を設定した上で、google chromeを開いて、 chrome://inspect  にアクセスすると起動中のエミュレータ端末のwebviewの情報が取得できるようになった。

最後に勉強がてら、適当にユーザエージェントを指定しつつ、webview内でのJavascript, Cookieを許可する設定を入れるところまで確認した。

まとめ

今回、Android Studioを触ったことがない状態で、IDEの使い方含め、簡単なAndroidアプリを調べつつ触ってみることには苦労した。特に、Javaでの実装例は多いがKotlinでの実装例、サンプルが少ないことに苦労した。リファレンスを読みつつ、多くのAPIとその実装方式は似通っているのでJavaでの実装例を参考に作ることができた。先人の知恵に感謝。

最終的に作ったコードは以下のようになった。

MainActivity.kt

AndroidManifest.xml