Κείμενο και Τυπογραφία στην Ανάπτυξη Κινητών: Τι Είναι, Ποια Εργαλεία και Πώς Λειτουργεί

Κείμενο σε Εφαρμογές Κινητών: NSAttributedString στο iOS

NSAttributedString είναι η θεμελιώδης κλάση iOS για εργασία με μορφοποιημένο κείμενο. Επιτρέπει την εφαρμογή χαρακτηριστικών σε μεμονωμένους χαρακτήρες ή περιοχές: γραμματοσειρά μέσω UIFont, χρώμα μέσω UIColor, απόσταση χαρακτήρων μέσω kern και διάστιχο μέσω NSMutableParagraphStyle. Σε εφαρμογές κινητών, το NSAttributedString χρησιμοποιείται παντού — από UILabel έως σύνθετα UITextView με υποστήριξη επεξεργασίας.

UIFont και Διαμόρφωση Γραμματοσειράς

UIFont είναι η κύρια κλάση για εργασία με γραμματοσειρές στο iOS. Υποστηρίζει γραμματοσειρές συστήματος, προσαρμοσμένες γραμματοσειρές και Dynamic Type. Το UIFont(name:size:) φορτώνει μια γραμματοσειρά με το όνομα, το UIFont.systemFont(ofSize:weight:) φορτώνει τη γραμματοσειρά συστήματος. Το UIFontDescriptor επιτρέπει την τροποποίηση μιας υπάρχουσας γραμματοσειράς: αλλαγή μεγέθους, βάρους ή προσθήκη πίνακα μετασχηματισμού. Για προσαρμοσμένες γραμματοσειρές, το αρχείο .ttf προστίθεται στο έργο και καταχωρείται στο Info.plist υπό το κλειδί 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 και Μορφοποίηση Παραγράφων

NSMutableParagraphStyle είναι μια μεταβλητή έκδοση του ParagraphStyle για τη διαμόρφωση της εμφάνισης παραγράφων. Ελέγχει τη στοίχιση (alignment), το διάστιχο (lineSpacing), τις εσοχές (headIndent, tailIndent) και τη λειτουργία αποκοπής (lineBreakMode). Το ParagraphStyle είναι κρίσιμο για την αναγνωσιμότητα μεγάλων κειμένων σε κινητές συσκευές: το σωστό lineSpacing αποτρέπει τη συγχώνευση γραμμών και το lineBreakMode αποτρέπει την αποκοπή λέξεων. Η ρύθμιση paragraphSpacing καθορίζει το διάστημα μεταξύ παραγράφων.

Κείμενο σε Εφαρμογές Κινητών: SpannableString στο Android

SpannableString είναι το κύριο εργαλείο για μορφοποίηση κειμένου στο Android. Λειτουργεί μέσω ενός μηχανισμού αντικειμένων Span, καθένα υπεύθυνο για μία πτυχή: StyleSpan για έντονη ή πλάγια γραφή, ForegroundColorSpan για χρώμα, URLSpan για συνδέσμους, UnderlineSpan για υπογράμμιση. Το SpannableStringBuilder είναι το αντίστοιχο του NSMutableAttributedString, επιτρέποντας την κατασκευή κειμένου από πολλαπλά τμήματα. Η κατανόηση του SpannableString είναι απαραίτητη για τη δημιουργία ευέλικτων διεπαφών με μορφοποιημένο κείμενο σε εφαρμογές κινητών.

Typeface και Προσαρμοσμένες Γραμματοσειρές στο Android

Typeface είναι η κλάση για εργασία με γραμματοσειρές στο Android. Υποστηρίζει γραμματοσειρές συστήματος Roboto και Noto, καθώς και προσαρμοσμένες γραμματοσειρές. Το Typeface.createFromResource() φορτώνει μια γραμματοσειρά από το res/font/, το Typeface.createFromAsset() από το φάκελο assets. Το Android 8.0+ υποστηρίζει οικογένειες γραμματοσειρών σε XML, συνδυάζοντας πολλαπλά αρχεία γραμματοσειράς σε έναν πόρο. Μια προσαρμοσμένη γραμματοσειρά για κείμενο σε εφαρμογές κινητών στο Android ορίζεται μέσω του χαρακτηριστικού android:fontFamily ή προγραμματιστικά με setTypeface().

