kotlinlang #compose

Is Compose UI version supposed to diverge from other artifacts in the compose group? I ask because recent IDE versions seem to define version variable in gradle build files only for compose_ui_version.

:yes: 1

Slackbot

05/18/2022, 8:03 AM

This message was deleted.

Alexander Maryanovsky

05/18/2022, 8:15 AM

How do I create a bounce animation? I want to scale some text to 1.2 and then back to 1.0, with spring animation both ways.

Michał Diner

05/18/2022, 9:09 AM

Hello there! We’re getting a few crashes with ResourcesNotFoundException:

Fatal Exception: android.content.res.Resources$NotFoundException: Resource ID #0x7f08024a
       at android.content.res.ResourcesImpl.getValue(ResourcesImpl.java:215)
       at android.content.res.Resources.getValue(Resources.java:1316)
       at androidx.compose.ui.res.PainterResources_androidKt.painterResource(PainterResources_androidKt.java:61)
       at x.x.x.presentation.x.ComposableSingletons$xKt$lambda-1$1.invoke(x.kt:66)
       at x.x.x.presentation.x.ComposableSingletons$xKt$lambda-1$1.invoke(x.kt:40)

It’s a simple usage of Image with

painterResource

. Any ideas? 😬

Slackbot

05/18/2022, 12:58 PM

This message was deleted.

Brian Norman

05/18/2022, 1:03 PM

Using Coil to load an image in Compose, and trying to fit the image into a box with a height < heightOfImage. Anyone know of a way to make the Coil crop bias towards cropping the top portion of an image, so that the bottom of the image is kept? I tried a custom shape to use in

Modifier.clip()

like:

val preferBottomContentShape = GenericShape { size, _ ->  
    moveTo(0f, size.height - desiredHeightPx)
    lineTo(size.width, size.height - desiredHeightPx)
    lineTo(size.width, size.height)
    lineTo(0f, size.height)
}

But the issue there is that there is left over whitespace from the background where the top of that image used to be

Afzal Najam

05/18/2022, 5:41 PM

Is there a

calculateWindowSizeClass

equivalent for non-activities? We’re using a fair bit of

AbstractComposeViews

, leveraging interop capabilities and so activity instance isn’t available without casting the

Context

👀 Is this not enough? Or does rememberWidthSizeClass provide something else that this doesn’t?

@Composable
fun getWidthSizeClass(): WidthSizeClass {
    val configuration = LocalConfiguration.current
    val windowDpSize = configuration.screenWidthDp.dp
    return when {
        windowDpSize < 600.dp -> WidthSizeClass.COMPACT
        windowDpSize < 840.dp -> WidthSizeClass.MEDIUM
        else -> WidthSizeClass.EXPANDED
    }
}

allan.conda

05/18/2022, 6:09 PM

Is it expected that

HorizontalPager

immediately composes adjacent pages other than the current page? I don’t want my

LaunchedEffect

to run if the page is not visible yet, or is it expected that I check for

pagerState.currentPage

Fanilog

05/18/2022, 6:44 PM

I’ve a question related to Compose and Coroutine. Would it be an issue doing something like this

