メモ > 技術 > IDE: AndroidStudio > アプリの作成（Jetpack Compose / Webサイトを開く）
■アプリの作成（Jetpack Compose / Webサイトを開く）
■WebViewで表示
Jetpack Compose の AndroidView で WebView を利用する
https://zenn.dev/kaleidot725/articles/2021-11-13-jc-webview-detaiils
【Android】WebViewを使ってWebページを表示する方法と端末内のブラウザで開く方法 - Qiita
https://qiita.com/takagimeow/items/70a548681c20860920bf
Jetpack Compose で雑に WebView を使う - Medium
https://kaleidot725.medium.com/jetpack-compose-%E3%81%A7%E9%9B%91%E3%81%AB-webview-%E3%82%92%E4%BD%B...
Jetpack Composeのプロダクション採用 -イマイチだったこと編- - NIFTY engineering
https://engineering.nifty.co.jp/blog/15294
WebViewでアプリ開発するメリット・デメリット - Deha magazine
https://deha.co.jp/magazine/webview-pros-cons/
WebViewで「net::ERR_CACHE_MISS」と表示される問題 【Android】 - Kuwapp's Blog
https://yusuke-hata.hatenablog.com/entry/2015/07/07/210730
マニフェストファイルを編集し、インターネットに接続できるようにする
追加場所は、ルートであるmanifestの直下でいい
manifests/AndroidManifest.xml
<uses-permission android:name="android.permission.INTERNET" />
以下のようにプログラムを作成する
@Composable
fun MainScreen() {
AndroidWebView("https://refirio.org/")
}
@Composable
fun AndroidWebView(url: String) {
AndroidView(
factory = { context -> WebView(context) },
update = { webView ->
webView.webViewClient = WebViewClient()
webView.settings.javaScriptEnabled = true // JavaScriptを実行する場合
webView.loadUrl(url)
}
)
}
なお以下のようにすると、MainScreenから表示先を変更できる
@Composable
fun MainScreen() {
var webViewTarget by remember { mutableStateOf("https://www.google.co.jp/") }
Column {
Text("Webページの表示切り替え。")
Row {
Button(onClick = {
webViewTarget = "https://refirio.org/"
}) {
Text("refirio.org")
}
Button(onClick = {
webViewTarget = "https://freo.jp/"
}) {
Text("freo.jp")
}
Button(onClick = {
webViewTarget = "https://www.php-labo.net/"
}) {
Text("php-labo.net")
}
}
AndroidWebView(webViewTarget)
}
}
■Accompanist WebViewについて
AndroidViewではなく、AccompanistのWebView Wrapperを使うという手もあるらしい
むしろ、こちらの方が推奨されるみたい…と思ったが、以下のように書かれている。もうメンテナンスされていないらしい
> This library is deprecated, and the API is no longer maintained.
> We recommend forking the implementation and customising it to your needs.
Guide - Accompanist
https://google.github.io/accompanist/web/
どれを使うべきか…と思ったが、Accompanistについて以下のように書かれている
これはつまり、標準のWebViewで十分になったということか
> Jetpack Composは従来の手法と比べると、必要とする機能が足りてないので、それを補うことを目的としたライブラリーグループ。ComposeAPIのラボのようなもの。
> 公式のツールキットに導入されることが目的。導入後は非推奨になり、Accompanistから削除される。
Accompanistの使い所 (Jetpack Compose)
https://zenn.dev/nagaoooon/articles/6ea091a436ecb0
公式のブログでも以下のように書かれている
要約すると
「Composeが安定してきたので、機能追加などサポートを終了することにした。」
「現行のソースコードを参考に独自に実装する方がシンプルになる」
「ニーズにあったカスタム実装を作成することを推奨する」
とのこと
> Pager Indicator, Placeholder & WebView
> Now that Compose is stable, with a robust set of APIs that make creating custom widgets far simpler than in the past with the view system, we have decided to no longer add or support our own set of custom widgets in Accompanist. This includes Pager Indicator, Placeholder & WebView.
> Compose makes implementing your own versions of these widgets easy. The main problem we have with implementing custom widgets is that we need to support enough customization for everyone. When you implement a widget yourself, you can implement just what you need and nothing more, which greatly simplifies the implementation. Another reason we are no longer supporting custom widget libraries in Accompanist is that we believe by having them in Accompanist, we are deterring the community from developing their own sets of custom widgets.
> Recommendation: We recommend using our implementations to fork or create your own custom implementations that suit your needs.
An update on Jetpack Compose Accompanist libraries - August 2023 | by Ben Trengrove | Android Developers | Aug, 2023 | Medium
https://medium.com/androiddevelopers/an-update-on-jetpack-compose-accompanist-libraries-august-2023-...
以下にソースコードがある
これを参考に、独自実装するのが良さそう
accompanist/web/src/main/java/com/google/accompanist/web/WebView.kt at main - google/accompanist
https://github.com/google/accompanist/blob/main/web/src/main/java/com/google/accompanist/web/WebView...
いったん追加情報を待つべきか…という状態なので、また改めて調査したい
以下、WebView Wrapperに関する内容を含んだメモ
［Jetpack Compose］WebViewで開いたページのタイトルを表示する
https://zenn.dev/yumemi_inc/articles/2023-02-16-accompanist-webview-title
現状、画面が回転されるとWebViewの内容はリセットされる
以下などを参考に対策できそうか。Formでの入力途中の内容までは残らないか
Accompanist の WebView Wrapper メモ2: 状態が画面回転に生き残らない - Qiita
https://qiita.com/mangano-ito/items/e17fc127f698fb944837
以下は特殊な操作を行う場合の参考になりそう
【Android】WebViewをJetpack Composeで使った場合の、バックキーで前ページに戻る方法 - Qiita
https://qiita.com/tsumuchan/items/83b5ce9d7c27bd78833a
以下は未検証だが試したい
［Jetpack Compose］WebViewで特定のリンクをクリックしたらネイティブの画面に遷移させる
https://zenn.dev/yumemi_inc/articles/2023-02-04-accompanist-webview-routing
■ブラウザで表示
[Jetpack Compose] Glide経由でコンテンツ一覧を表示してタップされたらブラウザで開く
https://zenn.dev/laiso/articles/5a18b8689c13787841d8
@Composable
fun MainScreen() {
val context = LocalContext.current
Column {
Text("ブラウザを開く")
Button(onClick = {
val uri = Uri.parse("https://www.google.co.jp/")
val intent = Intent(Intent.ACTION_VIEW, uri)
ContextCompat.startActivity(context, intent, null)
}) {
Text("Google")
}
}
}