TextMeasurer και Μέτρηση Κειμένου

TextMeasurer (API 29+) είναι ένα σύγχρονο εργαλείο για τη μέτρηση κειμένου χωρίς σύνδεση με ένα View. Υπολογίζει το πλάτος, το ύψος και τις θέσεις χαρακτήρων πριν από την απόδοση. Σε παλαιότερα API, χρησιμοποιείται Paint.measureText() για μονόγραμμο κείμενο ή StaticLayout για πολύγραμμο κείμενο. Το TextMeasurer είναι ιδιαίτερα χρήσιμο σε προσαρμοσμένα Views όπου το κείμενο σχεδιάζεται μέσω Canvas.drawText(). Η σωστή μέτρηση αποτρέπει την αποκοπή χαρακτήρων στη διεπαφή.

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

Τυπογραφία στην Ανάπτυξη Κινητών: Κέρνινγκ, Σύνδεσμοι και Tracking

Τυπογραφία σε εφαρμογές κινητών είναι μια ολοκληρωμένη διαμόρφωση γραμματοσειρών, απόστασης χαρακτήρων και διαστήματος γραμμών. Η σωστή τυπογραφία στην ανάπτυξη κινητών επηρεάζει άμεσα την αναγνωσιμότητα του κειμένου και την οπτική αντίληψη της διεπαφής. Ας δούμε τις βασικές παραμέτρους που είναι διαθέσιμες και στις δύο πλατφόρμες.

Κέρνινγκ και Tracking

Κέρνινγκ είναι η ρύθμιση του χώρου μεταξύ συγκεκριμένων ζευγών χαρακτήρων (AV, To, Wa). Tracking είναι η ομοιόμορφη απόσταση χαρακτήρων για ολόκληρο το κείμενο ή ένα μέρος του. Στο iOS, το κέρνινγκ ορίζεται μέσω NSKernAttributeName, στο Android — μέσω της ιδιότητας letterSpacing του TextView. Οι αρνητικές τιμές φέρνουν τους χαρακτήρες πιο κοντά, οι θετικές τιμές τους απομακρύνουν. Η τυπογραφία στην ανάπτυξη κινητών απαιτεί προσεκτική ρύθμιση αυτών των παραμέτρων: για μεγάλες επικεφαλίδες, η απόσταση χαρακτήρων συνήθως αυξάνεται, για το κύριο κείμενο παραμένει τυπική.

Σύνδεσμοι

Σύνδεσμοι είναι ειδικές γλύφοι που αντικαθιστούν συνδυασμούς δύο ή περισσότερων χαρακτήρων: fi, fl, ffi. Στο iOS, οι σύνδεσμοι ελέγχονται μέσω NSLigatureAttributeName: 0 — απενεργοποιημένοι, 1 — τυπικοί, 2 — όλοι διαθέσιμοι. Στο Android, οι σύνδεσμοι ελέγχονται σε επίπεδο γραμματοσειράς μέσω λειτουργιών OpenType. Η ενεργοποίηση συνδέσμων βελτιώνει την εμφάνιση του κειμένου, ειδικά σε γραμματοσειρές με πατούσες. Η τυπογραφία στην ανάπτυξη κινητών χρησιμοποιεί συνδέσμους κυρίως για επικεφαλίδες και λογότυπα.

Προσαρμοσμένες Γραμματοσειρές σε Εφαρμογές Κινητών: Φόρτωση και Διαμόρφωση

Προσαρμοσμένες γραμματοσειρές είναι ένα από τα κύρια εργαλεία για τη δημιουργία ενός μοναδικού οπτικού στυλ για μια εφαρμογή. Βοηθούν στην ανάδειξη της επωνυμίας και στη βελτίωση της εμπειρίας χρήστη. Σε εφαρμογές κινητών, οι προσαρμοσμένες γραμματοσειρές χρησιμοποιούνται για επικεφαλίδες, λογότυπα, στοιχεία έμφασης και εταιρική ταυτότητα.

Μεταβλητές Γραμματοσειρές

