تم إنشاء Jetpack Compose Glimmer استنادًا إلى Jetpack Compose ويتضمّن عناصر قابلة للإنشاء ومكوّنات وسلوكيات ومظهرًا مصمَّمًا لنظارات الذكاء الاصطناعي المزودة بشاشة. باستخدام Glimmer، يمكنك إنشاء واجهة مستخدم أصلية لنظارات الذكاء الاصطناعي باستخدام Compose، ما يتيح لك تقديم تجارب تطبيقاتك بطريقة تفاعلية باستخدام رموز أقل وأدوات فعّالة وواجهات برمجة تطبيقات سهلة الاستخدام بلغة Kotlin.
عناصر Glimmer القابلة للإنشاء في Jetpack Compose
توفّر مكتبة Jetpack Compose Glimmer دوال @Composable مصمّمة خصيصًا لشاشات نظارات الذكاء الاصطناعي، مثل Text وButton وListItem. في ما يلي بعض الخصائص الفريدة لعناصر Glimmer القابلة للإنشاء في Jetpack Compose:
- التصميم المبسّط: يتم تلقائيًا ضبط خلفيات مكوّنات
Surface، مثلاً، على اللون الأسود أو الشفاف لتحسين العرض المرئي. - إعدادات تلقائية محسّنة للألوان: تحسب مكتبة Jetpack Compose Glimmer لون المحتوى استنادًا إلى لون الخلفية تلقائيًا، لذلك نادرًا ما يحتاج المطوّرون إلى ضبط ألوان النص يدويًا، ما يؤدي إلى تحسين إمكانية القراءة بدون أي عمل إضافي.
التركيز المميّز: يتم الإشارة إلى التركيز باستخدام ملاحظات مرئية مستندة إلى المخطط التفصيلي بدلاً من تأثير التموّج، ما يعزّز الوضوح.
الشكل 1. ثلاث حالات تركيز في Glimmer من Jetpack Compose، يتم التمييز بينها باستخدام ملاحظات مرئية مستندة إلى المخطط التفصيلي. الارتفاع المحسّن: تستخدم أداة Glimmer في Jetpack Compose عددًا محدودًا من الظلال المربعة لتحقيق الفصل المرئي.
الشكل 2. خمسة مستويات ارتفاع في Jetpack Compose Glimmer، يتم التمييز بينها باستخدام عدد محدود من الظلال المربعة.
مكوّنات Glimmer في Jetpack Compose
تتضمّن ميزات Glimmer في Jetpack Compose مجموعة من المكوّنات المصمَّمة خصيصًا، على غرار المكوّنات في Jetpack Compose، ولكن تم تحسينها خصيصًا لتلبية المتطلبات المرئية والتفاعلية الفريدة لنظارات الذكاء الاصطناعي. يمكن تخصيص مكوّنات Glimmer في Jetpack Compose باستخدام سمة Glimmer في Jetpack Compose، كما أنّها تستند إلى ميزات Compose ذات المستوى الأدنى لدعم بيانات أدخلها المستخدم، مثل النقر والتمرير سريعًا بشكل تلقائي.
لمزيد من المعلومات حول استخدام مكوّن معيّن، يُرجى الاطّلاع على الأدلة التالية:
إذا لم يكن أحد هذه المكوّنات العالية المستوى مناسبًا لحالة الاستخدام، يمكنك استخدام surface لإنشاء مكوّن مخصّص. مساحات العرض هي أبسط وحدة إنشاء أساسية في Jetpack Compose Glimmer، وهي عبارة عن لوحة فارغة لأي تصاميم أو تفاعلات مخصّصة ومحدّدة تريد إنشاءها.
معدِّلات Jetpack Compose Glimmer
تعمل المعدِّلات في وظيفة Glimmer في Jetpack Compose بشكل مطابق لمعدِّلات Compose، ما يتيح لك تحسين العناصر القابلة للإنشاء من خلال تخصيص تخطيطها ومظهرها وسلوكها. قد يقدّم Jetpack Compose Glimmer معدِّلات معيّنة أو يطبّق إعدادات تلقائية فريدة خاصة بالنظارات لتوفير ملاحظات مرئية وأداء أفضل.
عمق Jetpack Compose Glimmer
تستخدم مكوّنات Glimmer في Jetpack Compose العمق لتمثيل التسلسل الهرمي، ما يساعد في التمييز بصريًا بين العناصر التي يتم عرضها فوق (أعلى) البطاقات الأخرى. تشير العمق في نظارات الذكاء الاصطناعي إلى مزيج من الموضع في المساحة z والظلال. بالنسبة إلى معظم المكوّنات ذات المستوى العالي، مثل عناصر القائمة، يتم تطبيق العمق تلقائيًا استنادًا إلى حالة التركيز. عند التركيز على أحد المكوّنات، يزداد عمقه، وعندما يتم إيقاف التركيز عليه، يعود إلى حالته العادية. ومع ذلك، للعمل مع المكوّنات المخصّصة، يمكنك استخدام المَعلمة depth في Modifier.surface أو Modifier.depth.
مظهر Glimmer في Jetpack Compose
تتضمّن ميزة Glimmer في Jetpack Compose نظامًا مخصّصًا لتطبيق السمات على نظارات الذكاء الاصطناعي.
يستخدم مظهر Jetpack Compose Glimmer لوحة ألوان مبسطة ومحسّنة، بالإضافة إلى أسلوب الخطوط والأشكال. يساعد ذلك في زيادة مستوى ظهور نظارات الذكاء الاصطناعي إلى أقصى حدّ، كما يضمن عرض المعلومات بشكل موجز. تم تصميم جميع مكوّنات Jetpack Compose Glimmer لتتكامل تلقائيًا مع طرق الإدخال المحدّدة لنظارات الذكاء الاصطناعي. يتم عرض مظهر Glimmer في Jetpack Compose باستخدام الفئة GlimmerTheme.
مثل المظاهر الأخرى في Jetpack Compose، يتضمّن GlimmerTheme العديد من الأنظمة الفرعية، وهي: الألوان والأشكال وأسلوب الخط والأيقونات (علم الرموز). يتضمّن مظهر Jetpack
Compose Glimmer أيضًا مكوّنات Jetpack Compose Glimmer
التي يمكنك تخصيصها.
الألوان
يتضمّن نظام الألوان في Glimmer من Jetpack Compose سبعة ألوان في لوحة الألوان المحسَّنة، وهي مصمَّمة لتحقيق الحد الأقصى من الوضوح والاختصار على شاشات نظارات بالذكاء الاصطناعي التي لا تعرض القيم السوداء.
GlimmerThemeيُرجى العلم أنّ ألوان "في ..." لا يتم عرضها من خلال GlimmerTheme. يتم احتساب هذه الألوان تلقائيًا من خلال النظام استنادًا إلى لون الخلفية.
يتم عرض هذه الألوان من خلال GlimmerTheme.colors.primary، مع قيم لكل دور من أدوار الألوان كما هو موضّح في الجدول التالي:
دور اللون |
الإعدادات التلقائية |
|---|---|
أساسي |
#9BBFFF |
ثانوي |
#4C88E9 |
إيجابي |
#63FEA8 |
سالب |
#FFA7A0 |
مساحة عرض |
#262626 |
مخطط |
#606460 |
outlineVariant |
#42434A |
يُرجى العِلم أنّه على الرغم من أنّ surface وoutline وoutlineVariant مصنّفة على أنّها قابلة للتخصيص، ننصحك بشدة بعدم تخصيص هذه القيم.
الأشكال
يحدّد نظام الأشكال في Jetpack Compose Glimmer مجموعة من المعالجات القياسية للزوايا والأشكال الهندسية للمكوّنات، وهو مصمَّم لإنشاء لغة مرئية متسقة وبسيطة على واجهات المستخدم الخاصة بنظارات الذكاء الاصطناعي، مع عرض جميع الأشكال من خلال GlimmerTheme.shapes.
أسلوب الخط
يتضمّن نظام أسلوب الخط في Jetpack Compose Glimmer ستة أنماط خطوط لضمان الوضوح والإيجاز على شاشات نظارات الذكاء الاصطناعي. تم تصميم هذه الأنماط
لزيادة التباين إلى أقصى حد وتحسين إمكانية قراءة النص من خلال استخدام خطوط أكثر سمكًا،
وتباعد أكبر بين الأحرف، وارتفاعات مناسبة للأسطر. يتم عرض هذه الأنماط من خلال
GlimmerTheme.typography.
الرموز
تم تصميم نظام الرموز في Glimmer من Jetpack Compose ليتكامل بشكل متسق مع اللغة المرئية المبسّطة لواجهات المستخدم الخاصة بنظارات الذكاء الاصطناعي، وغالبًا ما يستخدم أشكالاً دائرية مثل Material Symbols Rounded لتحقيق أفضل مستوى من سهولة القراءة.