Custom Font mobil ishlanmada — bu nima, formatlari va qo'llanilishi

Custom Font nima?

Custom Font (maxsus shrift) — bu operatsion tizimning standart shriftlar to'plamiga kirmaydigan shrift fayli. Dasturchilar bunday shriftlarni brendga mos noyob tipografiya uchun loyihaga qo'shadilar. Maxsus shriftlar pullik tijoriy shriftlar hamda bepul open-source shriftlar (masalan, Inter, Montserrat, Roboto (maxsus versiya)) bo'lishi mumkin.

Maxsus shriftlardan foydalanishning odatiy stsenariylari: brend ilovalarining logotiplari va sarlavhalari, tipografiyaga maxsus talablarga ega o'qish ilovalari, tematik shriftli o'yinlar, tizim shrifti kerakli gliflarni qo'llab-quvvatlamaydigan lotin bo'lmagan tillar uchun ilovalar. Google Fonts ma'lumotlariga ko'ra, top-100 ilovalarning 60% dan ortig'i vizual farqlash uchun shriftlarni moslashtiradi.

Nega maxsus shriftlar kerak

Tizim shriftlari (iOS'da San Francisco, Android'da Roboto) interfeyslar uchun optimallashtirilgan, ammo brend tipografiyasi uchun mos emas. Maxsus shrift brendning taniqliligini kuchaytiradi, maxsus belgilarni (ikonka shriftlari) o'z ichiga olishi mumkin va muayyan auditoriyalar uchun o'qish qulayligini yaxshilaydi. Biroq turli shriftlarning haddan tashqari ko'p ishlatilishi UX'ni yomonlashtiradi — ilova uchun 2-3 oiladan ko'p bo'lmasligi tavsiya etiladi.

Mobil ilovalar uchun shrift formatlari

Mobil platformalar bir nechta shrift formatlarini qo'llab-quvvatlaydi. TrueType (TTF) — iOS va Android'ning barcha versiyalari bilan mos keladigan eng keng tarqalgan format. OpenType (OTF) — ligaturalar, muqobil gliflar va OpenType xususiyatlarini qo'llab-quvvatlovchi TTF kengaytmasi. Ikkala format .ttf va .otf kengaytmalariga ega va mobil platformalarda bir xil ishlaydi.

WOFF2 (Web Open Font Format 2) — 10-versiyadan boshlab Android'da qo'llab-quvvatlanadigan veb uchun siqilgan format. WOFF2 TTF'ga nisbatan 30-50% siqishni ta'minlaydi. iOS uchun WOFF2 Safari orqali qo'llab-quvvatlanadi, ammo mahalliy ilovalarda TTF/OTF'ga konvertatsiya talab qilinadi. Variable Fonts (variativ shriftlar) — barcha uslublarni bitta faylda saqlaydigan zamonaviy format.

Mobil ishlanma uchun asosiy format sifatida OTF dan foydalanish tavsiya etiladi — TTF bilan bir xil o'lchamda OpenType xususiyatlarini qo'llab-quvvatlaydi. APK'da joyni tejash uchun woff2 siqish yoki talab bo'yicha shrift yuklashdan foydalaning.

iOS'da maxsus shriftlarni ulash

iOS'da maxsus shriftni ulash jarayoni ikki bosqichdan iborat: faylni loyiha bundle'iga qo'shish va Info.plist'da ro'yxatdan o'tkazish. Shrift fayli loyiha katalogiga (odatda Resources/Fonts) joylashtiriladi va target'ga kiritiladi. Info.plist'ga kengaytma bilan birga shrift fayllari nomlari bilan UIAppFonts (Fonts provided by application) massivi qo'shiladi.

