Hi, I have a little experiment. And I have some qu...

# compose

[Jast Lai]

Hi, I have a little experiment. And I have some question.

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            Greeting("Text")
        }
        lifecycleScope.launch {
            delay(1000)
            repeat(100) {
                delay(10)
                animationPoint.value = animationPoint.value + 1
            }
        }
    }
}

var animationPoint = mutableStateOf(0)

@Composable
fun Greeting(aText: String) {
    Surface(
        modifier = Modifier.offset(
            x = animationPoint.value.dp
        )
    ) {
        Column {
            repeat(40) {
                Text("Text")
            }

        }
    }
}

this will make those Texts from left to right. It seem smooth and without any question.

But if I change like this Text content to parameter.

@Composable
fun Greeting(aText: String) {
    Surface(
        modifier = Modifier.offset(
            x = animationPoint.value.dp
        )
    ) {
        Column {
            repeat(40) {
                Text(aText)
            }

        }
    }
}

It will feel lag and obviously has drop some frame.
I wonder what difference between those two method ?
And If I don't wanna drop frame, How should I do ?

[Tolriq]

This is due to recomposition, docs does not emphase enough that you should most of the time never use offset(x,y) for animations but offset(offset: Density.() -> IntOffset) as the primer does trigger recomposition and not the second one.

[Jast Lai]

But why dose second one not trigger recomposition？It show no difference with first one for only using parameter.

[Tolriq]

Read their respective description 😉

[Tolriq]

This modifier is designed to be used for offsets that change, possibly due to user interactions. It avoids recomposition when the offset is changing, and also adds a graphics layer that prevents unnecessary redrawing of the context when the offset is changing.

[Tolriq]

As I said it's not visible enough in docs and hard to troubleshoot, but use the second version and you'll see the difference 🙂

[Jast Lai]

Ok . I would try to find clue in description . I just can't get why value and parameter difference can effect modifier's behavior.

[Tolriq]

It does not affect the modifier behavior, it affects the recomposition. In one case the content is static compose is smart enough to not recompose, in the second case the value is a parameter it does recompose. But the fact that recomposition is skipped with fixed text is side effect it's not what happens in normal case.

[Jast Lai]

Oh.... I got it . Thank you. Happy with your answer. I should put the attention on animation without using offset. 😄

[Tolriq]

use offset but the right one. It works nicely with the offset { } version.

[Tolriq]

Check https://www.jetpackcompose.app/articles/donut-hole-skipping-in-jetpack-compose and LogCompositions it helps understanding things sometimes.

[Jast Lai]

I would check it, Thank you kindly.