xref: /aosp_15_r20/external/accompanist/docs/web.md (revision fa44fe6ae8e729aa3cfe5c03eedbbf98fb44e2c6)
1*fa44fe6aSInna Palant# WebView wrapper for Jetpack Compose
2*fa44fe6aSInna Palant
3*fa44fe6aSInna Palant[![Maven Central](https://img.shields.io/maven-central/v/com.google.accompanist/accompanist-webview)](https://search.maven.org/search?q=g:com.google.accompanist)
4*fa44fe6aSInna Palant
5*fa44fe6aSInna PalantA library which provides a Jetpack Compose wrapper around Android's WebView.
6*fa44fe6aSInna Palant
7*fa44fe6aSInna Palant!!! warning
8*fa44fe6aSInna Palant    **This library is deprecated, and the API is no longer maintained. We recommend forking the implementation and customising it to your needs.** The original documentation is below.
9*fa44fe6aSInna Palant
10*fa44fe6aSInna Palant## Usage
11*fa44fe6aSInna Palant
12*fa44fe6aSInna PalantTo implement this wrapper there are two key APIs which are needed: [`WebView`](../api/web/com.google.accompanist.web/-web-view.html), which is provides the layout, and [`rememberWebViewState(url)`](../api/web/com.google.accompanist.web/remember-web-view-state.html) which provides some remembered state including the URL to display.
13*fa44fe6aSInna Palant
14*fa44fe6aSInna PalantThe basic usage is as follows:
15*fa44fe6aSInna Palant
16*fa44fe6aSInna Palant```kotlin
17*fa44fe6aSInna Palantval state = rememberWebViewState("https://example.com")
18*fa44fe6aSInna Palant
19*fa44fe6aSInna PalantWebView(
20*fa44fe6aSInna Palant    state
21*fa44fe6aSInna Palant)
22*fa44fe6aSInna Palant```
23*fa44fe6aSInna Palant
24*fa44fe6aSInna PalantThis will display a WebView in your Compose layout that shows the URL provided.
25*fa44fe6aSInna Palant
26*fa44fe6aSInna PalantThere is a larger sample in the sample app which can be found [here](https://github.com/google/accompanist/blob/main/sample/src/main/java/com/google/accompanist/sample/webview/BasicWebViewSample.kt). This sample also shows how to show a loading state.
27*fa44fe6aSInna Palant
28*fa44fe6aSInna Palant### WebView settings including JavaScript
29*fa44fe6aSInna Palant
30*fa44fe6aSInna PalantBy default, JavaScript is disabled in the WebView. To enable it or any other settings you can use the `onCreated` callback.
31*fa44fe6aSInna Palant
32*fa44fe6aSInna Palant```kotlin
33*fa44fe6aSInna PalantWebView(
34*fa44fe6aSInna Palant    state = webViewState,
35*fa44fe6aSInna Palant    onCreated = { it.settings.javaScriptEnabled = true }
36*fa44fe6aSInna Palant)
37*fa44fe6aSInna Palant```
38*fa44fe6aSInna Palant
39*fa44fe6aSInna Palant### Capturing back presses
40*fa44fe6aSInna Palant
41*fa44fe6aSInna PalantBy default the WebView will capture back presses/swipes when relevant and navigate the WebView back. This can be disabled via the parameter on
42*fa44fe6aSInna Palantthe Composable.
43*fa44fe6aSInna Palant
44*fa44fe6aSInna Palant```kotlin
45*fa44fe6aSInna PalantWebView(
46*fa44fe6aSInna Palant    ...
47*fa44fe6aSInna Palant    captureBackPresses = false
48*fa44fe6aSInna Palant)
49*fa44fe6aSInna Palant```
50*fa44fe6aSInna Palant
51*fa44fe6aSInna Palant### Using a subclass of WebView
52*fa44fe6aSInna Palant
53*fa44fe6aSInna PalantIf you want to use a subclass of `WebView`, or simply require more control over its instantiation, you can provide a factory.
54*fa44fe6aSInna Palant
55*fa44fe6aSInna Palant```kotlin
56*fa44fe6aSInna PalantWebView(
57*fa44fe6aSInna Palant    ...
58*fa44fe6aSInna Palant    factory = { context -> CustomWebView(context) }
59*fa44fe6aSInna Palant)
60*fa44fe6aSInna Palant```
61*fa44fe6aSInna Palant
62*fa44fe6aSInna Palant## Download
63*fa44fe6aSInna Palant
64*fa44fe6aSInna Palant[![Maven Central](https://img.shields.io/maven-central/v/com.google.accompanist/accompanist-webview)](https://search.maven.org/search?q=g:com.google.accompanist)
65*fa44fe6aSInna Palant
66*fa44fe6aSInna Palant```groovy
67*fa44fe6aSInna Palantrepositories {
68*fa44fe6aSInna Palant    mavenCentral()
69*fa44fe6aSInna Palant}
70*fa44fe6aSInna Palant
71*fa44fe6aSInna Palantdependencies {
72*fa44fe6aSInna Palant    implementation "com.google.accompanist:accompanist-webview:<version>"
73*fa44fe6aSInna Palant}
74*fa44fe6aSInna Palant```
75