hi all, i am using this third party webview library in my Compose Multiplatform project: https://github.com/KevinnZou/compose-webview-multiplatform I can successfully use the

navigator.evaluateJavaScript

method to send a token and other information from the native app to the WebView on iOS, but it does not work on Android. Here's some sample code:

@Composable
fun MyWebViewScreen(webUrl: String) {
    val webViewState =
        rememberWebViewState("<https://www.mysite.com>")
    val webViewNavigator = rememberWebViewNavigator()
    val jsBridge = rememberWebViewJsBridge(webViewNavigator)
    val token by dataStore.getUserToken().collectAsState(initial = null)

    LaunchedEffect(Unit) {
        initWebView(webViewState)
        initJsBridge(jsBridge)
    }

    LaunchedEffect(
        webViewState.loadingState,
        token,
    ) {
        if (webViewState.loadingState == LoadingState.Finished && token != null) {
          val authMessage = {
            "options": "userAuth",
            "token": "$token",
          }

          webViewNavigator.evaluateJavaScript("window.postMessage($authMessage, '*');")
        }
    }

    Column(Modifier.fillMaxSize()) {
        WebView(
            state = webViewState,
            modifier = Modifier
                .padding(WindowInsets.statusBars.asPaddingValues())
                .fillMaxSize(),
            navigator = webViewNavigator,
            webViewJsBridge = jsBridge,
        )
    }
}

fun initWebView(webViewState: WebViewState) {
    webViewState.webSettings.apply {
        zoomLevel = 1.0
        isJavaScriptEnabled = true
        logSeverity = KLogSeverity.Debug
        allowFileAccessFromFileURLs = true
        allowUniversalAccessFromFileURLs = true
        androidWebSettings.apply {
            allowFileAccess = true
            isAlgorithmicDarkeningAllowed = true
            domStorageEnabled = true
        }
    }
}

fun initJsBridge(webViewJsBridge: WebViewJsBridge) {
    webViewJsBridge.register(GreetJsMessageHandler())
}

does anybody have any experience/workaround for Android? thanks!

what does it want? im using

maxWidth

which is from the box with constraints scope

I'm using navigation-compose (nav2)... and still having trouble understanding how to manage save state with back nav Home Tab -> Post Screen (for post id #123) -> Home Tab -> Post Screen (for post id #123) Is there a way to back nav properly so that when returning to the same deeper / child destination again (post #123)... the state of that destination is restored?

Box { Box { } }

The inner box has a bunch of focusable, scrollable and clickable elements. I want to disable all of those, while still allowing the outer box to be clickable. How do I do that? More details in 🧵

im using the material3

ModalBottomSheetLayout

component where I need to nest content with a

LazyColumn

. When i do that, the content refuses to scroll . I use a

LazyVerticalGrid

, like magic it scrolls. Anyone have a workaround that lets you use a lazycolumn? It has to somewhat do with the draggable anchors code but not entirely sure why one works, but not the other

Does translating and scaling using:

.graphicsLayer {
    scaleX = scale
    scaleY = scale
    translationX = translation.value.x
    translationY = translation.value.y
}

change the size and location of the bounding box for click listeners?

I'm building a solitaire game for fun in compose. Is it worth pursuing writing it using basic elements such as column etc. or is it better to have a custom layout for the entire game? The main challenge I see is dragging and dropping between columns, is that even possible?

Hi. I'm looking for a way to remove the padding around the navigation suite items of my navigation suite scaffold. I want to make it smaller so I set the items' height to 48dp. Is there a simple way to achieve what I want? I basically want to reproduce Instagram bottom nav bar but idk if it's possible to customize the nav bar of the nav suite scaffold.

hey there bottom part background is blur with every image how i will do that UI in jetpack compose ?

I'm trying to figure which dependency brings in the scrollbars on desktop targets but im lost. In the IDE i see that the

ScrollbarAdapter

are contained within

org.jetbrains.compose.foundation:foundation-desktop

but when i check the sources of that artifact the code is different (and they dont contain the scrollbar stuff) Any ideas in which artifact are the sources of

compose-multiplatform-core

released? link on github is https://github.com/JetBrains/compose-multiplatform-core/blob/jb-main/compose/found[…]skikoMain/kotlin/androidx/compose/foundation/Scrollbar.skiko.kt

Hi, i am working on grid reorder functionality based on this demo https://cs.android.com/androidx/platform/frameworks/support/+/androidx-main:compose/[…]/androidx/compose/foundation/demos/LazyGridDragAndDropDemo.kt. It works fine with this example, but I need to get this working with Compose 1.6.3 (because of some external dependencies). Issue is, there's no

requestScrollToItem

in that version of Compose, so I trying to use it with

scrollToItem

- it however behaves differently in some cases, reorder looks wonky etc. Is there a way for me to get

requestScrollToItem

in my older Compose version?

What is the difference between

androidx.compose.material3:material3-window-size-class

and

androidx.compose.material3.adaptive:adaptive-

? They both seem to contain code for determining window size classes.

During testing: in one of my composables I have

val scope = rememberCoroutineScope()

and If I log

scope.coroutineContext[CoroutineDispatcher]

I can see that its a ~_FlushingDispatcher_ But later on when I do

scope.launch { .. }

