kotlinlang #compose

To move a shape around, I can use Modifier.pointerInput etc. Now how about a rectangle on canvas? As there is no Modifier. Is there a way with Compose or should I use the native way?

Nthily

04/04/2021, 12:32 PM

Can anyone tell me how to use FocusState with the latest version of focus? I want to determine if my TextField is in the focus state

Muhammad Zaryab Rafique

04/04/2021, 5:07 PM

Hey Everyone, I successfully toggle between dark theme to light and light to dark, but I facing issue storing to shared preference. Anyone have idea of this

enighma

04/04/2021, 7:39 PM

I've started playing with

NavHost

I love the way I can setup navigation with it. What I'm trying to understand is how I can get it to animate. I see that when I call

navigate()

I have a lambda where I can provide options such as Anim. I have something like this:

navController.navigate(Destination.newGame) {
  anim { enter }
}

I'm guessing that I haven't defined the enter animation, since no animation is defined. Where do I define that? In the MaterialTheme somehow?

Slackbot

04/04/2021, 9:16 PM

This message was deleted.

zsperske

04/04/2021, 10:28 PM

Has anyone written a composable that can display an image from firebase storage? I had something working on an older alpha but I’m curious if there’s a new option.

Colton Idle

04/04/2021, 11:42 PM

What's the keyboard shortcut to wrap a composable in a Col or Row quickly? I highlighted a Text("adsf") and wanted to "surround with" with a Column. I thought there was a way to do this out of the box? I searched slack but only result was regarding a plugin, but I thought this came out of the box?

Colton Idle

04/05/2021, 12:40 AM

It looks like

ExposedDropdownMenu

from material android isn't available out of the box. Does anyone have a good gist to use as a replacement? I'm trying to create this from the docs.

Ravi

04/05/2021, 2:38 AM

hi, im using lazyrow to display horizontal instagram suggestions kind of list . And this is part of lazycolumn list item. When i use

IntrinsicSize.Min

its giving me Intrinsic measurements are not currently supported by SubcomposeLayout
. description text vary from 1-2 lines how to maintain common height for all the row elements

LazyRow(
        state = listState,
        modifier = modifier.height(IntrinsicSize.Min),
        horizontalArrangement = Arrangement.spacedBy(8.dp),
    )

Zhelyazko Atanasov

04/05/2021, 6:09 AM

I'm trying to build a simple screen, but I'd want to restrict the

width

of a

Column

to a percentage of the screen width. So I'm using

Modifier.fillMaxWidth(0.8f)

but the

Column

is still occupying the max screen width. Is this an expected behaviour and I haven't fully understood the

fraction

argument or it's some kind of a bug? I'm using

beta03

If that matters, the

Column

is put inside a

Surface

with

fillMaxSize()

set.

Column(
        modifier = Modifier
            .fillMaxWidth(0.8f)
            .fillMaxHeight()
            .background(Color.Green)
    ) {
        val (email, setEmail) = remember { mutableStateOf(TextFieldValue()) }
        TextField(
            value = email,
            onValueChange = { setEmail(it) },
            modifier = Modifier
                .align(CenterHorizontally)
        )
    }

Marko Novakovic

04/05/2021, 6:57 AM

when using

var state by remember { mutableStateOf(…) }

I get error saying there are no

get

and

set

methods BUT I have

import androidx.compose.runtime.getValue
import androidx.compose.runtime.setValue

and they are grey, not used. same

get

and

set

methods error when using

import androidx.compose.runtime.*

Any fix?

Marko Novakovic

04/05/2021, 7:20 AM

remember {}

saves X for recomposition but when composable leaves the screen X is forgotten. if I want to save X even when composable leaves the screen I should use

rememberSaveable {}

right? it seems weird because concept of

rememberSaveable {}

is for surviving

recreating

but composable leaving the screen is not

recreation

. conceptually not the same. should I use

rememberSaveable {}

or there is some other way to handle this use case?

Utkarsh Tiwari

04/05/2021, 4:12 PM

Is there any way to disable scroll and clicks on children in a LazyColumn?

Colton Idle

04/05/2021, 11:12 PM

