Hi, is there a way to create a gridview in jetpack compose? i know that

LazyColumnFor

just creates a normal listview of items where each item takes up a whole row, what i want is to create basically a gridview that can be scrolled vertically

I am having a `mutableStateListOf`in viewmodel, and and using that list in lazycolumn, so I have checkbox in each item, so I would have to recompose whole list by changing the data in list , if I check and uncheck checkbox?

Does anyone knows why my ViewModel always restart my

var image by mutableStateOf

value every time I get the viewmodel (

val viewModel = getViewModel<MainViewModel>()

) in a composable function? I'm using koin to inject it.

Hey, I've got a Row with an Image and Column inside, the image fills a certain height, but the Column wont fill the height row

Column(modifier = Modifier.fillMaxSize()

Curious if anyone has gotten to a similar point as me. I currently have a single module android app without compose. In the meantime my team was thinking that we can create a new repository where we create all of our composables and unit test all of them in a library of UI components essentially. We see a couple of paths forward 1. Separate repo for our app and separate repo for our composables 2. Ditch the separate repo, and instead have an app module and a ui-composables module 3. Don't have separate repos or modules and just do everything in a single app Although I feel like the typical pros and cons make sense here of separate repos, vs separate modules, etc, but I'm curious if anyone else has extreme warnings against a certain method. The reason we want to go the separate repo route is because enabling Compose doesn't currently support using reflection in your app and so we can't start building composables side by side our app module for the time being.

I’m using the navigation component with compose and I want to reuse a class instance while the current screen/ navEntry is in the backstack. Basically I want to have viewModels that are not android viewModels and that are retained, which is not supported. I have achieved this through DI scopes (with Koin). To cancel the scope I use this code:

navBackStackEntry.lifecycle.addObserver(object: LifecycleEventObserver {
    override fun onStateChanged(source: LifecycleOwner, event: Lifecycle.Event) {
        if (event == Lifecycle.Event.ON_DESTROY) {
            koinScope.close()
        }
    }

})

The problem is that this is run on every recomposition, so I end up having a lot of observers. It works (the scope will be closed when it needs to be) but it is not ideal having several useless observers being called. What can I do to only add an observer the first time?

Hey, I'm getting some strange SlotTable issues that are hard to narrow down the cause of. It seems to occur when there are too many .clickables but I'm not entirely sure - anyone else seen anything like this?

Process: com.caelumforder.blah, PID: 7462
    java.lang.ArrayIndexOutOfBoundsException: length=10280; index=-1219
        at androidx.compose.runtime.SlotTableKt.isNode(SlotTable.kt:2416)
        at androidx.compose.runtime.SlotTableKt.access$isNode(Unknown Source:0)
        at androidx.compose.runtime.SlotReader.isNode(SlotTable.kt:547)
        at androidx.compose.runtime.Composer.nodeIndexOf(Composer.kt:1796)
        at androidx.compose.runtime.Composer.recomposeToGroupEnd(Composer.kt:1686)
        at androidx.compose.runtime.Composer.skipToGroupEnd(Composer.kt:1970)
        at androidx.compose.ui.layout.LayoutKt$WithConstraints$1$1$placeables$1.invoke(Layout.kt:531)
...

hi, i am trying to apply a bold text and it says the arguments provides is invalid?

Text(
                            text = "Occupation: ",
                            style = TextStyle(fontWeight = FontWeight.Black),
                            Modifier.absolutePadding(4.dp, 8.dp, 4.dp, 8.dp)
                        )

Error below:

one of the following functions can be called with the arguments supplied: public fun Text(text: AnnotatedString, modifier: Modifier = ..., color: Color = ..., fontSize: TextUnit = ..., fontStyle: FontStyle? = ..., fontWeight: FontWeight? = ..., fontFamily: FontFamily? = ..., letterSpacing: TextUnit = ..., textDecoration: TextDecoration? = ..., textAlign: TextAlign? = ..., lineHeight: TextUnit = ..., overflow: TextOverflow = ..., softWrap: Boolean = ..., maxLines: Int = ..., inlineContent: Map<String, InlineTextContent> = ..., onTextLayout: (TextLayoutResult) -> Unit = ..., style: TextStyle = ...): Unit defined in androidx.compose.material
public fun Text(text: String, modifier: Modifier = ..., color: Color = ..., fontSize: TextUnit = ..., fontStyle: FontStyle? = ..., fontWeight: FontWeight? = ..., fontFamily: FontFamily? = ..., letterSpacing: TextUnit = ..., textDecoration: TextDecoration? = ..., textAlign: TextAlign? = ..., lineHeight: TextUnit = ..., overflow: TextOverflow = ..., softWrap: Boolean = ..., maxLines: Int = ..., onTextLayout: (TextLayoutResult) -> Unit = ..., style: TextStyle = ...): Unit defined in androidx.compose.material
``

Can this be done on jetpac compose between activities? https://guides.codepath.com/android/Shared-Element-Activity-Transition All the layout views are of course built on jetpack compose

I got the exact same error message, anybody have any insight of what might happen?

I'm struggling with the use-case of configuring childs of a composable (

TopAppBar

) conditionally. I want to set a

