Anybody have any tips for converting a

class

to a

@Composable fun

? I can't quite conceptualize it and for the most part I'm writing imperative UI with compose

When move movable content (

movableContentOf

) from/to a

SubcomposeLayout

, the

AndroidView

within it will recreate its view.

// When rotate screen, AndroidView recreate its view
val content = remember {
    movableContentOf { isLandscape: Boolean ->
        AndroidView(factory = { context ->
            Log.d("AndroidView", "create view")
            TextView(context).apply {
                layoutParams = ViewGroup.LayoutParams(MATCH_PARENT, MATCH_PARENT)
            }
        }) {
            it.text = if (isLandscape) "Landscape" else "Portrait"
        }
    }
}
val isLandscape =
    LocalConfiguration.current.orientation == Configuration.ORIENTATION_LANDSCAPE
BoxWithConstraints {
    if (!isLandscape) {
        content(false)
    }
}
if (isLandscape) {
    content(true)
}

Is this expected?

Hey folks! Does anybody know if there’s a way to detect any user interaction (taps/clicks anywhere on the screen) within a Compose app? I tried using a container Composable with

pointerInput

, but that only works when I interact outside of buttons. Basically, what I need is a Compose version of the

onUserInteraction()

Activity callback.

Hi. I am playing around with navigation in compose, but with no known pages. The idea is to have only one route

page/{pageName}

and then use

pageName

to to render the correct data. I mostly wanted to use navigation because of the built in backstack

@Composable
fun NavigationTest() {
    val navController = rememberNavController()
    Scaffold(
        bottomBar = { SimpleBottomNav(navController) }
    ) { innerPadding ->
        NavHost(navController, startDestination = "page/{pageName}", Modifier.padding(innerPadding)) {
            composable(
                "page/{pageName}",
                arguments = listOf(navArgument("pageName") { defaultValue = "profile" })
            ) { backStackEntry ->
                val pageName = backStackEntry.arguments?.getString("pageName")
                if (pageName != null) {
                    PageContent(name = pageName)
                } else {
                    Text(text = "No page name")
                }
            }
        }
    }
}

See

SimpleBottomNav

code in the comments. The main issues that I have is that 1.

popUpTo()

does not seem to work properly when the startDestination has an argument in it and 2. the compose context seems to be shared between the different pages. E.g. when i use a LazyList in them, they all share the same scroll state. Did anyone ever have the same issues or has a working example for something similar?

I know when we need to remember something that doesn’t need to then be mutated, we can simply wrap it in a remember without the mutableStateOf, like

val item = remember(someKey) { ExpensiveConstructedThing() }

instead of

val item by remember(someKey) { mutableStateOf(ExpensiveConstructedThing()) }

However after reading about this very informative article and some official docs, to my understanding when we use

by

on the state object, we get the neat effect of not reading the value at that moment, but deferring the read to whenever we actually need it. Which sometimes comes with the nice side-effect or reading that state object in a “smaller” recomposition scope meaning that when it changes we don’t invalidate the wider recomposition scope that the above definition may be in. So if we do not do this, but use simply

val item = remember(someKey) { ExpensiveConstructedThing() }

do we lose this nice side effect? When

someKey

does change, and the result of

item

changes with it, will it invalidate the recomposition scope in which it is declared in as opposed to where it is actually read?

What would be the best way to react to

mutableStateListOf

changes in effects? Say, I have

Parent

which has state

remember { mutableStateListOf<Int>() }

which can be changed by one of its children.

Parent

also has an effect (let’s say

DisposableEffect

) reading changes to the list, like

DisposableEffect(list){/* ... */}

. But that effect won’t be called more than once, because

list

won’t change instance (

SnapshotStateList

), even if items are added.

When a library starts to use jetpack compose for some of its UI components, do all apps using the library have to setup compose dependencies as well?

We’re struggling to achieve Zoomable Images in a Pager since Pager steals all the touches and

pointerInput

seems doesn’t have the pointer id to detect the number of pointers on screen. Anyone tried anything similar? We can’t find an open-source code or snippet available so far.

Why using AndroidComposeTestRule and ComposeTestRule in the same test class is not possible?

Is there a way to pin a

LazyList

item so it doesn't get removed when it goes out of bounds? This would allow scrolling when reordering the items in a list (at least looking at my implementation). I see there are

PinnableParent

,

PinnableParent.PinnedItemsHandle

,

lazyListPinningModifier

,

ModifierLocalPinnableParent

and so on, but I couldn't find any example.

I’m facing very good problem :internet-problems: I’ve AndroidView which contains EditText. I’m not hoisting the state instead letting editText hold its own state. But sometimes I want to set text from out side, lets say I want to undo the last text so how do I do it?

How to call functions inside AndroidView or AndroidViewBinding composable? In the old view system if I needed to update multiple views in multiple places, I simply created a function for that:

private fun updateViews(value1: Int, value2: Int) = with(binding) {
    timelineTextView.text = "$value1, $value2"
    ... A lot of other stuff

}

