أزرار الرموز في Glimmer من Jetpack Compose

أجهزة XR المشمولة
تساعدك هذه الإرشادات في إنشاء تجارب لهذه الأنواع من أجهزة XR.
نظّارة ذكية

في Glimmer من Jetpack Compose، IconButton هو مكوّن تفاعلي مضغوط يُستخدم لعرض إجراءات تكميلية بنقرة واحدة.

تظهر أزرار الرموز أصغر من الأزرار العادية، ولكنها تحتفظ بحدود مادية لضمان سهولة التفاعل على النظارات.

بالنسبة إلى حالات الاستخدام الأخرى، تتوفّر أيضًا أزرار عادية وأزرار تبديل.

مثال على بعض الأنماط المختلفة لأزرار الرموز في Glimmer من Jetpack Compose تعرض هذه الأمثلة خمس حالات لزر الرمز: مفعَّل (1)، ومحدَّد (2)، ومضغوط (3)، وغير مفعَّل (4)، وغير مفعَّل ومحدَّد (5).

المقاسات والأبعاد

العنصر البُعد

الحد الأدنى لحجم الحاوية

‫48 × 48 وحدة بكسل مستقلة الكثافة

حجم الرمز الداخلي

‫32 × 32 وحدة بكسل مستقلة الكثافة

المسافة التلقائية بين المحتوى والحواف

GlimmerTheme.componentSpacingValues.small

الولايات

تغيّر أزرار الرموز في Glimmer من Jetpack Compose مظهرها للإشارة إلى حالتها.

  • مفعَّل: هي حالة التفاعل التلقائية.
  • التركيز: يتم تطبيق GlimmerTheme.depthEffectLevels.level1 وتظليل الحدود مع التركيز.
  • مضغوط: يطبّق طبقة بيضاء شبه شفافة على السطح.
  • غير مفعّل: الزر غير تفاعلي وتمت إزالة الملاحظات المرئية.

الإعدادات التلقائية لزر الرمز

تنطبق الإعدادات التلقائية التالية على أزرار الرموز:

  • الشكل: القيمة التلقائية هي GlimmerTheme.shapes.large (عادةً ما يكون دائريًا).
  • اللون: يتم ضبطه تلقائيًا على GlimmerTheme.colors.surface.
  • لون المحتوى: يتم احتسابه تلقائيًا من لون الخلفية ما لم يتم توفيره بشكل صريح.
  • المساحة المتروكة للمحتوى: توفّر المساحة التلقائية بين الرمز وحافة الحاوية.
  • الحدّ الأدنى للحجم: قيمة 48.dp ثابتة لمنع الأزرار من أن تصبح صغيرة جدًا بحيث يتعذّر التفاعل معها.
  • حجم الرمز: يتم ضبطه تلقائيًا على GlimmerTheme.iconSizes.small (32.dp).

مثال: زر الرمز

ينشئ الرمز البرمجي التالي زر رمزًا يتضمّن الخصائص التلقائية:

@Composable
fun IconButtonSample() {
    IconButton(onClick = {}) { Icon(FavoriteIcon, "Localized description") }
}