navigationIcon

depending on a condition. but doing

navigationIcon = {
            if (showBackArrow) {
                IconButton(onClick = onBackClick) {
                    Icon(Icons.Default.ArrowBack)
                }
            }
        }

this results in a "empty" composable set to the app bar and therefore the title is inset. what's the best approach here?

Is there much difference between

SnapshotStateList<T>

and

MutableState<List<T>>

? In particular, is there any difference in the granularity of how mutations trigger recomposition? (Like in a

LazyColumnFor

)

Hi, I'm using ExoPlayer and paging-compose in a LazyColumn to display a scrollable list of Posts with videos clips with various sizes fetched from the backend I tried a lot of things but I can't get it to scroll smoothly and don't understand why Does anyone know how to do this / have tips / code examples ? Thanks a lot 🙏

Image is shown using Lazy Column For. It is natural when you scroll down, but when you scroll up again, the entire image is rendered instantaneously instead of showing a new image from the bottom, making the scroll unnatural. How can I fix the image size to the original image width and height? If I do Modifier.size(100.dp), it works naturally.

here is my code

@Composable
fun ImageItem(image: ImageModel, onClickImage: (ImageModel) -> Unit) {
    Surface(modifier = Modifier.clickable(onClick = { onClickImage(image) })) {
        Column {
            Box(
            ) {
                GlideImage(
                    imageModel = image.imagePath.toUri(),
                    requestOptions = RequestOptions()
                        .override(500, 500)
                        .diskCacheStrategy(DiskCacheStrategy.ALL)
                )
            }
            Text(text = image.name)
        }
    }
}

Is it possible to set

maxLines=1

for a

TextField

in compose 'alpha06' ?

Seems savedInstanceState, and rememberLazyListState stopped working on alpha07.

Hi everybody, I'm trying to create a "Chat bubble" composable, basically a

Text

with vector image as a background. With the XML approach I just had to set padding of

TextView

and its background (there I could use gradient drawable as well). But now it seems a bit more work is involved. I tried creating a custom layout with

Layout

(having

Text

and

Image

as its children, positioned on top of each other). Then I measured the text and set its measures to the image behind it + some padding for the bubble. Looking at the preview, the measures/placement are correct. But the image doesn't stretch horizontally (vertical stretch is ok, on the screenshot you can see the blue border - that's the image composable's rectangle, but the image inside it is not stretched). The image I'm using is SVG converted to vector drawable. I tried setting

ContentScale.FillWidth

