I've got a silly question. I have a state that have a default value passed as parameter. In general, I want to be managed inside the component, but if the default value is changed, I wand inner state to be reset to the new default value. Which is the simplest way to do that? Construct like this works, but it looks ugly:

var cachedValue by remember { mutableStateOf(initialViewPoint) }
    var viewPoint by remember { mutableStateOf(initialViewPoint) }

    if (cachedValue != initialViewPoint) {
        viewPoint = initialViewPoint
        cachedValue = initialViewPoint
    }

Hi everyone, I have a question. How can we get all compose views like TextView from activity or fragment?

LazyList sometimes gets in a state where it keeps requesting an item very far outside of view. Is this a bug or something that can be avoided? more info-->

Hi all, imagine you have a list of things and once you click one, some action is triggered, with the following things to respect: First, the click action is delayed by some amount of time, and secondly, while the delay is running, no other thing can be clicked. I implemented that basically like this: https://gist.github.com/realdadfish/508fbc9368722831faf8990236b6c06c. My initial issue was that I was doing enabling and disabling of the global enabled state in one effect, but this didn’t notify the other composables that they should disable themselves, so I split it in two launch effects, with yet another mutable state. Question is now - this looks horrendous and I certainly must oversee something, like being able to resume composition while the first effect is sleeping for the delay, right?

I was looking at my app’s method trace for something, and noticed compose methods are sometimes getting called twice. Is this because of the recomposition? Is it normal to have duplicate calls like this?

Is there a way I can get the screen height in pixels,

LocalConfiguration.current.screenHeightDp.dp.toPx()

is doing some rounding and I get errors when comparing with

Offset

from

LayoutCoordinates

.

I have another question. I have a composable function defining some geometries. Is there a way to "remember" it and avoid recomposition?

Hello, how can I use the new

drawText

of Canvas? Couldn’t find resources for how to use it. Thanks!

Is there any way to know if a backdropScaffold is being opened or closed? I only know when the process is finished with if - or not- concealed using backdrop scaffold state. I want to observe the change as it happens

Is it on purpose that

navHostController.graph

returns a different graph than

navHostController.currentDestination.parent

?

Sorry for some math here. But you can ignore and focus on Canvas methods 🙂

partitions.forEach { partition ->
    val sweepAngle = partition.sweepAngle

    // Draw Circle
    drawArc(
        startAngle = startAngle,
        sweepAngle = sweepAngle,
        size = arcSize,
        progressBrush = partition.style,
        strokeWidthInPx = progressStrokeWidthInPx
    )

    // Draw Snippet
    val snippet = partition.snippet
    if (snippet != null) {
        val snippetText = snippet.text
        val snippetBackground = snippet.background

        val textWidth = snippetText.rect.width()
        val textHeight = snippetText.rect.height()
        val padding = snippetBackground.paddingInPx

        val angleMidpoint = startAngle + (sweepAngle / 2)
        val angleMidpointInRadians = angleToRadian(angleMidpoint)

        val snippetWidth = textWidth + (padding * 2)
        val snippetHeight = textHeight + (padding * 2)

        // Find polar coordinates of snippet center and convert them to cartesian coordinates
        // A great source for learning about coordinates: <https://varun.ca/polar-coords/>
        val snippetCenterXCoordinate =
            centerX + (((progressStrokeWidthInPx + snippetWidth) / 2) + radius) * cos(angleMidpointInRadians)
        val snippetCenterYCoordinate =
            centerY + (((progressStrokeWidthInPx + snippetHeight) / 2) + radius) * sin(
                angleMidpointInRadians
            )
        // Calculate the snippet so it is drawn based on its center points
        val snippetXCoordinate = snippetCenterXCoordinate - (snippetWidth / 2)
        val snippetYCoordinate = snippetCenterYCoordinate - (snippetHeight / 2)

        val textXCoordinate = snippetXCoordinate + padding
        val textYCoordinate = snippetYCoordinate + textHeight + padding

        // Snippet background stroke
        val snippetStroke = snippetBackground.stroke
        if (snippetStroke != null) {
            drawRoundRect(
                brush = snippetStroke.style,
                x = snippetXCoordinate,
                y = snippetYCoordinate,
                width = snippetWidth,
                height = snippetHeight,
                style = Stroke(width = snippetStroke.widthInPx),
                cornerRadiusInPx = snippetBackground.cornerRadiusInPx
            )
        }

        // Snippet background fill
        drawRoundRect(
            brush = snippetBackground.style,
            x = snippetXCoordinate,
            y = snippetYCoordinate,
            width = snippetWidth,
            height = snippetHeight,
            style = Fill,
            cornerRadiusInPx = snippetBackground.cornerRadiusInPx
        )

        drawLine(
            Color.Red,
            start = Offset(centerX, centerY),
            end = Offset(textXCoordinate, textYCoordinate)
        )
        drawLine(
            Color.Green,
            start = Offset(centerX, centerY),
            end = Offset(snippetCenterXCoordinate, snippetCenterYCoordinate)
        )

        // Snippet text
        drawText(
            x = textXCoordinate,
            y = textYCoordinate,
            value = snippetText.value,
            style = snippetText.style
        )
    }

    startAngle += sweepAngle
}

