Text și tipografie în dezvoltarea mobilă: ce este, ce instrumente și cum funcționează

Text în aplicațiile mobile: NSAttributedString pe iOS

NSAttributedString este clasa fundamentală iOS pentru lucrul cu text formatat. Permite aplicarea de atribute la caractere sau intervale individuale: font prin UIFont, culoare prin UIColor, spațiere între caractere prin kern și spațiere între linii prin NSMutableParagraphStyle. În aplicațiile mobile, NSAttributedString este utilizat peste tot — de la UILabel până la UITextView complex cu suport de editare.

UIFont și configurarea fontului

UIFont este clasa principală pentru lucrul cu fonturile pe iOS. Suportă fonturi de sistem, fonturi personalizate și Dynamic Type. UIFont(name:size:) încarcă un font după nume, UIFont.systemFont(ofSize:weight:) încarcă fontul de sistem. UIFontDescriptor permite modificarea unui font existent: schimbarea dimensiunii, greutății sau adăugarea unei matrice de transformare. Pentru fonturile personalizate, fișierul .ttf se adaugă la proiect și se înregistrează în Info.plist sub cheia Fonts provided by application.

let attributes: [NSAttributedString.Key: Any] = [
    .font: UIFont(name: "HelveticaNeue-Bold", size: 18) as Any,
    .foregroundColor: UIColor.darkGray as Any,
    .kern: 1.5 as Any
]
let attributedString = NSAttributedString(
    string: "Форматированный текст",
    attributes: attributes
)
label.attributedText = attributedString

NSMutableParagraphStyle și formatarea paragrafelor

NSMutableParagraphStyle este o versiune mutabilă a ParagraphStyle pentru configurarea afișării paragrafelor. Controlează alinierea (alignment), spațierea între linii (lineSpacing), indentările (headIndent, tailIndent) și modul de tăiere (lineBreakMode). ParagraphStyle este esențial pentru lizibilitatea textelor lungi pe dispozitivele mobile: un lineSpacing adecvat previne fuzionarea liniilor, iar lineBreakMode previnde tăierea cuvintelor. Setarea paragraphSpacing definește spațiul dintre paragrafe.

Text în aplicațiile mobile: SpannableString pe Android

SpannableString este instrumentul principal pentru formatarea textului pe Android. Funcționează printr-un mecanism de obiecte Span, fiecare responsabil pentru un aspect: StyleSpan pentru bold sau italic, ForegroundColorSpan pentru culoare, URLSpan pentru linkuri, UnderlineSpan pentru subliniere. SpannableStringBuilder este echivalentul NSMutableAttributedString, permițând construirea textului din mai multe fragmente. Înțelegerea SpannableString este esențială pentru crearea de interfețe flexibile cu text formatat în aplicațiile mobile.

Typeface și fonturi personalizate pe Android

Typeface este clasa pentru lucrul cu fonturile pe Android. Suportă fonturile de sistem Roboto și Noto, precum și fonturile personalizate. Typeface.createFromResource() încarcă un font din res/font/, Typeface.createFromAsset() din folderul assets. Android 8.0+ suportă familii de fonturi în XML, combinând mai multe fișiere de font într-o singură resursă. Un font personalizat pentru text în aplicațiile mobile pe Android se setează prin atributul android:fontFamily sau programatic cu setTypeface().

TextMeasurer și măsurarea textului

TextMeasurer (API 29+) este un instrument modern pentru măsurarea textului fără legare la o View. Calculează lățimea, înălțimea și pozițiile caracterelor înainte de randare. Pe API-uri vechi, Paint.measureText() este utilizat pentru text pe o singură linie sau StaticLayout pentru text pe mai multe linii. TextMeasurer este deosebit de util în View-uri personalizate unde textul este desenat prin Canvas.drawText(). Măsurarea corectă previnde tăierea caracterelor în interfață.

val spannable = SpannableString("Жирный текст с цветом")
spannable.setSpan(
    StyleSpan(Typeface.BOLD),
    0, 6,
    Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
)
spannable.setSpan(
    ForegroundColorSpan(Color.RED),
    14, 19,
    Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
)
textView.text = spannable

Tipografie în dezvoltarea mobilă: chernala, ligaturile și tracking

Tipografia în aplicațiile mobile este o configurare cuprinzătoare a fonturilor, spațierii între caractere și între linii. Tipografia adecvată în dezvoltarea mobilă afectează direct lizibilitatea textului și percepția vizuală a interfeței. Să examinăm parametrii cheie disponibili pe ambele platforme.

Chernala și Tracking