I have this design that I recreated from figma/sketch from my designer. These two text fields don't have any spacers between them in sketch. It looks like it's just line height that's being taken into account... but my composable ends up looks squished. Like it's right on top of each other with no space. The only idea I have in mind is that compose/android doesn't "show" the space below a line if it's a single line? Because this type style does indeed have line spacing added in the Type delcaration, but it just doesn't seem to have it at runtime. It's part of our design system and so I can't quite rip it out in order to create a minimal reproducible sample, but I was curious if anyone had any ideas. I know compose doesn't have an option to disable fontPadding, but in this case... it's almost like I expected even more font padding. @Siyamed any thoughts? I know I talked about this to you on twitter I think like monttttths ago as one of my worst things in the current view based system is matching my designers with text. There's always some slight spacing issue. iOS seems to look just fine and so now I have to manually put in paddingBottom on the top Text. thanx

Chris Fillmore

04/06/2021, 1:12 AM

Hi everyone. Am I allowed to declare a

@Composable

method on an interface? something like:

interface ImageLoader {
  @Composable
  fun Image(url: String)
}

I have similar code implemented right now, which compiles but throws NoSuchMethodError at runtime

:yes: 1

Chris Fillmore

04/06/2021, 1:14 AM

to clarify, of course I have an implementation elsewhere, like:

class CustomImageLoader : ImageLoader {
  @Composable
  override fun Image(url: String) {
    // Load and draw the image
  }
}

Socheat KHAUV

04/06/2021, 2:51 AM

CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.medium) {
    AndroidView(
        factory = { context ->
            PreviewView(context).apply {
                this.layoutParams = ViewGroup.LayoutParams(
                    ViewGroup.LayoutParams.MATCH_PARENT,
                    ViewGroup.LayoutParams.MATCH_PARENT
                )
                preview.setSurfaceProvider(this.surfaceProvider)
            }
        },
        modifier = Modifier.fillMaxSize()
    )
}

I wrapped a camera preview within CompositionLocalProvider and gave an alpha value to medium, it does not work. anyone have some idea ?

darkmoon_uk

04/06/2021, 4:20 AM

Any news on when a Kotlin 1.5 compatible Compose Beta is likely to hit the shelves? Some time after the 1.5 production release?

Ahmet Delibaş

04/06/2021, 7:09 AM

Hi folks. I wanted to observe a livedata value. I started the process in a composable and then I switched the screen. If I don't switch the screen, I can observe the changing livedata in the same composable. But when I switched it, I cannot observe anymore. Do you guys have any idea?

Marko Novakovic

04/06/2021, 8:12 AM

class TestData(val test: String)

@Composable
fun StableTest() {
    var state by remember { mutableStateOf(TestData("Marko")) }

    SideEffect {
        println(state.test)
    }

    Text(
        modifier = Modifier
            .clickable { state = TestData("Marko") }
            .padding(32.dp),
        text = state.test,
    )
}

this triggers recomposition,

TestData

is not stable, but

data class TestData(val test: String)

doesn’t. Is there a reason to additionally mark

data class

with

@Stable

? or is

@Stable

kind of forcing stability? but adding

@Stable

to non

data class

version still triggers recomposition

Jason Ankers

04/06/2021, 8:28 AM

Any reason why

AnimatedVisibility

doesn’t have a callback when the animation finishes?

Colton Idle

04/06/2021, 12:11 PM

If I have a pure compose app that is a single activity and I'm already using Chris Banes' Accompanist for insets, and I want to be laid out edge to edge, what kind of theme comes out of the box that allows me to set a transparent navigation and status bar? The closest I could find is

android:theme="@android:style/Theme.Material.Light.NoActionBar.TranslucentDecor"

but I was hoping to find something like

Theme.Material.Light.NoActionBar.EdgeToEdge

Nat Strangerweather

04/06/2021, 2:56 PM

I am using an AndroidView composable to show a non-Compose canvas in my Compose UI. In my non-Compose onDraw (), I can save my canvas as a bitmap successfully. The problem is that I want to save the bitmap from the onclick of a Button composable in my UI. Saving works but the bitmap is black. What could I be missing?

Daniel Candeias

04/06/2021, 3:57 PM

