kotlinlang #compose

"androidx.navigation:navigation-compose:2.4.0-alpha04"            // Working fine

vs

"androidx.navigation:navigation-compose:2.4.0-alpha05" or above   // Doesn't work

Is there any way to fix it up or I have to wait until it is being fixed by Google?

This behavior is found till 2.5.0-alpha03

Looks like this commit caused the issue:

https://android-review.googlesource.com/c/platform/frameworks/support/+/1750073

recording 01.mp4

Chris Johnson

03/22/2022, 10:45 PM

:android-wave: Is there a way to determine when a key has changed and when that is true run certain blocks of code in a composable? For example, I want to run a certain block of code only when

scrollState.isScrollInProgress

changes from false to true or true to false. I don't want to use a LaunchedEffect with a key to avoid creating a new CoroutineScope everytime someone starts/stops scrolling.

iamraghavawasthi

03/23/2022, 5:39 AM

Hey I am trying to achieve blur but on documentation it says it is supported only on Android 12 and above. Any clue on how to make it backward compatible

ritesh

03/23/2022, 6:56 AM

Can compose infer stability of a

sealed

class ?

sealed class MyClass {
  object A :  MyClass()
  data class SomeClass(val value:String): MyClass()
}

Benjamin Deroche

03/23/2022, 9:44 AM

What unit of measure use the

Canvas

function

drawCircle

? If I draw a circle with a radius of 72 and a

FloatingActionButton

with a size of

72.dp

the circle end up bigger than the button.

Box(
    modifier = Modifier.size(120.dp).align(Alignment.TopCenter)
) {
    Canvas(
        modifier = Modifier.align(Alignment.Center)
    ) {
        drawCircle(
            color = MaterialColor.Red400,
            radius = 72f,
        )
    }
    FloatingActionButton(
        modifier = Modifier
            .align(Alignment.Center)
            .size(72.dp),
        backgroundColor = MaterialColor.Orange400,
        onClick = {}
    ) {
        Icon(
            imageVector = Icons.Default.ArrowUpward,
            contentDescription = "!"
        )
    }
}

Tobias Gronbach

03/23/2022, 10:24 AM

How can I avoid recomposition of certain areas of a screen? In my example I use an AndroidView (to show diagrams) and also I display some Dialogs depending on the ScreenState. Everytime a dialog is shown or hidden the AndroidView gets recomposed. How can I avoid it? Is it possible to scope recomposition only to specific states?

Orhan Tozan

03/23/2022, 12:13 PM

With @Preview, what is the best way to debug/log values?

👀 1

➕ 1

Francois Morvillier

03/23/2022, 3:21 PM

Hi, is there a way to find out what triggered a recomposition?

gpaligot

03/23/2022, 4:39 PM

Hi here! I’m building a design system with compose and my designers want to create a disabled button where an alpha is applied on the entire component but where the transparency applied on the text doesn’t show the background behind. Because a button with compose is a surface and a text in top of it, I would like to know if it is something possible or not? 🤔 You can find the Figma visual and the Compose preview to show the current difference between the design specification and the compose implementation Thanks in advance if someone have an idea!

myanmarking

03/23/2022, 6:06 PM

Why this is not working:

background(
    brush = brush
).graphicsLayer(
    shape = shape,
    clip = true
)

It only works when i move the shape to be a background param. Why ? I need a dynamic shape. Graphics Layer better suited

julioromano

03/23/2022, 6:21 PM

Is it possible to specify the padding amount as a percentage of a composable’s width/height?

Vinay Gaba

03/23/2022, 8:17 PM

I was working on a custom composable using

Layout

and noticed that modifiers like weight weren't being propagated through the constraints inside the

MeasurePolicy

. I'm wondering what's the best way to handle this so I don't have to manually hardcode weight calculations when I place my composables there. Adding a code snippet in the thread.

Colton Idle

03/23/2022, 9:11 PM

Compose Version 1.2.0-alpha06 is out today! Some release notes that I found interesting. • A bunch of focus related stuff!!!! • TextFields will now be kept above the keyboard when they are focused and the keyboard is shown, when inside a non-lazy scrollable and the soft input mode is

ADJUST_RESIZE

. WOOOOOOOOOOOOOOOOOO Thanks @Zach Klippenstein (he/him) [MOD] 😄 • Added

RequestFocus

semantics action to request focus on the focusable target. •

FocusOrder

has now been merged into

FocusProperties

and

focusProperties()

now has all the capabilities of

focusOrder()

FocusOrder

and

focusOrder()

have been deprecated.

focusOrder()

that accepts a

focusRequester

