Hey guys. I’m having trouble with my UX when I try to display web content (AndroidView + WebView) in a List of other items (e.g. ads). Whenever the user scrolls “normal” through the content, the AndroidView is getting recomposed and the height is adjusted some milliseconds after it is already in the visible area. This leads to confusing list jumps. Has anybody of you some advices how I can improve the user experience?

I've a ImageVector that I would like to paint dynamically changing colors by the offset, but when the offset changes it's not recomposing it, I imagine it's because I'm using

rememberVectorPainter

but without this I can't use the

Image

composable. Is there a way to achieve this?

I can't use some view layout to nest compose view inside right? For example LinearLayout or MaterialSmoothRefreshLayout with AndroidView to nest LazyColumn inside isn't applicable, thus I must use recycler view?

Hey guys, I am new in compose. My supervisor told me to work on compose UI library. So can anyone suggest me how to make a compose UI library which can share in 2 different apps. So any guidance would be great. Thanks.

Do the lifecycle events of the composable always follow the lifecycle of the host fragment (converting Android view appliaction to compose view)? Is LocalLifeCycleOwner.current.lifecycle.Event always the same as fragment lifecycle event? If so, assuming I have code to be executed inside fragment lifecycle callbacks, say inside On_create calling viewmodel.init(), can I call it directly inside LaunchedEffect(true) or with lifeCycleObserver, when the lifecycle.Event is ON_CREATE ON_RESUME. Sorry for the least chaotic paraghraph ever.

I would like to have a function that accepts an enum of Colors, I want the enum to look like this

enum class StylisedIconColor(val color: Color) {
    BRAND(MaterialTheme.colors.Brand), INFO, SUCCESS, WARNING, FAILURE, INACTIVE, EARTH, TITAN, SUN, MARS
}

but the issue is that you cannot invoke that colors call without being in the context of Composabl;e

I am creating a

MutableState

in this way:

var result by mutableStateOf<R?>(value = null, policy = neverEqualPolicy())

Now I am setting an

object

via

result = TheObject

I am listening to that via

LaunchedEffect(Unit) {
  snapshotFlow { result }.collectLatest {
    (logging here)
  }
}

But I am only receiving a log when the first object is set, all subsequent value changes with

TheObject

on

result

are not logged. Shouldn’t

neverEqualPolicy()

ensure that every value change is emitted? What am I missing here?

I have some `ImageBitmap`s that I'm rendering into a UI using

Image

. That works nicely, images appear in their natural size. However on higher density devices, images appear smaller. Is there any easy way to use the

LocalDensity

to render an image the same natural size independent of screen density? I've tried applying

Modifier.scale(LocalDensity.current.density)

and while the image seems to be rendered bigger on higher density devices, the size of the widget doesn't seem to increase, i.e. only part of the image is visible. I see that

Image

is using an

ImagePainter

under the hood, but I don't see an easy way to supply a target size for it. Any suggestions?

I'm trying to understand the difference in LaunchedEffect and SideEffect in example below.

@Composable
fun isCompactWindow(windowSizeClass: WindowSizeClass = LocalWindowSizeClass.current) = windowSizeClass.isCompactWindow()

class Fragment : ComposeFragment { // calls Route in onCreateView by returning ComposeView

    @Composable
    override fun Route() {
        val isCompactWindow = isCompactWindow()
        val someOtherState by remember { mutableStateOf(false) }

        LaunchedEffect(isCompactWindow){
            mainActivity.showFoo(isCompactWindow)
        }
        // or
        SideEffect {
            mainActivity.showFoo(isCompactWindow)
        }
    }
}

I think I should use the LaunchedEffect in this case. Since it makes sure that the code won't run again when

someOtherState

changes, right? If there was only

isCompactWindow

, then I could use SideEffect safely too?

Is there any way to programatically retrieve the font family applied to text? I'm building a text debug menu in my app and it seems like for each text style I can programatically access all attributes about the style, (weight, size, line height) but not the name of the Font (i.e. Roboto or my other custom font). Ideas?

I want to drag a specific element inside a canvas if the drag starts from touching in the region of that element. If not then I would like to scroll the canvas parents box horizontal scroll. Im currently trying to figure out how to correctly pass up the drag from the pointerInput to the horizontalScroll. The below is what I currently have, but it doesn’t take into account flings. Any ideas?