Currently struggling with simple animations. If someone can take a look at SO question: https://stackoverflow.com/questions/66971191/android-compose-animation-like-horizontal-progress-indicator Any help appreciated 🙏

Zach Klippenstein (he/him) [MOD]

04/06/2021, 4:05 PM

Something that trips up a lot of people when they’re first learning Compose is remembering all the different bits of magic that go into making lines like this:

var text by remember { mutableStateOf("") }

I made a little cheat sheet to help break it down, and hopefully serve as a quick reference if you forget.

😽 1

❤️ 29

👌🏼 3

👌 17

Yuri Drigin

04/06/2021, 4:57 PM

Hi folks! How can scroll to the focused textfield when soft keyboard appear. Use Simple Column with vertical scroll

Gabriel Melo

04/06/2021, 8:24 PM

I have a screen with a Scaffold, a FAB in its slot and a LazyColumn as content. I'd like to show a Card at the bottom of the screen without it overlapping my FAB. Is there any slot in a Scaffold where I could put this Card? If not, how can I have it not overlap the FAB if they're not children of the same view? Is this even doable with Scaffold?

Shivam Sethi

04/07/2021, 12:24 AM

How can I pass a

String argument

having spaces or newline escape sequence from 1

destination

to another ? I am using

navigation compose

currently it breaks if I try to do it according to documentation ? here the destination

NEXT/${argument}

breaks if argument string has space in it ?

Colton Idle

04/07/2021, 12:26 AM

Found a reproducible(?) case of preview not working. Basically just using a color from a custom theme as a background causes preview to fail. Code in thread. Stacktrace snippet:

Render Problem
java.lang.IllegalStateException: No RollerToasterColorPalette provided   at com.rollertoaster.app.theme.ThemeKt$AmbientRollerToasterColors$1.invok

Filip Wiesner

04/07/2021, 8:14 AM

I have a stupid question. If we remember some value and save it to a variable like this

var foo = remember { "hello" }

, when we mutate the variable (

foo = "world"

) it won't save it to next recomposition, right? We just mutate the variable in the current function scope.

Title

Filip Wiesner

04/07/2021, 8:14 AM

I have a stupid question. If we remember some value and save it to a variable like this

var foo = remember { "hello" }

, when we mutate the variable (

foo = "world"

) it won't save it to next recomposition, right? We just mutate the variable in the current function scope.

I am unsure because I know I've done something like this in my early compose experiments and it worked but I know it shouldn't 😅

And I am writing article about compose basics and I want to be sure I don't write something stupid.

wbertan

04/07/2021, 8:23 AM

I believe so, in your case you have to do

foo.value = newValue

and to access the value with

foo.value

. To use the Delegate you have to use the `by`:

var foo by remember { mutableStateOf("hello") }
        foo = "newValue"

Filip Wiesner

04/07/2021, 8:25 AM

I am not using

State

tho so there is no

foo.value

and no delegate.

🤔 1

julioromano

04/07/2021, 8:26 AM

In “theory” yes. But IMHO it’s not good practice because composable function calls can be run in any order by the compose runtime. If you rely on changing

foo

the way you mentioned, it will be difficult to ensure all composable functions that have

foo

visible in their scope see the same mutated value of

foo

. If you need mutable state you should remember a

mutableStateOf("hello")

Filip Wiesner

04/07/2021, 8:31 AM

Maybe I didn't explain myself properly. I know I shouldn't do this and I would never do. In my article I am trying to explain the meaning of

remember

and

State

separately because I don't want the reader to understand

remember { mutableStateOf() }

as one thing. While explaining this I realized that I am not 100% sure that I know how it will behave so I just wanted to make sure 😄

it will be difficult to ensure all composable functions that have
foo
visible in their scope

So if some inner composable function recomposes, will it get the new value of

foo

variable?

julioromano

04/07/2021, 8:40 AM

So if some inner composable function recomposes, will it get the new value of
foo
variable?

~~I think the safe answer here is “it’s not possible to know it reliably”, but I feel like I’m reaching the edge of my knowledge here, I’m sure somebody else might give a better answer.~~ Updated answer: Yes, but only if it recomposes after

foo

has been mutated.

:thank-you: 1

Albert Chang

04/07/2021, 8:56 AM

