نوشتار در Jetpack Compose Glimmer

دستگاه‌های XR قابل‌اعمال
این راهنمایی به شما کمک می‌کند برای این نوع دستگاه‌های واقعیت گسترده تجربه بسازید.
نمایش عینک

در Jetpack Compose Glimmer، عنصر Text به شما امکان می‌دهد ویژگی‌های مختلف نوشتار مثل رنگ، اندازه قلم، سبک قلم، وزن قلم، خانواده قلم، فاصله حروف، و تراز نوشتار را تنظیم کنید.

«نوشتار درخشان Jetpack Compose» منحصربه‌فرد است زیرا به‌طور هوشمندانه رنگ‌ها را مدیریت می‌کند. برای مثال، اگر رنگی برای ملغی کردن مشخص نشده باشد، نوشتار به‌طور پیش‌فرض به رنگ محتوایی که نزدیک‌ترین سطح زیر آن ارائه می‌دهد درمی‌آید.

مثال: ایجاد عنوان نوشتاری در چارگوش

@Composable
fun TextSample() {
    Text(
        text = "Hello Glimmer",
        style = GlimmerTheme.typography.titleLarge
    )
}

نکات کلیدی درباره کد

  • چون رنگی مشخص نشده است، این نوشتار نزدیک‌ترین سطح را برای انتخاب بهترین رنگ خوانا (معمولاً سفید) بررسی می‌کند.

اندازه کردن

مقیاس حروف‌چینی در Jetpack Compose Glimmer به‌طور قابل‌توجهی بزرگ‌تر از «طراحی Material» استاندارد تلفن همراه است. سبک‌هایی مثل TitleLarge و BodyLarge هر دو 30.sp هستند و «عنوان» 18.sp است:

سبک اندازه (sp) وزن ارتفاع خط

titleLarge

30

750

‫36.sp

titleMedium

24

750

‫۲۸.sp

titleSmall

20

750

‫۲۸.sp

bodyLarge

30

۵۲۰

‫36.sp

bodyMedium

24

۵۲۰

‫36.sp

بدنه کوچک

20

۵۲۰

‫۲۸.sp

زیرنویس

18

۶۵۰

‫۲۴.sp

استفاده از Google Sans Flex

Google Sans Flex یک قلم متغیر است که به‌طور خاص برای عینک‌های هوش مصنوعی انتخاب شده است و به‌عنوان بخشی از Jetpack Compose Glimmer ارائه می‌شود. گوشه‌های گرد و محورهای قابل‌تنظیم این قلم امکان اندازه‌گیری نوری ایده‌آل را فراهم می‌کند و تضمین می‌کند که نوشتار در یک نگاه خوانا و قابل‌تشخیص باقی بماند. درصورت امکان، برای بهبود یکپارچگی برای کاربران بین برنامه و سیستم، از Google Sans Flex برای همه نوشتارهای نمایش‌داده‌شده در عینک‌های نمایشگر استفاده کنید.

برای استفاده از Google Sans Flex، کتابخانه glimmer-google-fonts را به وابستگی‌های برنامه‌تان اضافه کنید، سپس قلم را به‌صورت سراسری در GlimmerTheme اعمال کنید:

@Composable
fun GoogleSansFlexTypographySample() {
    val typography = createGoogleSansFlexTypography()
    GlimmerTheme(typography = typography) {
        Text("Hello World", style = GlimmerTheme.typography.titleLarge)
    }
}