Ro'yxatdan o'tkazilgandan so'ng, shrift UIFont(name:size:) orqali PostScript nomi bilan mavjud bo'ladi. PostScript nomini UIFont.familyNames va UIFont.fontNames(forFamilyName:) orqali bilish mumkin. Agar nom noto'g'ri ko'rsatilgan bo'lsa, UIFont(name:size:) nil qaytaradi. Disk raskadrovka uchun birinchi ishga tushirishda barcha ro'yxatdan o'tgan shriftlarni ekranda ko'rsatish tavsiya etiladi.

Ulanish namunasi

Swift'da iOS loyihasida Montserrat shriftini ulashning to'liq siklini ko'rib chiqamiz. Montserrat-Regular.ttf fayli loyihaga qo'shiladi, Info.plist'da ko'rsatiladi, so'ngra UIFont orqali yuklanadi va UILabel'ga qo'llaniladi. Har bir uslub (regular, bold, italic) uchun alohida fayl va Info.plist'da alohida yozuv qo'shiladi.

// 1. Info.plist'da: UIAppFonts → "Montserrat-Regular.ttf"
// 2. Shriftni kodda yukla
guard let customFont = UIFont(name: "Montserrat-Regular", size: 16) else {
    // tizim shriftiga fallback
    label.font = UIFont.systemFont(ofSize: 16)
    return
}
label.font = customFont
// 3. NSAttributedString'da foydalanish
let attributes = [NSAttributedString.Key.font: customFont]
let attributed = NSAttributedString(string: "Text", attributes: attributes)

Shrift yuklanmagan holatni (UIFont nil qaytaradi) boshqarish majburiydir. Ilova ishdan chiqishi o'rniga tizim shriftidan fallback sifatida foydalaning. Bu, ayniqsa, tarmoqdan yuklanadigan yoki ixtiyoriy modullarga qo'shiladigan shriftlar uchun muhimdir.

CTFontManager orqali dinamik yuklash

Talab bo'yicha yuklab olinadigan shriftlar uchun CTFontManagerRegisterGraphicsFont ishlatiladi. Bu usul xotiradagi ma'lumotlardan (Data) shriftni ro'yxatdan o'tkazadi va uni UIFont uchun mavjud qiladi. Foydalanishdan so'ng shrift CTFontManagerUnregisterGraphicsFont orqali ro'yxatdan chiqarilishi mumkin. Dinamik yuklash katta shriftlar to'plamiga ega, hammasi bir vaqtda kerak bo'lmagan ilovalar uchun foydalidir.

Android'da maxsus shriftlarni ulash

Android'da maxsus shriftlar res/font resurs tizimi orqali qo'shiladi. TTF yoki OTF fayllari res/font/ papkasiga joylashtiriladi, so'ngra uslublarni guruhlash uchun XML Font Family resurslari yaratiladi. Android 8.0 (API 26) dan boshlab bu yagona tavsiya etilgan usuldir. Eski versiyalar uchun assets va Typeface.createFromAsset ishlatiladi.

XML Font Family uslub (regular, bold, italic) va shrift fayli o'rtasidagi moslikni tavsiflaydi. XML belgilashda android:fontFamily="@font/my_font" atributi setTypeface chaqiruvida tegishli uslub bilan avtomatik ravishda kerakli faylni tanlaydi. Bu tipografiyani soddalashtiradi — temada oilani ko'rsatish kifoya va Android setTypeface(textView, Typeface.BOLD) chaqiruvida bold'ni o'zi tanlaydi.

Font Family yaratish

Turli uslublar uchun barcha shrift fayllari sanab o'tilgan res/font/my_font.xml XML faylini yarating. Har bir element fontStyle (normal/italic) va fontWeight (100-900) atributlariga ega. Shundan so'ng belgilashda android:fontFamily="@font/my_font" ni ko'rsating. textStyle="bold" dan foydalanganda Android avtomatik ravishda fontWeight 700 bo'lgan faylni tanlaydi.

