تتيح القوائم للمستخدمين اختيار عنصر من مجموعة خيارات على أجهزة Wear OS.
تستخدم العديد من أجهزة Wear OS الشاشات المستديرة، ما يصعّب رؤية عناصر قائمة المحتوى التي تظهر بالقرب من أعلى وأسفل الشاشة. ولهذا السبب، يشتمل
تطبيق Compose for Wear OS على إصدار من الفئة LazyColumn
يُسمى
ScalingLazyColumn
، والذي يتيح تأثيرات التحجيم والتلاشي. عندما تتحرك العناصر باتجاه وسط الشاشة،
تصبح أكبر وأكثر تعتيمًا.
توضح الرسوم المتحركة التالية كيف يتغير حجم العنصر وشفافية العنصر أثناء تحركه على الشاشة:
يوضح مقتطف الرمز التالي كيفية إنشاء قائمة تحتوي على نص لكل عنصر:
val contentModifier = Modifier
.fillMaxWidth()
.padding(bottom = 8.dp)
@Composable
fun WearApp() {
WearAppTheme {
// Hoist the list state to remember scroll position across compositions.
val listState = rememberScalingLazyListState()
ScalingLazyColumn(
modifier = Modifier.fillMaxSize(),
autoCentering = AutoCenteringParams(itemIndex = 0),
state = listState
) {
item { TextItem(contentModifier, stringResource(R.string.first)) }
item { TextItem(contentModifier, stringResource(R.string.second)) }
}
}
}
@Composable
fun TextItem(modifier: Modifier = Modifier, contents: String) {
Text(
modifier = modifier,
textAlign = TextAlign.Center,
text = contents
)
}
إضافة تأثير انطباق الكاميرا
يمكنك إضافة سلوك الانطباق إلى إيماءات الأصابع التي يطبّقها المستخدم
على عناصر ScalingLazyColumn
. يساعد هذا التأثير المستخدمين في التنقل بدقة أكبر بين
العناصر في القائمة مع مساعدتهم أيضًا على التحرك بسرعة أكبر عبر
قائمة طويلة.
لإضافة هذا التأثير إلى قائمة أو أداة اختيار في تطبيقك، أدرِج
المَعلمة flingBehavior
في تعريف ScalingLazyColumn
كما هو موضّح في مقتطف الرمز التالي:
ScalingLazyColumn(
modifier = modifier ...,
flingBehavior = ScalingLazyColumnDefaults.snapFlingBehavior(
state = listState,
snapOffset = 0
// Exponential decay by default. You can also explicitly define a
// DecayAnimationSpec.
) {
// Contents of the list here.
}
لتطبيق سلوك مشابه للانطباق السريع على ScalingLazyColumn
عندما يتفاعل المستخدم
باستخدام القرص الدوار، استخدِم RotaryWithSnap
المتوفّر في تطبيق الأطوار على GitHub.