Is there a way to morph one

Path

into another

Path

? I am trying to animate one shape into another, both shapes are based on

Path

s

Did any of you already get compose 2d scrolling behaviour working, including diagonal scrolling?

How about: Lazy column { LazyRow { Box { Column { Row { Track } } } } } if this offers limitation, than I would go with the layout approach

Hey everyone! 🙂 Keyboard question here! (I know, those are the worst 😞) We have two pretty simple screens. First one has a

ConstraintLayout

with a lottie animation, some text, a text field and a “next” button Second one also has a ConstraintLayout and a bunch of data displayed. When the text field is focused, keyboard shows up, taking up half the screen that becomes scrollable Issue is when clicking the “next” button when the keyboard is shown completely breaks the layout of the next screen I assume the keyboard is still there when the second screen is displayed. Nothing “clean” we’ve tried seems to solve that.

val keyboardController = LocalSoftwareKeyboardController.current

with

keyboardController?.hide()

when clicking the button and before navigating away does absolutely nothing The only approach that seemed to work is to introduce some sort of delay.... Any idea? Much appreciated! 🙏

I’m trying to set the peek height of a bottom sheet dynamically in a

BottomSheetScaffold

. I noticed that you can set a remembered value in

Modifier.onGloballyPositioned()

to the height of a composable. Then you can set the peek height to this value. However, this doesn’t seem to correctly update on recompositions after the initial one. In fact, one needs to swipe away the activity to get it to recalculate the correct peek height. I do know that onGloballyPositioned is supposed to run after composition, but if I change the remembered mutable state used to set the peek height, shouldn’t it recompose again?

How can I dismiss a

DropdownMenu

when it is clicked? Is the only way through

DropdownMenuItem

via its

onClick

? I’ve tried passing

DropdownMenu(modifier = Modifier.clickable …)

but this doesn’t have any effect that I can see.

Hello everyone... I'm really struggling with some strange problem in Compose... I have a List in a ViewModel and a LazyList in the View. Sometimes I need to modify an element inside the list... Everything works fine when you stay on the screen... but ... when you go to another screen and then go back - the list is in stale/inconsistent state showing not the state when you left the screen.... Can anyone help me with some advice? Code example and my question: https://stackoverflow.com/questions/73724057/jetpack-compose-changes-state-of-the-list-in-lazylist-is-broken-after-returning

Colors are to help differentiate, the cyan is for the parent column in the layout and the red is the lazy column itself

hey is the compose source on github or something?

Hello everyone... I how to change custom properties in KeyAttributes. I want to change my textColor black at 0 %, transparent at 50%, and white at 100% but I could find syntax json5. Can anyone help me with some advice? this is my motion_scene.json5 file https://gist.github.com/YusufbekIbragimov/24718c29cd6c3d262a53970d4d593a4d

