測試動畫

Compose 提供 ComposeTestRule，可讓您以確定性方式編寫動畫測試，並完全控管測試時鐘，方便您驗證中間動畫值。此外，測試的執行速度會比動畫的實際持續時間快。

ComposeTestRule 會公開測試時鐘做為 mainClock。您可以將 autoAdvance 屬性設為 false，以控制測試程式碼中的時鐘。啟動要測試的動畫之後，可使用 advanceTimeBy 將時鐘往前移動。

值得一提的是，advanceTimeBy 不會完全依照指定持續時間移動時鐘，而是將秒數四捨五入至最接近的持續時間，且為影格持續時間的倍數。

@get:Rule
val rule = createComposeRule()

@Test
fun testAnimationWithClock() {
    // Pause animations
    rule.mainClock.autoAdvance = false
    var enabled by mutableStateOf(false)
    rule.setContent {
        val color by animateColorAsState(
            targetValue = if (enabled) Color.Red else Color.Green,
            animationSpec = tween(durationMillis = 250)
        )
        Box(Modifier.size(64.dp).background(color))
    }

    // Initiate the animation.
    enabled = true

    // Let the animation proceed.
    rule.mainClock.advanceTimeBy(50L)

    // Compare the result with the image showing the expected result.
    // `assertAgainGolden` needs to be implemented in your code.
    rule.onRoot().captureToImage().assertAgainstGolden()
}
AnimationTestingSnippets.kt

為您推薦

• 注意：系統會在 JavaScript 關閉時顯示連結文字
• 測試 Compose 版面配置
• 其他考量
• 自訂動畫 {:#customize-animations}