<!-- res/font/my_font.xml -->
<?xml version="1.0" encoding="utf-8"?>
<font-family xmlns:app="http://schemas.android.com/apk/res-auto">
    <font
        android:fontStyle="normal"
        android:fontWeight="400"
        app:font="@font/my_font_regular" />
    <font
        android:fontStyle="normal"
        android:fontWeight="700"
        app:font="@font/my_font_bold" />
</font-family>

Font Family dan foydalanganda resurs usuli avtomatik ravishda shriftlarni keshga oladi va to'g'ri uslubni tanlaydi. Agar kerakli og'irlik oilada bo'lmasa, Android uni eng yaqin mavjudidan sintez qiladi. Shrift ustida aniq nazorat qilish uchun faylni to'g'ridan-to'g'ri ko'rsatish bilan Typeface.create() dan foydalaning.

Flutter va React Native'da ulash

Platformalararo freymvorklarda shriftlarni ulash birlashtirilgan. Flutter shriftlarni ko'rsatish uchun pubspec.yaml dan foydalanadi: fayllar loyihaning fonts/ papkasiga joylashtiriladi, so'ngra oila va uslublar ko'rsatilgan holda fonts bo'limida e'lon qilinadi. Keyin shrift TextStyle(fontFamily: 'Montserrat') orqali yoki ilova temasida qo'llaniladi. Flutter TTF va OTF ni qo'llab-quvvatlaydi.

React Native ikki yondashuvdan foydalanadi: mahalliy (Info.plist va res/font orqali) yoki react-native-vector-icons va @expo-google-fonts kutubxonalari orqali. Expo jarayonni soddalashtiradi — shriftlar expo-font orqali yuklanadi: Font.loadAsync({ 'Montserrat': require('./assets/fonts/Montserrat.ttf') }). React Navigation va temalar shriftni global o'rnatishga imkon beradi.

Flutter'da namuna

pubspec.yaml'da shriftlarni e'lon qilish va MaterialApp temasida qo'llash. Montserrat-Regular.ttf va Montserrat-Bold.ttf fayllari fonts/ papkasiga joylashtiriladi. E'lon qilinganidan so'ng shrift butun ilovada TextStyle orqali mavjud bo'ladi. Flutter fontWeight: FontWeight.bold bo'lganda avtomatik ravishda bold faylidan foydalanadi.

// pubspec.yaml
flutter:
  fonts:
    - family: Montserrat
      fonts:
        - asset: fonts/Montserrat-Regular.ttf
        - asset: fonts/Montserrat-Bold.ttf
          weight: 700
// Temada foydalanish
MaterialApp(
  theme: ThemeData(
    textTheme: TextTheme(
      headlineLarge: TextStyle(
        fontFamily: 'Montserrat',
        fontWeight: FontWeight.bold,
        fontSize: 28
      )
    )
  )
)

Agar Flutter ko'rsatilgan yo'lda shriftni topmasa, ilova xatosiz tizim fallback shriftidan foydalanadi. Disk raskadrovka uchun MaterialApp'da checkConsistency ni yoqish kerak — u shriftlarning mavjudligini tekshiradi va yo'q bo'lganda konsolda ogohlantirishlarni ko'rsatadi.

Shrift hajmini optimallashtirish

APK va IPA hajmi to'g'ridan-to'g'ri kiritilgan shriftlar soniga bog'liq. Bitta TTF fayli lotin belgilar to'plami uchun 50-500 KB, kirill, xitoy iyerogliflari yoki boshqa kengaytirilgan to'plamlarni qo'llab-quvvatlovchi shriftlar uchun 2-5 MB gacha og'irlik qiladi. O'nta shrift ilova hajmiga 10-20 MB qo'shishi mumkin, bu mobil yuklab olish uchun muhimdir.

Optimallashtirish uchun subsetting — shrift faylidan foydalanilmaydigan belgilarni olib tashlashdan foydalaning. glyphhanger, fonttools (pyftsubset) va Google Webfont Optimizer kabi vositalar faqat kerakli gliflar (lotin + kirill + raqamlar + tinish belgilari) bilan shrift versiyasini yaratadi. Bu hajmni 50-80% ga kamaytiradi. iOS'da birinchi ishga tushirishda kerak bo'lmagan shriftlar uchun on-demand resurslaridan foydalanish mumkin.