How is that possible when using the AndroidViewBinding Composable?

@Composable
fun MainScreen(){
    AndroidViewBinding(ActivityPlayBinding::inflate) {
        playButton.setOnClickListener {
            updateViews(value1, value2)
        }

        playButton2.setOnClickListener {
            updateViews(value1, value2)
        }
    }
}

How can I call that

updateViews

function in Compose? Simply putting the content of updateViews function where the function gets called feels really bad cause that causes a lot of duplicate code. But I cant seem to find the right way to do it…

Is there an implementation available now that you can recommend for staggered grids with lazy?

Any simple way to draw this kind of code

TextField

? Two ideas in mind: • Using N

TextField

• Drawing a canvas above the actual

TextField

Wondering if there's no better way to do this

Hello all. Just getting starting with compose navigation, trying to set my general app structure. I will have some main screens to handle app setup for the user and authentication. Once authenticated I would like to navigate to the home screen, which has a bottom navigation in a scaffold. I am trying to do this with 2 NavHosts, which means I need to nav controllers. Everything works fine from the main screen to the home screen, but upon navigation from home back to main (simulated logout), if I try and go back to the home screen I get

ViewModelStore should be set before setGraph call

Code in comments

I'm making a simple TextField

VisualTransformation

to ignore blank spaces, but when I tap the space bar multiple times and then I try to undo the typing it's counting all the blank spaces that were ignored, as seen in the video. Also, when I type two blank spaces it transforms them into a "." character. Any idea what I might be doing wrong?

val ignoreBlanksVisualTransformation = VisualTransformation { text ->
    val blanksCount = text.text.count { it.toString().isBlank() }
    val transformedText = text.text.filterNot { it.toString().isBlank() }

    TransformedText(AnnotatedString(transformedText), object : OffsetMapping {
        override fun originalToTransformed(offset: Int) = offset - blanksCount
        override fun transformedToOriginal(offset: Int) = offset + blanksCount
    })
}

Is there any way to obtain the scroll position in pixels for a LazyListState?

Are there any tricks to testing

LaunchedEffect

as far as

TestDispatcher

is concerned? I'm trying to

advanceTimeBy

past a

delay

in a

LaunchedEffect

but that isn't working because the dispatcher is a

AndroidUiDispatcher

(or

FlushCoroutineDispatcher

in desktop). As far as I can tell, the only way around this is to create a new context (

launch

,

withContext

, etc...) that uses the

TestDispatcher

. Is that correct, or am I missing something?

Hello, I am having a problem with Ime paddings and

BottomSheetDialogFragment

. It looks like ime padding is not applying on APIs 29 and lower.

What would be the consequences of not

remember

-ing

backCallback

in the following? In other words, why

remember

backCallback

?

@Composable
fun BackButtonHandler(
  enabled: Boolean = true,
  onBackPressed: () -> Unit
) {
  val dispatcher = localBackPressedDispatcher.current ?: return
  val backCallback = remember { // <--- HERE
    object : OnBackPressedCallback(enabled) {
      override fun handleOnBackPressed() {
        onBackPressed.invoke()
      }
    }
  }
  DisposableEffect(dispatcher) {
    dispatcher.addCallback(backCallback)
    onDispose {
      backCallback.remove()
    }
  }
}

In Composable, how can we let some portion of the child view to inflate outside the parent’s bound. Kindly help.

Why is Modifier.statusPadding() is not working in compose 1.2beta02 -> 1.2beta03

Has anyone updated Kotlin to 1.7.0 in Electric Eel Alpha 03? I am having problems in my Compose project to update. Error: This version (1.2.0-alpha09) of the Compose Compiler requires Kotlin version 1.6.21 but you appear to be using Kotlin version 1.7.0 which is not known to be compatible. Please fix your configuration (or

suppressKotlinVersionCompatibilityCheck

but don't say I didn't warn you!).

Hi everyone, I 'm developing a music player app using compose But I want to detect if user has touched or moving the slider component so I can stop playing music and update the slider value upon the user moves. But ths Slider in compose has only onValueChange listener that has been fired after user changes the slider value not while changing the value. How can I solve this problem?

A11y - Screen Reader I use clearAndSetSemantics to change the order of / and combine two texts. This works great if I swipe with the screen reader to this column but I cannot select the elements / column anymore to read it out loud. When I press I hear another sound than pressing empty space but the element is not selected and not read out. Is this a bug / intended behaviour or do I miss something here?

val value = "value"
val label = "label"
Column(modifier = Modifier.clearAndSetSemantics { contentDescription = "$label: $value" }) {
    Text(value)
    Text(label)
}

Any ideas how to set dim in Popup Compose? In Dialog we have dim alpha from android:backgroundDimAmount, but Popup doesn`t exist

Looking for a good way to draw a 45deg linear gradient. Came across this SO, but wondering if there’s a more up-to-date alternative 🤔

Folks, is there any easy way to animate the

Brush

object? At least for

SolidColor

?