Μεταβλητές Γραμματοσειρές είναι μια σύγχρονη τεχνολογία γραμματοσειρών όπου ένα αρχείο περιέχει πολλαπλά στυλ: από λεπτό έως εξαιρετικά έντονο, από στενό έως φαρδύ. Αυτό μειώνει το μέγεθος της εφαρμογής αντικαθιστώντας πολλά αρχεία γραμματοσειράς με ένα. Στο iOS, οι Μεταβλητές Γραμματοσειρές υποστηρίζονται μέσω UIFont με την παράμετρο weight. Στο Android — μέσω Typeface.Builder με καθορισμό των αξόνων μεταβλητότητας wght, wdth, slnt. Η χρήση Μεταβλητών Γραμματοσειρών απλοποιεί την τυπογραφία σε εφαρμογές κινητών: ο προγραμματιστής δεν χρειάζεται να φορτώνει ξεχωριστά αρχεία για κάθε στυλ.

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

NSTextAttachment και ImageSpan

NSTextAttachment στο iOS επιτρέπει την ενσωμάτωση UIImage μέσα σε NSAttributedString — η εικόνα ευθυγραμμίζεται με τη γραμμή βάσης και μετακινείται μαζί με το κείμενο. Στο Android, το αντίστοιχο είναι ImageSpan μέσα στο SpannableString. Και οι δύο προσεγγίσεις είναι χρήσιμες για συνομιλία με emoji, ροές ειδήσεων με εικονίδια και φόρμες με προσαρμοσμένα πλαίσια ελέγχου. Είναι σημαντικό να κλιμακώνετε σωστά την εικόνα ώστε να ταιριάζει με το ύψος της γραμματοσειράς, έτσι ώστε το κείμενο και τα γραφικά να φαίνονται αρμονικά.

Εφέ Κειμένου, Στοίχιση και Έλλειψη

Εκτός από τη βασική μορφοποίηση, το κείμενο σε εφαρμογές κινητών υποστηρίζει πρόσθετα οπτικά εφέ: σκιές, περιγράμματα, διαγραφή και υπογράμμιση. Αυτά τα εργαλεία επεκτείνουν τις δυνατότητες της τυπογραφίας αλλά απαιτούν προσεκτική εφαρμογή για τη διατήρηση της αναγνωσιμότητας.

Σκιά και Περίγραμμα Κειμένου

Σκιά κειμένου στο iOS ορίζεται μέσω NSShadow με offset, blurRadius και color. Περίγραμμα — μέσω NSStrokeWidthAttributeName: οι αρνητικές τιμές δημιουργούν γέμισμα με περίγραμμα, οι θετικές τιμές δημιουργούν μόνο το περίγραμμα. Διαγραφή — NSUnderlineStyle (.single, .thick, .double). Στο Android, η σκιά TextView διαμορφώνεται μέσω android:shadowRadius, android:shadowDx, android:shadowDy. Το SpannableString υποστηρίζει StrikethroughSpan και UnderlineSpan. Το περίγραμμα κειμένου στο Android υλοποιείται μέσω OutlineSpan ή προσαρμοσμένης γραμματοσειράς.

Έλλειψη και Marquee

Έλλειψη είναι η αποκοπή κειμένου με αποσιωπητικά όταν το δοχείο υπερχειλίζει. Στο iOS, διαμορφώνεται μέσω lineBreakMode .byTruncatingTail και numberOfLines. Στο Android — μέσω android:ellipsize="end" και android:maxLines. Marquee είναι ένα κινούμενο κείμενο που διατίθεται στο Android μέσω android:ellipsize="marquee". Στο iOS, δεν υπάρχει ενσωματωμένο αντίστοιχο — χρησιμοποιείται η βιβλιοθήκη MarqueeLabel. Η έλλειψη είναι υποχρεωτική για όλα τα μονόγραμμα κείμενα σε εφαρμογές κινητών για την αποφυγή αποκοπής περιεχομένου.

Dynamic Type στο iOS

Dynamic Type είναι ένα προσαρμοστικό σύστημα κειμένου στο iOS που ρυθμίζει το μέγεθος γραμματοσειράς βάσει των ρυθμίσεων Προσβασιμότητας του χρήστη. Χρησιμοποιήστε το UIFontMetrics για την κλιμάκωση προσαρμοσμένων γραμματοσειρών. Το Dynamic Type είναι υποχρεωτικό για εφαρμογές συμβατές με Προσβασιμότητα. Στο Android, το αντίστοιχο είναι οι μονάδες sp και scaledPixels, που κλιμακώνονται σύμφωνα με τις ρυθμίσεις μεγέθους κειμένου συστήματος.