Variativ shriftlar

Variable Font (variativ shrift) — bu Thin'dan Black'gacha va Condensed'dan Expanded'gacha barcha uslublarni o'z ichiga olgan bitta fayl. Bitta variativ shrift turli og'irlikdagi 10-20 alohida faylni almashtirishi mumkin. Bunday faylning hajmi taxminan 1-2 statik faylga teng. Qo'llab-quvvatlash: iOS 11+, Android 10+, Flutter (FontVariation orqali), React Native (maxsus kutubxonalar orqali).

Siqish va talab bo'yicha yuklash

Shrift hajmini 30-50% ga kamaytirish uchun WOFF2 dan foydalaning. API 29 bo'lgan Android'da WOFF2 dan to'g'ridan-to'g'ri foydalanish mumkin. iOS uchun ro'yxatdan o'tkazishdan oldin WOFF2 ni TTF ga konvertatsiya qilish kerak. Faqat onbordingda yoki ma'lum ekranlarda ishlatiladigan shriftlarni on-demand resurslari (iOS) yoki Dynamic Feature (Android) orqali yuklang — ular bazaviy APK tarkibiga kirmaydi.

Ishlash va best practices

Maxsus shriftlar ishlashga ikki yo'l bilan ta'sir qiladi: yuklash vaqti va xotira. Shriftga birinchi murojaat qilinganda tizim faylni diskdan o'qiydi, shrift jadvallarini tahlil qiladi va ko'rsatish uchun ichki tuzilmalarni yaratadi. 1 MB hajmdagi shrift uchun bu 20-50 ms davom etadi. Birinchi yuklashdan keyin keshga olish takroriy murojaatlardagi kechikishni bartaraf qiladi.

Xotira: har bir yuklangan shrift jarayon keshi saqlanadi. Tizim shriftlari oldindan yuklangan, maxsus shriftlar birinchi foydalanishda yuklanadi. Xotirada shrift diskdagiga nisbatan taxminan 2-3 barobar ko'p joy egallaydi, chunki tahlil qilingan tuzilmalar: cmap, glyf, head, hmtx jadvallari. O'rtacha hajmdagi 5 ta maxsus shrift (umumiy hajm 3 MB) uchun taxminan 6-9 MB RAM talab qilinadi.

Tavsiyalar

Maxsus shriftlar sonini ilova uchun 2-3 oila bilan cheklang. Bir nechta uslubni almashtirish uchun variativ shriftlardan foydalaning. UI elementlari (tugmalar, yorliqlar, ro'yxatlar) uchun tizim shriftlarini, urg'u tipografiyasi (sarlavhalar, bannerlar) uchun esa faqat maxsus shriftlarni qo'llang. Android'da Typeface ni Map orqali, iOS'da UIFont ni statik o'zgaruvchilar orqali keshga oling.

object FontCache {
    private val cache = mutableMapOf<String, Typeface>()
    fun get(context: Context, fontId: Int): Typeface {
        return cache.getOrPut(fontId.toString()) {
            ResourcesCompat.getFont(context, fontId)
        }
    }
}
// RecyclerView'da foydalanish
override fun onBindViewHolder(holder: ViewHolder, position: Int) {
    holder.textView.typeface = FontCache.get(context, R.font.montserrat_regular)
}

onBindViewHolder'da Typeface yuklash faqat kesh mavjud bo'lganda joizdir. Keshsiz har bir createFromAsset chaqiruvi yangi ob'ekt yaratadi va faylni diskdan o'qiydi. RecyclerView aylantirilganda bu sezilarli kechikishlarga olib keladi. Kesh muammoni hal qiladi, chunki shrift bir marta yuklanadi va qayta ishlatiladi.