> For the complete documentation index, see [llms.txt](https://docs.hello-lisa.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.hello-lisa.com/developers/guides/integration-guide/app-integration/android.md).

# Android

{% hint style="warning" %}
**Documentation Update in Progress**

We are currently revisiting and updating this section of our documentation to ensure it provides the most accurate and helpful information. Some content may be incomplete or outdated during this process.

Thank you for your patience! If you have any immediate questions, please don’t hesitate to contact our support team.
{% endhint %}

***

This guide explains how to embed the LiSA Player in an Android WebView and enable two-way communication..

### Setting Up the WebView

Use the Android `WebView` component to load the LiSA Player. Here’s a complete example:

```kotlin
import android.os.Bundle
import android.webkit.WebSettings
import android.webkit.WebView
import android.webkit.WebViewClient
import androidx.appcompat.app.AppCompatActivity

class WebViewActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        // Prevent WebView from resizing when keyboard opens
        window.setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_NOTHING)

        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_webview)

        val webView: WebView = findViewById(R.id.webView)
        webView.webViewClient = WebViewClient()

        // Enable JavaScript
        val webSettings: WebSettings = webView.settings
        webSettings.javaScriptEnabled = true
        webSettings.cacheMode = WebSettings.LOAD_DEFAULT

        // Allow Media Playback Inline
        webSettings.mediaPlaybackRequiresUserGesture = false

        // Load the web app URL
        webView.loadUrl("https://{clientId}.loveslisa.tech/s/{showId}")
    }
}
```

***

### Passing Safe-Area Insets

Android WebViews do not natively support `safe-area-insets`. To address this, inject CSS variables for safe-area compensation into the LiSA Player:

```kotlin
private fun injectSafeAreaInsets(webView: WebView) {
    val insetsScript = """
        (function() {
            const rootStyle = document.documentElement.style;
            rootStyle.setProperty('--lsc-safe-area-inset-top', '${topInset}px');
            rootStyle.setProperty('--lsc-safe-area-inset-bottom', '${bottomInset}px');
            rootStyle.setProperty('--lsc-safe-area-inset-left', '${leftInset}px');
            rootStyle.setProperty('--lsc-safe-area-inset-right', '${rightInset}px');
        })();
    """
    webView.evaluateJavascript(insetsScript, null)
}
```

Then adjust the creation of the `webViewClient` to this:

```kotlin
        webView.webViewClient = object : WebViewClient() {
            override fun onPageFinished(view: WebView, url: String) {
                injectSafeAreaInsets(webView)
            }
        }
```

Make sure to calculate `topInset`, `bottomInset`, `leftInset`, and `rightInset` using Android's safe area utilities.