should be replaced with a

focusRequester()

modifier in combination with

focusProperties()

. This allows the modifiers to have a stronger separation of concerns. •

WindowInsets.asPaddingValues(Density)

was added to allow developers to do the conversion without needing to be in composition. • Updated parsing of vector drawables to support auto mirroring to flip the content of a

VectorPainter

if the current layout direction is RTL. • Scroll modifiers (

Modifier.verticalScroll()

Modifier.horizontalScroll()

, and

Modifier.scrollable()

) will now scroll to keep the focused composable visible if the scroll area is resized and the focused composable was previously visible. • Upgrading both

RecyclerView

and

Compose

will now result in much better scrolling performance for RecyclerViews with Compose views as children. • Reference devices added to the Devices list for @Preview (I071c9) • compose-ui: Add

ambientShadowColor

and

spotShadowColor

properties to

GraphicsLayerScope

(I1ba1a, b/160665122) • Plural resources are now supported via the

pluralStringResource

functions. (Ib2f23, b/191375123) • Material3 - Added support for Material 3 text fields. (I795cc, b/199377790)

:thank-you: 3

❤️ 15

Thomas Dougherty

03/23/2022, 9:21 PM

ConstraintLayout(
    constraintSet = constraints,
    modifier = Modifier
        .fillMaxWidth()
        .height(90.dp)
        .clearAndSetSemantics {
            set(SemanticsProperties.ContentDescription, listOf(contentDescriptionText))
        }
        .clickable(onClick = onClick)
        .border(
            width = 6.dp,
            color = Color.Green,
            shape = RoundedCornerShape(topStart = 6.dp, topEnd = 6.dp, bottomEnd = 6.dp, bottomStart = 6.dp)
        )
) {

Tim Malseed

03/24/2022, 2:16 AM

Is there anyone @Google who could help me find some Compose merch? I’m in Australia.. Just looking for something to use as a gift to reward some of the junior devs on my team

SrSouza

03/24/2022, 2:34 AM

Hi folks, I'm trying to create a delegate function that is a

@Composable

no problem problem building it. but I'm having runtime exception:

java.lang.NoSuchMethodError: No virtual method getValue-0d7_KjU(Ljava/lang/Object;Lkotlin/reflect/KProperty;)J

Does

@Composable

support delegate property? Example:

@Composable
public operator fun getValue(thisRef: Any?, property: KProperty<*>): Color {
    return animateColorAsState(targetValue = state).value
}

Colton Idle

03/24/2022, 5:00 AM

I updated to latest compose alpha and now I have this compile error regarding a

Card

My code

Card(
    modifier = modifier,
    backgroundColor = color,
    onClick = onClick ?: {},
    indication = if (onClick == null) null else LocalIndication.current,
) { content() }

if I use the alt+enter helper it removes the

indication =...

. How can I set an indication on the card now though?

Android75

03/24/2022, 7:11 AM

I developed a QRCode scanner, it’s a scanner that add in a container in my old xml layout.. how can i used it in compose ? So how ca i add a Fragment inside a compose layout ?

Utkarsh Tiwari

03/24/2022, 7:15 AM

Let’s say we have two focusable TextFields items stack in a column.

Column {
  TextField() // Let's call it A
  TextField() // Let's call it B
}

If I use

FocusDirection.Down

when

is focused, the focus moves down to the

item below it which is an expected behavior. However, when I use

FocusDirection.Next

, nothing happens. The documentation of

FocusDirection.Next

says: Direction used in
FocusManager.moveFocus
to indicate that you are searching for the next focusable item. and I believe that the next focusable item in the above column when

is in focus should be the

but it doesn’t seem to work. Am I missing something? 😕

K Merle

03/24/2022, 7:21 AM

Are we able to dynamically hide Accompanist pager Tab?

galex

03/24/2022, 10:23 AM

Hello, how can I call

onGloballyPositioned

inside

Modifier.composed

? That inside modifier doesn’t seem to be called!

fun Modifier.tooltip(
    scope: CoroutineScope,
    tooltipHostState: TooltipHostState,
    text: String
) = composed {
    var layoutCoordinates by remember { mutableStateOf<LayoutCoordinates?>(null) }
    onGloballyPositioned {
        layoutCoordinates = it
        logger().d("tooltip", "onGloballyPositioned = $layoutCoordinates")
    }

    LaunchedEffect(layoutCoordinates) {
        logger().d("tooltip", "LaunchedEffect = $layoutCoordinates")
        scope.launch {
            tooltipHostState.showTooltip(text)
        }
    }
    return@composed this
}

What I am trying to do is to launch only once (LaunchedEffect) when

onGloballyPositioned

is called 🤔

Tomas Gordian

03/24/2022, 12:00 PM

Hello, why is recomposition happening in this example even when no parameters has changed and how can I avoid it?

Filip Wiesner

03/24/2022, 12:01 PM

Hey, how can I have a pager where each item is also zoomable? Right now I have my

zoomable

modifier which contains a

pointerInput

with

detectTransformGestures

. It works all fine but now I have to use this

modifier

on items inside

HorizontalPager

and because (I presume) the

pointerInput

consumes all the events, I cannot move the pager. What I've tried is to dispatch the unused offset (pan with one finger) as a scroll to the pager but I don't know how to handle the fling after the scroll. Is there some way to handle my own fling? Or is there some more simple way to achieve this that I am missing?

Mantas Varnagiris

03/24/2022, 1:02 PM

Hi, I'm trying to understand something about Accompanist Navigation Animation. It seems that when you pop, screen that was behind in a back stack is drawn on top of the current screen that is now popping. With this we cannot do any parallax or similar animations that involves screens being drawn on top of each other. Is there away to force screen that is being popped to be drawn on top?

lhwdev

03/24/2022, 1:22 PM

How can I set proper status bar colors for Dialog? I'm creating custom full screen dialog (but it differs; it can extend below system ui). I've managed to do most things except one thing, I cannot properly use system ui controller for Dialog Window. I'm using accompanist-systemuicontroller and it seems to pull window only from

Activity

. (there is DialogWindowProvider for this purpose?)

Shaheer Muzammil

03/24/2022, 1:26 PM

Hey Guys, I have recently started using Compose and I was using previews to show different states of my views. Now Most of my classes in the application are abstractions so I was able to generate mocks for them and use them accordingly to show different states. but in case some of the final classes that I am using have their constructors as internal. as they should not be initialized from outside of the module. How do I use them? and is this the right approach to make these extensive previews? And should I use mocking libraries like Mokito or Mockk to get this done?

Stylianos Gakis

03/24/2022, 1:44 PM

I have a question regarding using

Layout

, how it’s used in the implementation of Column|Row measure policy and in a codelab. More in thread 🧵

julioromano

03/24/2022, 2:20 PM

Is there an “easy” way to set all of a composable’s inner composables as

disabled

? Maybe something with CompositionLocals? (what I’m trying to achieve is to have an entire screen to be disabled under certain conditions)

natario1

03/24/2022, 4:25 PM

Hi, is anyone seeing broken layouts starting from

1.2.0-alpha04

? We have a couple of components that look completely messed up in 04 (but worked well before). I’m going through the changelog but I can’t find any hint

Tobias Gronbach

03/24/2022, 4:26 PM

How do I put a LazyVerticalGrid in a scrollable Column. I get following exception : "java.lang.IllegalStateException: Vertically scrollable component was measured with an infinity maximum height constraints, which is disallowed. One of the common reasons is nesting layouts like LazyColumn and Column(Modifier.verticalScroll())." What is the recommended approach? I guess this is not an uncommon usecase?

Title

Tobias Gronbach

03/24/2022, 4:26 PM

Thomas Dougherty

03/24/2022, 6:17 PM

What’s the end result you’re trying to achieve?

Tobias Gronbach

03/24/2022, 6:22 PM

Hi Thomas, thanks for your question! I have a Filter-Dialog. It contains several lists of filters. For Each List I use a LazyVerticalGrid. The filter-lists require more space than is available on screen so I wanted to place them inside a Column and make it scrollable.

Thomas Dougherty

03/24/2022, 6:25 PM

I believe you can achieve that same effect within a LazyColumn itself. Something like:

LazyColumn {
    // Add a single item
    item {
        Text(text = "Header")
    }

    // Add first filters list
    items(firstFiltersList) { filter ->
        Text(text = "Filter: $filter")
    }

    // Add another single item
    item {
        Text(text = "Another Header")
    }

    // Add second filters list
    items(secondFiltersList) { filter ->
        Text(text = "Filter: $filter")
    }
}

Your filter lists would each go in their own items block and the content displayed can be different. I am by no means an expert on Lists in compose yet, but I’m pretty sure there’s no way currently to add the LazyVerticalGrid into a scrollable column.

Tobias Gronbach

03/24/2022, 6:29 PM

Yeah maybe I'll go with that approach. I had those Grid-Component already available in a seperate Composable that was quite nicely designed with all the logic and I hoped to be able to just reuse it. But thanks a lot for your idea! I guess I'll go with that approach! 👌

:60fps_parrot: 1

View count: 19