(it gets stretched, but it's distorted) and

Modifier.fillMaxWidth()

(did nothing) on the image. The

Layout

itself has

fillMaxWidth

set. Any ideas how to fix it, or maybe there's a better approach?

Is it correct in saying that the current alpha version of Compose suffers from where you put certain code, even though it shouldn't? Take a look at

padding(...)

. This works with padding towards the end.

Image(
                modifier = Modifier
                    .width(70.dp).height(70.dp)
                    .border(
                        border = BorderStroke(2.dp, color = Color.White),
                        shape = CircleShape)
                    .clip(shape = CircleShape)
                    .padding(8.dp),  // * * HERE near bottom - works * * //
                asset = Icons.Filled.Person,
                colorFilter = ColorFilter.tint(color = Color.White)
            )

However, move it towards the top, and no padding is added at all.

Image(
                modifier = Modifier
                    .width(70.dp).height(70.dp)
                    .padding(8.dp)  // * * HERE near top - fails * * //
                    .border(
                        border = BorderStroke(2.dp, color = Color.White),
                        shape = CircleShape)
                    .clip(shape = CircleShape),
                asset = Icons.Filled.Person,
                colorFilter = ColorFilter.tint(color = Color.White)
            )

Hi All, I want to create a bottom tab bar which have have some offset from bottom like in attached image. I tried to create bottom bar using below code

Scaffold(
    bottomBar = {
        //  Bottom bar code
    },
)

But bottom Bar render in bottom, with any offset from bottom or transparent margin. Is there any way/sample?

Will alpha08 be compiled towards Kotlin 1.4.20, now that it's “out”? 😁 https://github.com/JetBrains/kotlin/releases/tag/v1.4.20

In Canvas: How can I “add” an “InnerShadow” and/or a “DropShadow” to e.g. a circle with a linearGradient

Is there a way to use

staticAmbientOf()

/

ambientOf()

to provide an

@Composable

without a factory layer like

AmbientIndication

uses? Specifically my use case is providing my own version of

AmbientColors

, but all of my theme’s colors come from resources for interop with our existing View-backed content. The colors are defined like so:

object ColorPalette {
  @Composable val red: Color get() = colorResource(R.color.red)
}

Since those colors are

@Composable

, I can’t just do something like

val primaryColorAmbient = staticAmbientOf { ColorPalette.red }

I have a ScrollableColumn as the content of a Scaffold. Any ideas why it won't scroll?

ScrollableColumn(
    modifier = Modifier.padding(all = PAGE_PADDING.dp)
) {
    AtAGlanceCard(atAGlanceItems)
    Spacer(modifier = Modifier.height(SPACE_BETWEEN_SIBLINGS.dp))
    QuickLaunchCard(quickTools)
    Spacer(modifier = Modifier.height(SPACE_BETWEEN_SIBLINGS.dp))
    AccountBalanceCard(balances = accountBalances)
    Spacer(modifier = Modifier.height(SPACE_BETWEEN_SIBLINGS.dp))
    CurrentCoursesCard(courses)
}

I'm on 1.0.0-alpha07

In @Manuel Vivo talk just now at "Kotlin Meetup Munich" he showed following but I can't resolve

AmbientNavController

for some reason....am using alpha02 of

navigation-compose

. Should this be available?

This message was deleted.

Hello guys! I was wondering what is the best wat to pass data into composition? Let's say in my MainActivity I call another activity and get some data in the onActivityResult, how do I go about passing this data into my composition tree? I was thinking I could have an activity view model with a LiveData and do observeAsState inside, but I don't know if that is the best way

Are there plans to support two drawers in one layout? I see that

ModalDrawerLayout

supports mainly left to right (Unless RTL layout direction), but that is only for one drawer. If I want to have two drawers (Like Discord) then should I try to wrangle my own using ModalDrawerLayout as a base?

I am trying to pass data with compose navigation 1.0.0-alpha01 (alpha02 is causing a crash with slotTable but that’s irrelevant to my question) I manage to pass primitive quite well but when trying to pass ParcelableType classes, i get a crash:

UnsupportedOperationException: Parcelables don't support default values.

My code for passing the data is:

composable("route".plus("/argument_key"),
        arguments = listOf(navArgument("argument_key) {
            type = NavType.ParcelableType(AnimationIdHolder::class.java)
        })
)

And my code for extracting it is:

backStackEntry.arguments?.getParcelable<AnimationIdHolder>("argument_key")

Where

AnimationIdHolder

is:

@Parcelize
data class AnimationIdHolder(
    val animationId: Int

): Parcelable

@Ian Lake Any idea on what is the default value required here and why it is not supported? Further more, maybe someone can point me in the direction of how i can pass parcelable types using the safeArgs in jetpack compose navigation?

How is everyone managing navigation results currently with the compose navigator? Can’t find anything regarding that from here https://developer.android.com/jetpack/compose/navigation