Hello my people! We have a problem with navigation and passing arguments. In our app, we use MVVM with clean usecase/repository patten with the Google Navigation for Compose. In screen A we can run a search and get back a list with results. These results are from the backend and they are temporary results (aka they have no specific id's to recreate a specific result). If we open a detail page for such a search result, lets say screen B, we need to pass the search result from A to B. Screen A is part of a screen with bottom navigation. So the hierarchy is MainNavHost -> BottomNavigationNavHost -> A Screen B is not part of this screen, so it lives directly in the MainNavHost. My question: How can I open Screen B from screen A, and pass the data? I can't pass an id for the specific result (so I can't retrieve it), and in theory I shouldn't pass an object into the navigation graph. I was thinking about making an activity scoped ViewModel, pass the object there and if the screen B observes that object but there is none, close the screen. However, this is not recreation friendly at all. So for now we will just bubble up the event through the compose tree, serialize the search result into a string and pass it as a navigation argument to open screen B where we deserialize the navigation argument. Does anyone know a better solution?

morning, I'm considering using

CompositionLocalProvider

as a way of exposing a cast icon in my app, so that I can easily override it in my tests whilst also hiding how the cast icon is created from the many screens in my application. Would this be considered acceptable from a practice point of view? Also, is there actually a 'compose first' way to do casting?

When I have this bit of code

MyComposable(state, onClick = { someObject.sendEvent() })

and

state

is immutable, but

someObject

is not `Stable`/`Immutable`, (for example it can be a

ViewModel

or

Presenter

) this leads to constant recompositions, because

onClick

is not considered a

Stable

lambda. I confirmed this: my code stops constantly recomposing

MyComposable

if I make

onClick

empty. What is the recommended refactoring to avoid such issues? Marking

someObject

as Stable is not always possible or often incorrect.

When I try to run UI tests on my

jvm

Compose Project, I immediately get an exception

'void org.jetbrains.skia.paragraph.ParagraphStyleKt._nSetTextIndent(long, float, float)'
java.lang.UnsatisfiedLinkError: 'void org.jetbrains.skia.paragraph.ParagraphStyleKt._nSetTextIndent(long, float, float)'
	at org.jetbrains.skia.paragraph.ParagraphStyleKt._nSetTextIndent(Native Method)
	at org.jetbrains.skia.paragraph.ParagraphStyleKt.access$_nSetTextIndent(ParagraphStyle.kt:1)
	at org.jetbrains.skia.paragraph.ParagraphStyle.setTextIndent(ParagraphStyle.kt:182)
	at androidx.compose.ui.text.platform.ParagraphBuilder.textStyleToParagraphStyle(SkiaParagraph.skiko.kt:776)
	at androidx.compose.ui.text.platform.ParagraphBuilder.build(SkiaParagraph.skiko.kt:566)
	at androidx.compose.ui.text.platform.ParagraphLayouter.<init>(ParagraphLayouter.skiko.kt:71)

as soon as the Composable under test contains a

Text(String)

, so this fails:

class ComposeTest {
    @get:Rule
    val composeTestRule = createComposeRule()
    @Test
    fun firstTest() {
        composeTestRule.setContent {
            Text("Hello")
        }
    }
}

whereas this does not:

class ComposeTest {
    @get:Rule
    val composeTestRule = createComposeRule()
    @Test
    fun firstTest() {
        composeTestRule.setContent {
            Button({}){}
        }
    }
}

Does anyone have an idea what the problem could be?

Call clip(RectangleShape) on your IconButton's Modifier

general question about compose, say you have

@Composable
fun Container() {
    SectionA()
    SectionB()
}

@Composable
fun SectionA() {
    var someState by remember { mutableStateOf(1) }
    //...
    someState = 2
}

@Composable
fun SectionB() {
}

would the whole

Container()

and

SectionA()

and

SectionB()

recompose when changing

someState

? or only

SectionA()

? wondering if there is any potential composition lag if the screen is too large

Are the compose gothas regarding unstable lambdas and data classes generated in a non-compose module not being stable in the compose team radar? This article describes those issues: https://multithreaded.stitchfix.com/blog/2022/08/05/jetpack-compose-recomposition/ I believe compose should as a minimum have lint checks for those or better, just work 🙂

Hello, does anyone know how can i slightly overlap the first two items of a list in compose? The first item will actually be an image configured as collapsable and act as a toolbar, while the second one will be the "beginning of the view". I know i can put two items in a box to overlap them, but since here they belong to a LazyColumn, i don't know how can i do it