Anyone have any obvious ideas of how I might accomplish cross node Porter-Duff color mixing in compose? Wondering if there is some form of modifier hackery I could use to get things drawn into the same layer or if I would need to do two separate compositions where one is used inside of the canvas so that things can be mixed. sandbox project here: https://github.com/trevjonez/SharedCanvasPoc/tree/master End goal example as an image:

Some of my Compose screens are unresponsive and eating CPU (debug & release build), Any idea why Compose would get stuck calling

findModifierLocalProvider

a million times? I think it started happening when I last updated compose. I can't figure out what's causing it.

Encountered Inter-op issues between AndroidView and Compose elements wrt to Keyboard navigation. While navigating elements using external bluetooth keyboard, only compose elements gets highlighted where as Compose elements internally using AndroidView never responds. Is this a known limitation ?

Can I somehow rotate a Path? I am generating a Path and am not in a DrawScope or inside a composable so can’t use transforms I think

👋 We want to add system trace to different composition phases, does anyone know what are the most appropriate callbacks to use to add a trace? Currently we’re doing: • composition - DisposableEffect • layout - onGloballyPositioned • drawing - ???

Hi, I am trying to develop a horizontal swipe navigation by using accompanist library's

HorizontalPager

. By testing the sample code from the guide works great:

// Display 10 items
HorizontalPager(count = 10) { page ->
    // Our page content
    Text(
        text = "Page: $page",
        modifier = Modifier.fillMaxWidth()
    )
}

But I need to display different `Composable`s in different pages instead of same element. The only way I figured how to do this is the following:

HorizontalPager(count = 3) {
    if(currentPage == 0){
        FirstView() // Composable
     } else if (currentPage == 1) {
        SecondView() // Composable
     } else if (currentPage == 2){
        ThirdView() // Composable
     }

The problem with this implementation is that when I swipe to navigate, it appears like the view coming from the side is the same as the current view. When the

currentpage

updates to the next view it suddenly updates the view to the upcoming view. So there is no smooth animation like in the sample code. Suggestions how to implement this better?

I have some troubles with the layout inspector, I get an error saying

Could not enable resolution traces

Unable to set the global setting:

"debug_view_attributes_application_package"

to: "app.medxpert.medxpert"

Error: Exception occurred while executing 'put':

java.lang.SecurityException: Permission denial: writing to settings requires:android.permission.WRITE_SECURE_SETTINGS

I added

<uses-permission android:name="android.permission.WRITE_SECURE_SETTINGS" />

but that permission is only for system apps. Can someone help me find out why my composable are not shown. I see the layout, but the component tree isnt showing

I would like to see the compose views, not the android view. is that possbible? it was before, am i missing a dependency or something? I cant find it

Hi, I am using a BasicTextField inside a Surface. If I set Surface enabled = true, I am able to edit text in BasicTextField. But if Surface is set to enabled = false then I can’t edit BasicTextField. I can’t click on it to request focus. Any help?

😛arty-parrot: Android dev summit 😛arty-parrot: was yesterday. (this was ADS part 1? there seem to be more events later this year) Bunch of new stuff dropped. I'll try to sum up for anyone that hasn't caught up, without being a wall of text Android studio updates: New Studio canary (/w a new cool icon 😄 ) Live edit now has an option to automatically deploy, OR deploy with a keyboard shortcut. Love this. Also, kinda big is composition tracing in flamingo. if you have perf issues with compose... Video playlist: Heres the from the summit which has a TON of compose ❤️ content. very watchable as talks are 5-20 minutes. Compose BOM: Already mentioned above. but also sooo good not to mention again. basically define 1 version to get all latest stable versions. Compose 1.3.0: artifacts were released. Nothing too major from the alphas/rcs as far as I see. Compose Material3 hit 1.0! Compose 1.4.0-alpha01: •

SnapshotStateList

and

SnapshotStateMap

now have explicit implementaions of

toList()

and

toMap()

, respectfully. • A new method,

awaitEachGesture()

, for gesture detectors was added. • Added

DrawStyle

as an Experimental attribute to

TextStyle

and

SpanStyle

to enable drawing outlined text. (If24b8, b/155421273) WOOOOO • Thanks for

vighnesh

for adding TV Devices to Previews (Ie15cd) Other: • Android TV for compose?! idk when this was announced, but I saw it in the Keynote. Compose can now be used for Android TV development. edit: more here • "Relay" was announced for figma <> Composable generation. (definitely cool, but idk if i would trust it. What I would really love is to click a button in figma to generate composable code, and then I can tweak that code, instead of copy pasting and guessing about figma gradient code and bringing into a composable for example)

Hello! How to make FloatingActionButton disabled (visible by like Button looks like disabled)? There is no 'enabled' parameter.

Hello, I have a question regarding

unstable

/ not

skippable

item views in

LazyList

=> 🧵

After the talks I wanted to try the macro benchmarks but my P6 pro A13 it fails with java.lang.RuntimeException: Baseline profiles aren't supported on this device version (woks on emulator). The 1.2.0-alpha06 says it works on API 33 without root is there something else that I'm missing?

Hello guys. I have small issue creating layout i want. I have Scaffold. Inside Scaffold I have Top bar., bottom bar, floating button. Main content is Lazy column that contains different items including text input. I am trying to make when I type in text field that my lazy column moves and keep current text focus above bottom bar and floating button. Sample code and video are in 🧵

highly recommend checking this 10 minutes information rich real life example based talk about Compose Text :

Any ideas on how to achieve this 3d carousel layout?

I'm trying to show a full screen dialog. What I have works EXCEPT that the dialog doesn't show under the system navigation bar or under the system status/notification bar. My app draws edge to edge and so I'm surprised by this behavior as it's almost like the dialog has the proper insets set on it. Anything I can do about it?

Dialog(
      onDismissRequest = onClose,
      properties = DialogProperties(
          usePlatformDefaultWidth = false,
          decorFitsSystemWindows = false,
          dismissOnClickOutside = false,
          dismissOnBackPress = false,
      ),
  ) {

Greetings! I have a question that I can't seem to find an answer to in the documentation. How does Compose treat local functions and variables of function types inside Composable functions? Do we have to

remember

them? Or is there some optimization already built in? Here is some specific code:

@Composable
private fun SomeComposable() {
    val fun1: (int: Int) -> String = { int ->
        int.toString()
    }

    fun fun2(int: Int): String {
        return int.toString()
    }

    val fun3: (int: Int) -> String = remember {
        { int ->
            int.toString()
        }
    }
    
    fun1(5)
    fun2(5)
    fun3(5)
}

What would be the most optimal approach between

fun1

,

fun2

and

fun3

?

I’m trying to understand derivedStateOf better. Depending on the list state, I want to determine if the toolbar should be transparent or not. Which version is correct?

transparent

or

transparent2

?

@Composable
public fun TransparentTopAppBar(
  contentListState: LazyListState,
) {
  val transparent by remember {
    derivedStateOf {
      contentListState.firstVisibleItemIndex == 0 && contentListState.firstVisibleItemScrollOffset == 0
    }
  }
  val transparent2 by remember(contentListState) {
    derivedStateOf {
      contentListState.firstVisibleItemIndex == 0 && contentListState.firstVisibleItemScrollOffset == 0
    }
  }
}

When

supportsRtl=false

, but a RTL language is set,

LocalLayoutDirection

isn't immediately set to Ltr, causing the UI to be composed in rtl for a brief moment:

println("layout direction: ${LocalLayoutDirection.current}")
// layout direction: Rtl
// layout direction: Ltr

Of course I can make

LocalLayoutDirection

always provide

LayoutDirection.Ltr

, but is this expected?

I’m trying to create a simple compose test, but run into the following error which fails my test, more in 🧵 :

Failed resolution of: Lkotlin/time/AbstractLongTimeSource

Is there a way to center a component relative to its parent, but prevent it from colliding with its neighbors? For example, I have three components: Red, SomeText, Blue. And I want SomeText to go after Red and before Blue, so as not to draw over them, but at the same time SomeText has to be centered in its parent. The only way I can think of is to dinamically calculate start-end paddings for SomeText as maximum width of Red and Blue. Is there something already built-in I could use, perhaps?

Why when you pass modifier to a Button() and pass the same to inside element of the button like Column() the modifier was modified by the button and not be the same ? For Example :

val modifier = Modifier.fillMaxSize()
Button(....,
modifier= modifier) {
   Column(modifier = modifier) {
      Text(...., modifier = modifier)
   }
}

The text was not just with fillMaxSize it has the padding the button add on modifier too.

I have 4 tabs in my app. Each time i go from tab A to B and return to tab A it refetch data . How to prevent it?

do you guys know where is the margin from box coming from?

Is there something special about UIAutomator and Compose? I have a simple

Text(text = "$title\n ")

that is dumped as

<node index="0" text="All albums&#10; " resource-id="" ...

but I can't find / select it (

By.text

with the dumped value, `By.textContains`or

textStartsWith

) if I remove the "\n " from the source code then all works as usual.

Is there hook/callback for “Compose screen/widget has finished rendering”? In XML views, you could hook into GlobalLayoutListener. Searched slack and stackoverflow for “finish rendering Jetpack Compose” w/o luck. This is needed for the typical analytics info of “has the LazyList finished rendering” or “has the screen finished rendering” to determine when a user can interact with it.

Is there a way to set a device's orientation to Landscape when testing with ComposeTestRule?

Hello all. I am trying to create a badge that is circular on the left and right side. Ending up with this,