# 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.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.hello-lisa.com/developers/guides/integration-guide/app-integration/android.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
