Hi everyone, I am using MotionLayout to animate the font size change on Text but I can’t get it wor...

# compose

[Abdul Hafeez Sajid]

Hi everyone,

I am using MotionLayout to animate the font size change on Text but I can’t get it working. Can anyone highlight the issue with the code given in thread.

Thanks

[Abdul Hafeez Sajid]

@OptIn(ExperimentalMotionApi::class)
@Composable
fun MyText(progress: Float) {
    MotionLayout(
        modifier = Modifier
            .background(Color.LightGray)
            .fillMaxWidth().fillMaxHeight(),
        motionScene = MotionScene(
            content = """
                {
                  ConstraintSets: {
                    start: {
                        title: {
                        width: 'wrap',
                            top: ['parent', 'top'],
                            start: ['parent', 'start'],
                            end: ['parent', 'end'],
                            bottom: ['parent', 'bottom'],
                            custom: {
                                fontSize: 14,
                            }
                        },
                    },
                    end: {
                        title: {                            
                            top: ['parent', 'top'],
                            start: ['parent', 'start'],
                            end: ['parent', 'end'],
                            bottom: ['parent', 'bottom'],
                            custom: {
                                fontSize: 8
                            }
                        },
                    }
                  },
                  Transitions: {
                    default: {
                      from: 'start',
                      to: 'end'
                    }
                  }
                }
            """.trimIndent()),
        progress = progress
    ) {
        Text(
            text = "This is some text",
            modifier = Modifier
                .layoutId("title")
                .wrapContentWidth(unbounded = true),
            color = MaterialTheme.colors.onSurface,
            maxLines = 1,
            softWrap = false,
            fontSize = motionFontSize("title", "fontSize")
        )
    }
}