Android Weekly Issue #501
Jetpack Compose: Preview
@Preview的基本用法是無參數(shù)的.
還可以用它:
- render不同設(shè)備上的效果.
- group多個previews.
- preview不同的字體大小和不同的顯示拉伸.
- preview不同的theme, 語言, 屏幕方向.
- 使用
@PreviewParameter注解來生成多個preview. - 生成截圖測試.
基本使用
可以給一個composable function加多個@preview:
@Preview(locale = "en", showBackground = true)
@Preview(locale = "ru", showBackground = true)
@Preview(locale = "ar", showBackground = true)
@Composable
fun Preview_CoffeeDrinkItem() {
CoffeeDrinkItem(
title = stringResource(R.string.espresso_title),
ingredients = stringResource(R.string.espresso_ingredients),
icon = R.drawable.espresso_small
)
}
@Preview的各個參數(shù)的用途.
居然還有簡單的互動模式.
進階使用
用@PreviewParameter來提供參數(shù)(用于preview的數(shù)據(jù)).
后面講了各種配置的排列組合.
screenshot test
推薦了: Showkase
另一種方案是Shot
Exploring Material You for Jetpack Compose
新一代的material design: Material You.
其中一個重要的元素是動態(tài)顏色系統(tǒng), 可以根據(jù)用戶的壁紙build出一個color scheme.
compose-material3:
https://developer.android.com/jetpack/androidx/releases/compose-material3
本篇文章也有個demo.
