Hi, I found an error on 1) Introduction page on the code lab “Layouts in Jetpack Compose” I think in the image, Column and Row are reversed (nothing serious).

Are there plans in future to enhance the scaffold API so that it takes into account various cutouts while going edge-to-edge layouts? Trying on a pixel 4A emulator the camera is positioned such that it overlaps the drawer or the place the title would be present.

i suppose there is no way to get a nice ViewPager experience? where you can swipe from one tab to another?

Anyone else having problems using a ComposeView while enabling minifcation (R8/Proguard)? I am getting the following exception (see thread):

This message was deleted.

Do we have stateful Composables as compared to Stateful and Stateless Widgets in Flutter?

flow.collectAsState("initialState")

requires an initial state (when not using a

StateFlow<T>

. How can we avoid having this initial state? For example, I would like to have a composable not be considered “ready” until the

Flow<T>

emits. By ready, I mean shown to the user. Is something like this possible? The idea would be something like

fragment.postponeEnterTransition(..)

(link) which allows the

Fragment

to asynchronously load its data before appearing to the user. This way an initial state would not need to be provided and only fully loaded data need be displayed

Why is this not working? No text appears in the input field

val inputState: TextFieldValue by mutableStateOf(TextFieldValue())
TextField(value = inputState.value, onValueChange = { inputState = it })

But if I wrap in

remember

than text input starts working. I am asking because Compose State codelab has examples which have only

by mutableStateOf

and no

remember

(for example in ViewModel section), but TextField turns out to be special here?

Using scaffold API if we use a drawer. is it expected that the drawer would be opened when scrolled from midway in the screen? Example Video: I have enabled the screen taps to showcase where the drag was being made from. Is this expected behavior. I understand that now since the edge of the screen is used for gesture navigation however if the drawer opens from anywhere wouldn't it be a wrong behavior? Note: Pasting code in comments

Random exception

Is there any way to make the clickable region larger than the icon without making the icon size bigger? I want to achieve a borderless ripple effect and easier clicking. Maybe some modifier? Is there an analogy to the 

selectableItemBackgroundBorderless

 attribute? Thanks.

Hey 👋 Does Compose support drag and drop? I have a

LazyColumn

of cards and want to drag'n'drop items onto the cards from a picker. In native UI I used to do it with

setOnDragListener

listening to

ACTION_DROP

and

clipData

🤔

hard to read

No matter how much padding I add, the floating action button does not seem to give good padding to the text inside it (in Preview).

When Compose recomposes based on new inputs, it only calls the functions or lambdas that might have changed, and skips the rest.

Why is the root Compose function

RecompositionBehavior

always recomposed while the

Switch

only changes the input of

MaterialTheme

?

@Preview("RecompositionBehavior")
@Composable
fun RecompositionBehavior() {
    Log.d("Recompose", "RecompositionBehavior")
    var darkTheme by remember { mutableStateOf(false) }
    MaterialTheme(
        colors = if (darkTheme) darkColors else lightColors,
    ) {
        Log.d("Recompose", "MaterialTheme")
        Surface {
            Switch(checked = darkTheme, onCheckedChange = { darkTheme = it })
        }
    }
}

private val todoViewModel by viewModels<TodoViewModel>()

Why can't we just write

val todoViewModel = List<TodoViewModel>()

?

How to call lifecycleScope inside a composable function?

I try to get SavedInstanceState working in my custom Navigation framework. I am able to save state when dispose one screen and i will create a new UiSavedStateRegistry with restored values and provide it to the child composable. Unfortunatly the child composable with a

var checkBoxState by savedInstanceState { false }

Is not using the provided Registry :-(

log("${item.data} saved state: $${item.savedState}")
    val restoredRegistry by remember(item.savedState) {
        log("${item.data} Create new registry with: ${item.savedState}")
        mutableStateOf(UiSavedStateRegistry(restoredValues = item.savedState, canBeSaved = { true }))
    }
    Providers(UiSavedStateRegistryAmbient provides restoredRegistry) {
        log("${item.data} ${UiSavedStateRegistryAmbient.current}")
        children(item.data)
        onDispose {
            val saved = restoredRegistry.performSave()
            log("${item.data} onDispose saved: $saved")
            item.savedState = saved
        }
    }

Maybe someone can point me into the right direction what is wrong?

I am trying to implement a very simple Master/Detail app in Compose, where the Master screen is showing a list of items and the Detail screen is showing the details of the selected item. I am using a MultiPlatform ViewModel, where I would like to keep the state of which is the current screen that is shown. I am considering using just 1 Activity for the whole app. In order to manage the navigation I also need to listen to the BackButton. Can you please suggest what is the recommend way in Compose to get the BackButton event? Would it be the

onBackPressed(){...}

method of the Activity without calling

super.onBackPressed()

?

I can't find any links on the page to report documentation bugs, but shouldn't

dataExample

use property delegation here? It looks like it's being used as though it is the actual value of the state. Also, the link to

observeAsState

is broken. Should these be reported on the issue tracker? https://developer.android.com/jetpack/compose/interop#async

I am using a Switch, and adding Padding to the Modifier doesnt increase the clickable, swipeable area . The Switch is unusable with its Hitbox being this small Is there any way I can increase it with a Modifier or any other way?

Is it possible to add condition clause [lets say

buildWhen (previousState, currentState)

] while re-composing the ui widget so if data is not changed for particular child ui widget it won’t be re-composed? Is there any way to achieve this?

A value computed by

remember

will be stored in the composition tree, and only be recomputed if the keys to

remember

change. -link

What is a key?

The following code has some problem that causes the FAB to be located at the bottom-left of screen when app runs and once a new item is added to the lazy list, it jumps to the bottom-center.

@Composable
fun TodoScreen(
    items: List<TodoItem>,
    onAddItem: (TodoItem) -> Unit,
    onRemoveItem: (TodoItem) -> Unit
) {
    Column {
        LazyColumnFor(
            items = items,
            modifier = Modifier.weight(1f),
            contentPadding = InnerPadding(top = 8.dp)
        ) { todo ->
            TodoRow(
                todo = todo,
                onItemClicked = { onRemoveItem(it) },
                modifier = Modifier.fillParentMaxWidth()
            )
        }

        // For quick testing, a random item generator button
        FloatingActionButton(
                shape = CircleShape,
                elevation = 8.dp,
                icon = {
                    Row(modifier = Modifier.padding(16.dp)){
                        Icon(asset = vectorResource(id = R.drawable.add))
                        Text("Add New Item")
                    }
                         },
                onClick = { onAddItem(generateRandomTodoItem()) },
                modifier = Modifier.gravity(Alignment.CenterHorizontally),
        )
    }
}

Any ideas why this happens? Do I need a constraint mechanism or something for the FAB?

Please correct me if I'm wrong. Jetpack Compose only allows certain modifiers on the children of a given built-in Composable (e.g. Column, Stack, etc.). It seems like every time I change the parent composable, some errors pop-up on the modifiers that are used on the current composable, requiring new imports. Why is that so?

I am working on get flow working for endless scrolling (LazyColumnFor/LazyRowFor) lists. (Including error handling, retry and load on demand) Maybe someone can review the code to check if this is correct (For me it works fine 🙂 but maybe i missed something escepcially with the Channel stuff)

Hello. I've been seen weird issues when dealing with TextFields. Basically, the touch area for every component is incorrect after the soft keyboard has been opened. (attaching video on the thread). I can easily reproduce in these scenarios: • having a list of textfields, and select on one that has to be moved by to display the keyboard. Touch is now not working as expected • having a textfield aligned at bottom, open keyboard. For this case, I checked Jetchat app to see how that's handled, because I'm not seeing the issue there. However, I'm also seeing that there, ScrollState is used (I haven't check what that exactly does, but I guess it's handling scroll manually?) I wonder if that is a known issue, a bug, or an expected behavior in which scroll has to be handled manually?

Hi everyone ! What is the simpliest way to make a Text composable expend to take the size of all of its parent, and not the size of its content ?

Hello! Today, we return to our regularly scheduled biweekly releases. The latest Jetpack Compose minor release, alpha02, has just dropped; you can get it now on Google’s Maven Repository. Release notes are available at https://developer.android.com/jetpack/androidx/versions/all-channel. Feedback is always welcome at https://issuetracker.google.com/issues/new?component=612128.

In one of my composable components, I want to create a ViewModel and use it as the state source. However, once this composable is destroyed, viewModel should also get destroyed and next time the composable is rendered, a fresh new viewModel should be created. I achieved "creating a new viewModel" by introducing a remembered, random key as follows:

// using itemId as key would still give me the same viewModel when this composable gets recreated
val key = remember(itemId) { UUID.randomUUID().toString() }
val commentsViewModel = viewModel<CommentsViewModel>(key = key)

However, I cannot remove this particular viewModel from the store without removing other viewModels that were stored in the same place. How should I proceed with this? Is this an anti-pattern?