and check, suddenly the thread being used is: DefaultDispatcher-worker-5 @coroutine#238 Can anyone explain? The tests are being run on the JVM with

runSkikoComposeUiTest

.

A newly generated shared UI (Android, Desktop, iOS) project that started in the wizard is now throwing “module not found composeApp” whilst trying to run iosApp on the simulator - nothing obvious has changed according to the commits, certainly nothing project or gradle related, but same on two different machines. I’ve tried cleaning, zapping gradle caches, restarts etc - I’m assuming it’s build process related but struggling to see what’s changed - just a couple of shared .kt files have been added 🤷

Text question Can I draw a unicode character without it's ascender and descenders? Let's say I want to fill a Box {} with the letter

A

but I don't want any of the white space that is there for other letters. In my real example I'm using unicode characters, all of which is of the same size, but I don't want the whitespace I'm getting I.e. can I draw the glyph itself somehow.

I'm working on chat UI. I'm looking at

Jetchat

sample I want to keep scroll at 0 (if it was at 0) when new messages are inserted

val listState = rememberLazyListState()
SideEffect {
    if (!listState.canScrollBackward) {
        listState.requestScrollToItem(index = 0) <------------------
    }
}
LazyColumn(
    ...
    state = listState,
    ...
) {
    ...
}

this seems to do the trick. However, I also have a next screen (image message detail). If I navigate there, and then back, the chat screen composable is "instantiated" again, therefore triggering

SideEffect

lambda, and resetting the scroll -- which is not what I want -- the scroll offset should be kept (which it does by default, but then I don't get that "keep scroll at 0" behavior) Any clean way around this other than hacks?

Has anyone attempted to pause an infinite animation? The

InfiniteTransition

doesn’t have a pause/stop function. In the past I achieved it by using a

while

loop inside of a

LaunchedEffect

and manually updating an

Animatable

instance. This feels a little clunky and I wonder if there is a proper API I should be using.

Sorry to necromance this y'all. But using

SideEffect

has a quirk that the lambda gets triggered when there was navigation (backstack.push), and than back again to the list screen; and user expects the scroll to be kept as was -- but here,

SideEffect

fires again, thuss resetting the scroll.. any idea what to do about it?

Why does

LazyColumn

do a “double step” scroll when calling

animateScrollToItem (0)

? I would expect one smooth scroll like recycler used to do.

Since I dont know when, ModalBottomSheets drag handle shows a square ripple when you touch it. Is this intentional or a bug? I just stumbled upon it in my app, and honestly a bit baffled by it even though I get the rationale behind it..

Does this mean that with 1.9 Jetpack Compose will be the sole implementation of Compose across all targets, with Desktop, Web, etc... specific code being provided by Jetbrains?

Why is

androidx.compose.material3.windowsizeclass.calculateWindowSizeClass()

in

skikoMain

and not

commonMain

in

material3-window-size-class

1.9.0-alpha03

? I had to duplicate the function in my app's

commonMain

If I have a

TextField

and I enter a screen, it doesn't have focus, no keyboard is opened. If I tap it, it gets focused, keyboard opens. If I close the screen, and then come back to it again, focus is somehow preserved, and keyboard opens automatically I don't want that (for a chat ui).

I want the keyboard to never auto-open when I enter the screen.

Any way to fix this? I'm trying the

keyboardOptions.showKeyboardOnFocus = false

but doesn't seem to have an effect I think it's that the focus is preserved somehow across screen boundaries. Is there a way to scope it?

Hi, We are using Jetpack Navigation dialogs. The dialogs has a viewmodel with his state. But when I close my app an reopens it, my state is gone (Dialog just reopens with a clean state). How should I fix that?

hi all, does anyone know how i can remove the padding above the keyboard (see image) in a WebView text input. here's the code i have:

Column(Modifier.fillMaxSize()) {
        WebView(
            state = webViewState,
            modifier = Modifier.windowInsetsPadding(WindowInsets.safeDrawing).fillMaxSize()
        )
    }

if i use the following modifier, the keyboard covers the webview's text input:

modifier = Modifier.padding(WindowInsets.statusBars.asPaddingValues()).fillMaxSize()

Hi everyone, I'm familiar with swiftui and learn compose however at present I face a difficulty in updating UI since i don't know how the rendering works!! Im currently trying to show user's location on map with icons using stateflow<list<Person>> however nothing shows up on UI? can someone here tell me the right approach when using this?

Hi Everyone, do anyone have any idea how to use webviews in Compose Multiplatform. I am looking for any solution that works on both ios and Android.

Is it a known issue that the M3 Datepicker on Landscape mode is buggy? Or am I doing something wrong? 😅 This is using CMP 1.9.0-alpha03 on Android

How to get pan, zoom and rotation velocity with custom

detectTransformGestures

? I tried to use

val zoomVelocityTracker = VelocityTracker()
zoomVelocityTracker.addPosition(elapsedTimeMillis, Offset(totalZoom, 0f))

but got wrong velocity which is very small

Is it possible that applying

val colorModifier = Modifier.background(CustomColor)

in a Surface

Surface(modifier = colorModifier) {...}

Show a different color than in a Box

Box(modifier = colorModifier) {...}

Not sure what could be the reason behind it but I am having this behavior where the color on the surface looks a bit more whitish. For a bit more context. It is a Composable very deep in the Composable tree, a leaf in the tree basically.