Box(
    Modifier
        .fillMaxHeight()
        .horizontalScroll(scrollState)
) {
    CanvasComposable(data = chartData, settings = chartSettings, onHorizontalDrag = { dragX ->
        scrollState.dispatchRawDelta(-dragX)
    })

Canvas(
    modifier.then(
        Modifier
            .fillMaxHeight()
            .clipToBounds()
            .pointerInput(Unit) {
                // If drag is starting on a specific rectangle inside the canvas drag that otherwise scroll the parent horizontal 
                // composable according to the x dragAMount and (Fling?)
                detectDragGestures(
                    onDragStart = {},
                    onDragEnd = {},
                    onDrag = {change, dragAmount ->
                        change.consume()
                        onHorizontalDrag(dragAmount.x)
                        //dragOffsetStart += dragAmount.x
                    }
                )
            }
    )

I allow myself to repost at another time. Would be really glad for any response.

Hello, I have a list of instruments in which each of them subscribes to a websocket so they get updated frequently. How would you observe such a frequently updating set of items with Compose? I use

subscribeAsState

to collect the list but whenever there is an update in any element in the list, all item gets recomposed over and over so I am having flickers in the UI. I also pass a key per element down to

LazyList

val instruments by instrumentList.subscribeAsState(initial = emptyList())

GIF in the thread

Hey I have a compose multiplatform project with android and desktop. Is it normal that I can access AlertDialog and Dialog in android and desktop specific code but not in the common code?

hey. I have a compose view inside of a

FrameLayout

inside of a

CoordinatorLayout

. The coordinator layout has also a bottom navigation on the bottom of the screen (tabs) there is an issue where the last row of items inside of a

LazyVerticalGrid

get cut off on the bottom. 1. On api 33 (or as I understand > API 28), it intermittently happens and only seems to happen very rarely. Then it "fixes itself" 2. On api 28 I can see it happening all of the time. I add bottom padding to the view below the last set of items to mitigate it. But when I use the

nestedScroll

interop connection, it still happens. anyone run into such an issue as this?

I’d like to create a text field that opens up a DatePicker when it’s selected. Would it be best to use the TextField composable and then customize the InteractionSource to show my date picker instead of the keyboard or would it be better to just create my own “field” composable which has it’s own onClick impl?

Hi! Can somebody help me with using

android:forceDarkAllowed = true

I didn't find any useful resources on how to use this with Compose. Thanks in advance.

I am trying to replicate what Instagram is doing with Feed and adding comments. So basically it is possible to add comment directly from feed on post. I am really interested to know how would you guys implement it? Show some input on top of keyboard and then scroll item in lazy column to focus post which user actually want to comment on. Also on backdrop press sheet should close. Probably it is not input on every post it is button that open keyboard and have input on top of if. I really do not know what would be optimal way to achieve it so any advice is good advice 😄 . Here is video explaining what I am trying to achieve. I do not need any coding or something just general idea how to achieve. thx https://streamable.com/nm8rlb

Hi all. I have a language toggle in the settings of my app, and I want to change the app language when the users change the language here. I'm setting the language using

LocalConfiguration.setLocale(locale)

- this seems to have worked, but it doesn't seem to automatically trigger recomposition by itself. Is there a way to trigger recomposition manually?

I’ve seen this asked & answered in the #compose channel plenty of times (myself included), but I haven’t quite got my head around a good implementation. Let’s say I’m using route-based navigation, and I want to pass some complex data between routes. The suggestion is to stash that object somewhere, and then pass an identifier via navigation args, then use that identifier to retrieve the object. I’m fine with this when my data has an identifier, and exists in a repository somewhere. But, let’s say I have two Composable screens, StoreList and StoreDetails. And, let’s say each screen has its own ViewModel,

StoreListViewModel

and

StoreDetailsViewModel

StoreList lets me retrieve a list of

Store(val name: String, val lat: Double, val long: Double)

And StoreDetails renders some UI for a particular

Store

. There’s no real ‘identifier’ for a Store, though I could use the hashcode or something. And there’s currently no cache for Stores. Where do I stash this Store object? I don’t particularly want to share the

StoreList's

ViewModel

with the

StoreDetails

screen, as it contains properties and functions that don’t relate to StoreDetails. Do I create a 3rd ViewModel for sharing between the two screens, and set the Store on that VM?

Are multipreview annotations broken in Canary 8 of Android Studio? I keep getting

Only composable methods can be annotated with Preview

. Usage in 🧵

I have viewmodel which I want to use in Parent composable and then few levels down in child composable. What is best way in this case it sounds very wrong that i create dependencies and that I send viremodel instance all way down to the view that actually need on click to update viewmodel. Parent also based on viewmodel value change visibility of component but on button press child component update it. Any recommendation what is best practice?

Hello, I noticed that

LaunchedEffect(someMutableState.value)

will cause a custom

Layout()

in the same

@Composable

function to remeasure every time the value of the key changes. Which was not what I was expecting. This got me wondering if there is something wrong with the way

LaunchedEffect

is used in this case and what the ideal approach to get around this remeasure would be. Wrapping it into a separate

@Composable

or

SubcomposeLayout

would work, but that feels even worse to me.

How to make one item in LazyVerticalGrid fill all the parent width ? Scenario: LazyVerticalGrid with diffrent Lists every list should have it own header How I can implement the header to take all the width ?

In my application I am using

LocalContext.Current

for some process where I take a screenshot and share it. I have a memory leak and I think this whole process is the cause. Is there a way in which I can dispose of the context when I navigate back to the Homescreen? I thought I could use

DisposableEffect

but I can't seem to make it happen (I can't work out how to use it here). I'll put my code in the thread. Thanks.

We’re using compose desktop within an Intellij IDE Plugin. It was working great up until recently and it seems like with Intelij 2022.1 (Android Studio Electric Eel build specifically) it just stopped working. Initial drawing works, but then recomposition just doesn’t seem to happen. Click and key press callbacks happen, but updating State doesn’t trigger recomposition, and things like mouse over highlights over built in components don’t show. It’s really bizarre, and I don’t see any errors in logs to point out what is going on. Debugging doesn’t give me any hints either. Anyone in a similar position?

Any amazing devs working a full featured dataTable compose impl? filter,search,sort

Did something happen to Android support in recent

1.2.0-alpha01

Compose Multiplatform Dev builds? iOS source-set is resolving dependencies as expected,

androidMain

is not(?)

Is it possible with Jetpack compose when click on element to get it position relative to screen? I am coming from react native and there it is possible but can not find anything similar with Jetpack compose. I need when click on element to get it offset from bottom. Thx in advance 🙂

Hey guys, I started jetpack compose I am getting confused in width and height. In xml we use WRAP_CONTENT/MATCH_PARENT so what we use in compose?