Channels
#compose
Title
# compose
g
Grigorii Yurkov
11/03/2020, 6:35 PMRowTexta
Afzal Najam
11/03/2020, 6:36 PMThat sounds like a bug, doesn't it?
g
Grigorii Yurkov
11/03/2020, 6:37 PMI think it's an optimisation. But looks like a bug
a
Adam Powell
11/03/2020, 7:03 PMcan you describe the case a bit more? What caused the
TextTextI ask because layout and composition are different processes that invalidate differently
it is quite valid and expected for a
Rowg
Grigorii Yurkov
11/03/2020, 7:09 PMI replace text in
Texta
Adam Powell
11/03/2020, 7:10 PMCan you post the code in question?
g
Grigorii Yurkov
11/03/2020, 7:12 PMOk, I will try to create the test one
👍 1
Copy code
@OptIn(ExperimentalAnimationApi::class)
@Preview
@Composable
fun MyTest() {
var text by remember { mutableStateOf("0") }
var visible by remember { mutableStateOf(false) }
TestTheme {
Row(modifier = Modifier.fillMaxWidth().height(30.dp)) {
Spacer(
modifier = Modifier.weight(1f).background(Color.Red).height(30.dp).clickable(
onClick = {
visible = true
}
)
)
AnimatedVisibility(visible = visible) {
Text(text, modifier = Modifier.clickable {
text += "0"
})
}
}
}
}I figured out that if
visibletruefalsea
Adam Powell
11/03/2020, 8:10 PMsilly question, what is, "fine" in this context? Based on reading the code above I would expect the contents of the
AnimatedVisibilityIs relayout not happening correctly?
g
Grigorii Yurkov
11/03/2020, 8:11 PMYes, after clicking on
TextSpacera
Adam Powell
11/03/2020, 8:15 PMhmm, @Doris Liu @George Mount maybe something in
AnimatedVisibilityg
Grigorii Yurkov
11/03/2020, 8:20 PMIt's definitely a bug, because it has different behaviour with same "state"
Switch visibility to
falsetrueI hope you understand what I'm trying to say
d
Doris Liu
11/03/2020, 8:31 PMThis does seem like a bug in
AnimatedVisibility👌 1
Out of curiosity, do you expect the size change (from text change) to be animated in
AnimatedVisibiltyg
Grigorii Yurkov
11/03/2020, 8:33 PMI do not
d
Doris Liu
11/03/2020, 8:37 PMCool. Me neither. 🙂
g
Grigorii Yurkov
11/03/2020, 8:40 PMBut know I wonder how to do it 🙂
d
Doris Liu
11/03/2020, 8:49 PMI'd suggest
Modifier.animateContentSize()🙏 1
More specifically:
Copy code
Text(text, modifier = Modifier.clickable {
text += "0"
}.animateContentSize() )h
Hitanshu Dhawan
11/07/2020, 4:33 PMHi @Doris Liu, I wanted to animated my Text composable, so stumbled upon this thread.
I the video below I am using PropKeys for alpha, size, color of components, but for text I’m using
Modifier.animateContentSize()d
Doris Liu
11/07/2020, 8:08 PMYes. The intended behavior is to change the content (in this case the text) immediately and animate the container size afterwards. Is there a specific effect you are hoping to achieve?
The best way to achieve this interaction is to use propkeys for the colors, and alpha, and perhaps a custom
AnimationSpecanimateContentSizeAnimatedVisibilityh
Hitanshu Dhawan
11/07/2020, 8:19 PMYes, I have used propKeys for color and alpha, what I want is that when we unselect the button, it animates smoothly but right now it is first changing ADDED to ADD and then animating it.
I want ADDED to smoothly animate to ADD.
Basically reverse of when the above interaction goes from ADD to ADDED.
Great suggestion on check mark animation, will surely try that too 🙂
The intended behavior is to change the content (in this case the text) immediately and animate the container size afterwards.In my case I may want the content to change afterwards, is this achievable? or any other way to achieve this interaction?
d
Doris Liu
11/07/2020, 8:27 PMThe trouble is we don't know the target size to animate to without changing the text. We might have a different API to support that going forward. For now, here's an unconventional idea: put "ED" in a separate text and animate that in/out using
AnimatedVisibilityh
Hitanshu Dhawan
11/07/2020, 8:45 PM4 Views