//TOP level composable of the app
with(LocalLifecycleOwner.current) {
    lifecycleScope.launch {
        navigationManager.navigationEvents
            .flowWithLifecycle(lifecycle, Lifecycle.State.STARTED)
            .collect { navigationDirection ->
            //Listening to navigation event
            navController.navigate()...          
            }
    }

Or should I do it in LaunchEffect ? Since Compose function can execute in any order, I wanted to avoid to have it a LaunchEffect and use a replay parameter of a Flow. (eg: Sending a event before the collection,)

Manojna Chintapalli

05/18/2022, 7:28 PM

Hi! I am trying to achieve something like this - a camera icon on top of a circular image, I already have the circular image in place, but I am not sure how to place the icon on top of it using compose. Any ideas or helpful links are appreciated. Thanks!

Sterling Albury

05/18/2022, 7:52 PM

working on a composable and would like some feedback. doing a TopAppBar with this content:

Row(
                modifier = Modifier
                    .fillMaxWidth(),
                horizontalArrangement = Arrangement.SpaceBetween
            ) {
                leftHandContent(
                    Modifier
                        .wrapContentWidth()
                )

                Text(
                    modifier = Modifier
                        .wrapContentWidth()
                        .align(CenterVertically)
                        .weight(1F, fill = true),
                    text = appBarTitle,
                    color = topBarPrimaryColor,
                    fontWeight = FontWeight.Bold,
                    fontSize = 22.sp,
                    textAlign = TextAlign.Center
                )

                rightHandContent(
                    Modifier
                        .wrapContentWidth()
                )
            }

I would like the Text to be in the center of the bar but also be constrained by the left and right hand content. If one of the content items is missing, then I'd still like the text to be centered in the row. Considering a couple of options here. I briefly tried using a Box and using the align modifiers for the content items, but the text wasn't getting constrained like i wanted and got some overlap with the contents. trying to not use the constraint layout. Was looking at a custom layout and using some vertical baselines but not very familiar with using those objects. Any thoughts?

brabo-hi

05/18/2022, 9:03 PM

Hi all, coud we use markdown with

Text()

fengdai

05/19/2022, 5:10 AM

In the view system, a child view in a FrameLayout can be bigger than its parent, and be clipped to show only part of its content. How can I achieve this effect in Jetpack Compose?

allan.conda

05/19/2022, 6:59 AM

We can’t preload the list in compose so situations like Image grid UX is not good. Does anyone have a workaround around this?

Rene Win

05/19/2022, 9:01 AM

Hello, i have an issue with screen reader and jetpack compose: When I'm using Modifier.testTags the screen reader order is not correct (detail3 is marked instead of detail1) when navigating to a other screen - see code and video below: Some notes on the code (I can provide the whole application if necessary): Home is the root view with just some text and a button, which opens the detail composable

@Composable
fun Home(navController: NavController) {
    Column(
        modifier = Modifier.testTag("hometag")
    ) {
        Text("home1")
        Text("home2")
        Button(onClick = {
            navController.navigate("detail",
            )
        }) {
            Text("NEXT")
        }

    }
}

@Composable
fun Detail(navController: NavController) {
    Column(
        modifier = Modifier
            .testTag("detailTag")
    ) {
        Text("detail1")
        Text("detail2")
        Text("detail3")
    }
}

Is there something I can do against that behaviour? Thanks in advance!

recording.mp4

Fanilog

05/19/2022, 9:30 AM

Hello trying to dig a bit more in compose and I’m not really sure. Despite having the remember returning me the job, is there another difference ?

val lifecycleOwner = LocalLifecycleOwner.current
LaunchedEffect(key1 = lifecycleOwner) {
    launch {

and

val lifecycleOwner = LocalLifecycleOwner.current
remember(key1 = lifecycleOwner) {
    with(lifecycleOwner) {
        lifecycleScope.launch {

dimsuz

05/19/2022, 12:53 PM

We have released a set of Detekt rules which help us find common errors while working on Compose code. For now there are few rules there, which seem more or less generally applicable (of course, they can be turned on/off individually if they don't work for you): https://github.com/appKODE/detekt-rules-compose

🎉 3

FunkyMuse

05/19/2022, 1:24 PM

hey guys, is there a way to have a context receiver being a Composable function?

context (Composable)

Rajat Singh Jasrotia

05/19/2022, 3:12 PM

Hey Guys, Could you please help as how can I place a frame over an image in compose as shown in attached figure?

Hamza GATTAL

05/19/2022, 3:17 PM

Hi everyone It's my first time using compose I want to implement the splash screen API My question is how I can do it

mcpiroman

05/19/2022, 3:37 PM

My `value class`wrapping `String`always causes parameter to be `unstable`(as per `plugin:androidx.compose.compiler.plugins.kotlin:metricsDestination`option), even though https://issuetracker.google.com/issues/144582214 is

fixed

, so it should be inferred as stable. Can I somehow make it became stable?

Francescos

05/19/2022, 4:50 PM

Is it correct that

NavBackStackEntry.savedStateHandle

is a complete different object from the

SavedStateHandle

object injected from Hilt in the corresponding route

ViewModel

mattinger

05/19/2022, 4:57 PM

Has anyone been able to test a dropdown style control? We built a control with a card, that when you click on it would display a DropdownMenu for the user to pick items from (think the Spinner in the XML world). However, when i’m trying to test it in the robolectric environment with a ComposeTestRule, i can perform the click, but i can never do anything else, presumably because the idler things that compose is still doing something. As a result, it just sits there on the next call to

onNode

type functions. As a side note, it works in an espresso test, just not robolectric.

Chris Fillmore

05/19/2022, 6:33 PM

Could someone help clarify this statement in the docs, re:

centroid

https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/package-summary#(androidx.compose.ui.i[…]olean,kotlin.Function4)

onGesture
will also provide centroid of all the pointers that are down.

Are the centroid coordinates relative to the display? The window? Something else?

Landry Norris

05/19/2022, 9:25 PM

I don’t see a separate channel for decompose, so I’ll ask my question here: I have a Component that has several instances of the same sub-component, which will get rendered in a Column. Each one has fairly complex logic and is independent from the others, so I’m thinking one Component class, and an array of instances. I can see here that I should use childComponent with a unique key. Is there a good way to create an array of childComponent built in, or should I have the keys be Bar0, Bar1, Bar2, etc?

Zoltan Demant

05/20/2022, 4:22 AM

Has anyone else started seeing more and more

Fatal Exception: java.lang.IllegalArgumentException: end cannot negative. [end: -1]

since one of the recent compose (alpha/beta) releases?

➕ 1

Eko Prasetyo

05/20/2022, 4:28 AM

Hi everyone, does anyone ever facing laggy issue when using navigation-animation libary from accompanist? Is there any way to optimize that?

05/20/2022, 4:31 AM

I'm having a crash caused by navigating from a screen containing a lazy column to another one, then navigating back. The stack trace doesn't point to any of my code so I'm not sure what's going on

stack.txt

Jan Skrasek

05/20/2022, 7:02 AM

API design: I have rather complex composable component taking multiple slots arguments. Is it better to have: • main slot named

content

and having it as the last one, or • make that slot rather named by its function and sort slots differently? The second option seems more suitable, but only if there is another non slot argument as the last one, otherwise it would expose the last slot as trailing lambda, which is not good. What do you think?

Stylianos Gakis

05/20/2022, 7:03 AM

I was looking at the UI events documentation here and I have once thing I am confused about which I’d love to discuss here. In the last code snippet of the linked section, right under “causing another UI state update:“, in the compose version, we’re looking at

viewModel.uiState.userMessages

inside the LaunchedEffect, but with no mechanism to ensure that this only happens when the app is in the foreground. Wouldn’t this mean that if I were to press home on my device, and right as I do that a message appears, this would trigger normally, and I would miss that message. On the contrary, in the View version, we’re using the

repeatOnLifecycle

API to make this work correctly. Maybe this has to do something with the fact that we’re using a

State<T>

object inside the VM in that sample instead of a

[State]Flow

and there’s some interaction I don’t understand, but I still think this would happen in the background even with that approach. p.s. I really wish the docs followed the more “common” pattern of having a StateFlow inside the VM instead. Or at least show how you’d have to approach this problem with both

State

and

StateFlow

in the VM.

Title

Stylianos Gakis

05/20/2022, 7:03 AM

viewModel.uiState.userMessages

repeatOnLifecycle

API to make this work correctly. Maybe this has to do something with the fact that we’re using a

State<T>

object inside the VM in that sample instead of a

[State]Flow

State

and

StateFlow

in the VM.

I remembered that tivi has a convenience function here named rememberStateWithLifecycle which does exactly what I am looking for. But the sad part is that, I can almost see myself almost always preferring that one over the normal

.collectAsState()

extension on

StateFlow

. There’s very few cases where I’d purposefully allow the state to be collected in the background (they exist, but by default I want the

rememberStateWithLifecycle

approach).

Went ahead and posted this in nowinandroid too to potentially get some official examples inside a real app. I think there’s some room for improvement around the communication of how this very common issue should be solved.

Colton Idle

05/25/2022, 1:54 PM

@Manuel Vivo What do you think about "but with no mechanism to ensure that this only happens when the app is in the foreground. Wouldn’t this mean that if I were to press home on my device, and right as I do that a message appears, this would trigger normally, and I would miss that message." I think @Stylianos Gakis brings up a good point that I didn't think about?

🤗 1

Manuel Vivo

05/30/2022, 8:49 AM

Definitely! Thanks for raising this. We already started working on this :D https://android-review.googlesource.com/c/platform/frameworks/support/+/2102573/

Stylianos Gakis

05/30/2022, 9:20 AM

Wow thank you SO much Manuel, yes this is exactly what I had in mind! Is this something that you’ve had on your todo list after making the initial UI event docs or was it a result of community feedback? I am just curious 🤔 It would be an amazing combo if once this is merged, you managed to get an example of using this in now-in-android repo too!

Manuel Vivo

05/30/2022, 10:19 AM

We’ve been having these conversations for a long time already. But the work is materializing now 🙂

Stylianos Gakis

05/30/2022, 10:24 AM

Nice, super happy to see it coming together!

🙌 2

Colton Idle

06/02/2022, 9:13 AM

Manuel published this yesterday. I haven't read it... but maybe related @Stylianos Gakis? https://medium.com/androiddevelopers/viewmodel-one-off-event-antipatterns-16a1da869b95

Stylianos Gakis

06/02/2022, 9:41 AM

No, not quite touching on the

collectAsState

collectAsStateWithLifecycle

problem, since that one is not out yet I guess they are not going to be talking about it yet. In fact, in the last snippet, the compose and View alternatives are not functionally equivalent since one reads the state in the background as well while the View alternative uses repeatOnLifecycle as one should. I hope that once the

collectAsStateWithLifecycle

hits alpha/beta this article will be updated and all future ones will take it into consideration. A good article nonetheless, I read it before and it was a nice read.

View count: 9