remember

always returns the same instance produced by executing the block in the first composition.

foo

is just a pointer so changing the value

foo

points to doesn't affect what

remember

returns.

So if some inner composable function recomposes, will it get the new value of
foo
variable?

The inner function captures the pointer so I think the answer is yes.

Filip Wiesner

04/07/2021, 8:59 AM

I think that's all I need. Thank you both @julioromano @Albert Chang 👌

(I almost wrote "closing this issue" 🤦‍♂️ )

julioromano

04/07/2021, 9:20 AM

@Albert Chang Isn’t it possible that the inner function gets re-run directly by compose (i.e. only the inner function is re-run, the outer function is not)? Perhaps because the inner function was reading some other snapshot state object which has changed. (Sorry if the question sounds weird, I’m deliberately trying to test my mental model of the subject.)

Albert Chang

04/07/2021, 9:22 AM

@julioromano As I said what the inner function captures is the pointer which always points to the latest value.

julioromano

04/07/2021, 9:32 AM

Got it, so if the code was actually:

var foo = remember { "hello" }
  foo = "newValue"

It means that any other code will see “newValue”, so in this case the

remember

call is useless, it’s just polluting the composition by adding a “hello” string to it that will never be read. I get that @Filip Wiesner is asking this for teaching purposes, I just wanted to be sure such a “pattern” would never be actually useful in real life.

Filip Wiesner

04/07/2021, 9:35 AM

in this case the
remember
call is useless, it’s just polluting the composition by adding a “hello” string to it that will never be read

(nitpicking a little bit) It will be read exactly once and assigned to the variable but other than that, that's exactly how I understand it.

julioromano

04/07/2021, 9:39 AM

Ah yes, during recompositions the memoized “hello” will be read from the composition and assigned to

foo

briefly, just to be overwritten by “newValue” right after.

:yes: 1

Filip Wiesner

04/07/2021, 9:40 AM

For sake of completeness, here is the section of the article I was writing:

👍 1

julioromano

04/07/2021, 10:36 AM

The case I was thinking about earlier is similar to @Filip Wiesner ’s last example but adds another composable (a

Button

) that recomposes on each click (recomposition is triggered thanks to

someState

snapshot state object):

@Composable
private fun MyOuterComposable() {
    Column {
        var searchValue = remember { "" }
        var someState by remember { mutableStateOf(".") }
        OutlinedTextField(
            value = searchValue,
            onValueChange = { searchValue = it },
        )
        Button({ someState = someState.plus(".") }) {
            Text("someState: $someState - searchValue: $searchValue")
        }
    }
}

The value of

searchValue

that

Button

displays depends on when

Button

has been recomposed. If it recomposes after

searchValue

has been mutated then it will show the mutated value, otherwise not. Since the order in which composables (i.e.

Button

in this case) recompose may not always be reliably predicted, we can’t be sure which value of

searchValue

will be read by

Button

. Disclaimer: this kind of code is just for learning purposes, it should never be used in production.

Filip Wiesner

04/07/2021, 10:50 AM

Learning about Compose is so exciting! 😄 I can't wait for when I'll use it on a real project.

Sean McQuillan [G]

04/07/2021, 4:33 PM

Yes this works as expected (which is not to work due to string immutability), though it's not a recommended practice for the reasons outlined above. If you put a mutable value in there, you can use it to update stored values without triggering recomposition, which we do using https://cs.android.com/androidx/platform/frameworks/support/+/androidx-main:compose/[…]kotlin/androidx/compose/ui/node/Ref.kt?q=Ref%3CT%3E%20compose

Which I can't find a usage of in remember anywhere anymore

TL;DR don't do that unless you're really really sure you know what you're doing and you're building alternative effects like

Reducer(...)

Prev(...)

🙂

julioromano

04/07/2021, 4:40 PM

What are

Reducer(...)

Prev(...)

? Are they something in compose? Or you mean Reducer as in Redux ?

Sean McQuillan [G]

04/07/2021, 4:40 PM

You can make a composable function that does reducer behavior, which will require access to the previous value; none of this is part of Compose but it's possible to write and you'll need a Ref somewhere in there 🙂

😮 1

View count: 2