Chernala este ajustarea spațiului între perechi specifice de caractere (AV, To, Wa). Tracking este spațierea uniformă între caractere pentru întregul text sau o parte a acestuia. Pe iOS, chernala se setează prin NSKernAttributeName, pe Android — prin proprietatea letterSpacing a TextView. Valorile negative apropie caracterele, valorile pozitive le depărtează. Tipografia în dezvoltarea mobilă necesită o reglare atentă a acestor parametri: pentru titlurile mari, spațierea între caractere este de obicei mărită, pentru textul de corp rămâne standard.

Ligaturi

Ligaturile sunt glifuri speciale care înlocuiesc combinații de două sau mai multe caractere: fi, fl, ffi. Pe iOS, ligaturile sunt controlate prin NSLigatureAttributeName: 0 — dezactivate, 1 — standard, 2 — toate disponibile. Pe Android, ligaturile sunt controlate la nivel de font prin caracteristici OpenType. Activarea ligaturilor îmbunătățește aspectul textului, în special în fonturile cu serife. Tipografia în dezvoltarea mobilă utilizează ligaturile în principal pentru titluri și logo-uri.

Fonturi personalizate în aplicațiile mobile: încărcare și configurare

Fonturile personalizate sunt unul dintre principalele instrumente pentru crearea unui stil vizual unic pentru o aplicație. Ele ajută la evidențierea mărcii și la îmbunătățirea experienței utilizatorului. În aplicațiile mobile, fonturile personalizate sunt utilizate pentru titluri, logo-uri, elemente de accent și identitate corporativă.

Fonturi variabile

Fonturile variabile sunt o tehnologie modernă de fonturi unde un singur fișier conține mai multe stiluri: de la subțire la extra-îngroșat, de la îngust la larg. Aceasta reduce dimensiunea aplicației înlocuind mai multe fișiere de font cu unul singur. Pe iOS, fonturile variabile sunt suportate prin UIFont cu parametrul weight. Pe Android — prin Typeface.Builder specificând axele de variabilitate wght, wdth, slnt. Utilizarea fonturilor variabile simplifică tipografia în aplicațiile mobile: dezvoltatorul nu trebuie să încarce fișiere separate pentru fiecare stil.

let customFont = UIFont(name: "CustomFont-Regular", size: 16)
let scaledFont = UIFontMetrics.default
    .scaledFont(for: customFont)
label.font = scaledFont
label.adjustsFontForContentSizeCategory(true)

NSTextAttachment și ImageSpan

NSTextAttachment pe iOS permite încorporarea UIImage în interiorul NSAttributedString — imaginea se aliniază la linia de bază și se deplasează împreună cu textul. Pe Android, echivalentul este ImageSpan în interiorul SpannableString. Ambele abordări sunt utile pentru chat cu emoji, fluxuri de știri cu pictograme și formulare cu casete de selectare personalizate. Este important să scalați corect imaginea pentru a se potrivi cu înălțimea fontului, astfel încât textul și graficele să arate armonios.

Efecte de text, aliniere și elipsă

Pe lângă formatarea de bază, textul în aplicațiile mobile suportă efecte vizuale suplimentare: umbre, contur, tăiere și subliniere. Aceste instrumente extind posibilitățile tipografiei, dar necesită o aplicare atentă pentru a menține lizibilitatea.

Umbra și conturul textului

Umbra textului pe iOS se setează prin NSShadow cu offset, blurRadius și color. Conturul — prin NSStrokeWidthAttributeName: valorile negative creează umplere cu contur, valorile pozitive creează doar conturul. Tăierea — NSUnderlineStyle (.single, .thick, .double). Pe Android, umbra TextView se configurează prin android:shadowRadius, android:shadowDx, android:shadowDy. SpannableString suportă StrikethroughSpan și UnderlineSpan. Conturul textului pe Android este implementat prin OutlineSpan sau un font personalizat.

Elipsa și Marquee

Elipsa este trunchierea textului cu puncte de suspensie când containerul se revarsă. Pe iOS, se configurează prin lineBreakMode .byTruncatingTail și numberOfLines. Pe Android — prin android:ellipsize="end" și android:maxLines. Marquee este o animație cu text derulant disponibilă pe Android prin android:ellipsize="marquee". Pe iOS, nu există un echivalent integrat — se utilizează biblioteca MarqueeLabel. Elipsa este obligatorie pentru toate textele pe o singură linie în aplicațiile mobile pentru a evita tăierea conținutului.

Dynamic Type pe iOS

Dynamic Type este un sistem de text adaptiv pe iOS care ajustează dimensiunea fontului în funcție de setările de Accesibilitate ale utilizatorului. Utilizați UIFontMetrics pentru a scala fonturile personalizate. Dynamic Type este obligatoriu pentru aplicațiile conforme cu accesibilitatea. Pe Android, echivalentul este unitățile sp și scaledPixels, care se scalează în funcție de setările de dimensiune a textului ale sistemului.