توفّر ميزة Glance واجهة برمجة تطبيقات لإدارة مظهر الألوان. بالنسبة إلى سمات النمط الأخرى،
مثل TextStyle
، حدِّد المتغيّرات من المستوى الأعلى.
إضافة ألوان
تتيح لك ميزة "نظرة سريعة" تنفيذ ألوان متعددة الأبعاد خارج العلبة. لاستخدام المظهر المضمَّن، يمكنك إضافة GlanceTheme
إلى الجزء العلوي من الصفحة، كما هو موضّح في المثال التالي.
على الأجهزة التي تتوافق مع الألوان الديناميكية، تتم اشتقاق هذا المظهر من ألوان النظام الأساسي الخاصة بالمستخدم. وعلى الأجهزة الأخرى، يعود هذا إلى المظهر
الأساسي في Material. يمكنك استخدام GlanceTheme.colors
للنمط باستخدام ألوان من المظهر المُغلَّف. يمكنك استخدام هذه القيم من المظهر في أي مكان مطلوب فيه اللون.
override suspend fun provideGlance(context: Context, id: GlanceId) { provideContent { GlanceTheme { MyContent() } } } @Composable private fun MyContent() { Image( colorFilter = ColorFilter.tint(GlanceTheme.colors.secondary), // ... ) }
لتخصيص المظهر، يمكنك ضبط colors
إلى GlanceTheme
. توفِّر ميزة "نظرة سريعة"
مكتبة إمكانية التشغيل التفاعلي androidx.glance:glance-material
مع Material 2
وandroidx.glance:glance-material3
لـ "دعم ألوان المادة 3".
على سبيل المثال، يمكنك تقديم ألوان المواد الحالية في تطبيقك إلى واجهة برمجة التطبيقات
ColorProviders
لإنشاء ألوان في ميزة "نظرة سريعة"، كما هو موضّح في المقتطف التالي:
// Remember, use the Glance imports // import androidx.glance.material3.ColorProviders // Example Imports from your own app // import com.example.myapp.ui.theme.DarkColors // import com.example.myapp.ui.theme.LightColors object MyAppWidgetGlanceColorScheme { val colors = ColorProviders( light = LightColors, dark = DarkColors ) }
أدخل الألوان من المخطط إلى GlanceTheme
الذي يلتف على جميع العناصر
المكونة، كما هو موضح في المثال التالي:
override suspend fun provideGlance(context: Context, id: GlanceId) { // ... provideContent { GlanceTheme(colors = MyAppWidgetGlanceColorScheme.colors) { MyContent() } } } @Composable private fun MyContent() { Image( colorFilter = ColorFilter.tint(GlanceTheme.colors.secondary), // ... ) }
إذا كنت تفضّل استخدام ألوان ديناميكية من الخلفية عندما تكون متاحة، واستخدام
نظام ألوان تطبيقك بخلاف ذلك، يمكنك تمرير نظام ألوان تطبيقك بشكل مشروط
في GlanceTheme
. يظهر ذلك في المقتطف التالي:
override suspend fun provideGlance(context: Context, id: GlanceId) { provideContent { GlanceTheme( if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S) GlanceTheme.colors else MyAppWidgetGlanceColorScheme.colors ) { MyContent() } } } @Composable private fun MyContent() { // ... Image( colorFilter = ColorFilter.tint(GlanceTheme.colors.secondary), // ... ) }
إضافة أشكال
لتوفير أشكال أو ظلال خاصة لأداة تطبيقك، استخدم واجهة برمجة تطبيقات Android Drawables.
على سبيل المثال، يعرض المقتطف التالي كيفية إنشاء شكل قابل للرسم (شكل):
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="16dp"/>
<stroke android:color="@color/outline_color" android:width="1dp"/>
</shape>
قدِّمه إلى العنصر المستهدف القابل للإنشاء:
GlanceModifier.background( imageProvider = ImageProvider(R.drawable.button_outline) )