Travailler avec le texte est une tâche clé lors de la création d'interfaces d'applications mobiles modernes. Du choix de la police à l'ajustement de l'espacement entre les caractères — chaque aspect affecte la perception du produit. Selon la Documentation Apple NSAttributedString, un formatage correct du texte est directement lié à la lisibilité et à l'accessibilité de l'interface.
Points essentiels
NSAttributedString est la classe fondamentale d'iOS pour travailler avec du texte formaté. Elle permet d'appliquer des attributs à des caractères ou plages individuels : police via UIFont, couleur via UIColor, espacement entre les caractères via kern et espacement des lignes via NSMutableParagraphStyle. Dans les applications mobiles, NSAttributedString est utilisé partout — de UILabel aux UITextView complexes avec prise en charge de l'édition.
UIFont est la classe principale pour travailler avec les polices sur iOS. Elle prend en charge les polices système, les polices personnalisées et Dynamic Type. UIFont(name:size:) charge une police par son nom, UIFont.systemFont(ofSize:weight:) charge la police système. UIFontDescriptor permet de modifier une police existante : changer la taille, le poids ou ajouter une matrice de transformation. Pour les polices personnalisées, le fichier .ttf est ajouté au projet et enregistré dans Info.plist sous la clé 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 est une version modifiable de ParagraphStyle pour configurer l'affichage des paragraphes. Il contrôle l'alignement (alignment), l'espacement des lignes (lineSpacing), les retraits (headIndent, tailIndent) et le mode de coupure (lineBreakMode). ParagraphStyle est essentiel pour la lisibilité des textes longs sur les appareils mobiles : un lineSpacing approprié empêche la fusion des lignes, et lineBreakMode empêche le rognage des mots. Le paramètre paragraphSpacing définit l'espace entre les paragraphes.
SpannableString est l'outil principal pour le formatage du texte sur Android. Il fonctionne via un mécanisme d'objets Span, chacun responsable d'un aspect : StyleSpan pour le gras ou l'italique, ForegroundColorSpan pour la couleur, URLSpan pour les liens, UnderlineSpan pour le soulignement. SpannableStringBuilder est l'équivalent de NSMutableAttributedString, permettant de construire du texte à partir de plusieurs fragments. Comprendre SpannableString est essentiel pour créer des interfaces flexibles avec du texte formaté dans les applications mobiles.
Typeface est la classe pour travailler avec les polices sur Android. Elle prend en charge les polices système Roboto et Noto, ainsi que les polices personnalisées. Typeface.createFromResource() charge une police depuis res/font/, Typeface.createFromAsset() depuis le dossier assets. Android 8.0+ prend en charge les familles de polices en XML, combinant plusieurs fichiers de police en une seule ressource. Une police personnalisée pour le texte dans les applications mobiles sur Android est définie via l'attribut android:fontFamily ou programmatiquement avec setTypeface().
TextMeasurer (API 29+) est un outil moderne pour mesurer le texte sans liaison à une View. Il calcule la largeur, la hauteur et les positions des caractères avant le rendu. Sur les anciennes API, Paint.measureText() est utilisé pour le texte sur une seule ligne ou StaticLayout pour le texte multiligne. TextMeasurer est particulièrement utile dans les Views personnalisées où le texte est dessiné via Canvas.drawText(). Une mesure correcte empêche le rognage des caractères dans l'interface.
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
La typographie dans les applications mobiles est une configuration complète des polices, de l'espacement des caractères et des lignes. Une typographie appropriée dans le développement mobile affecte directement la lisibilité du texte et la perception visuelle de l'interface. Examinons les paramètres clés disponibles sur les deux plateformes.
Le crénage est l'ajustement de l'espace entre des paires de caractères spécifiques (AV, To, Wa). Le tracking est l'espacement uniforme entre les caractères pour l'ensemble du texte ou une partie de celui-ci. Sur iOS, le crénage est défini via NSKernAttributeName, sur Android — via la propriété letterSpacing de TextView. Les valeurs négatives rapprochent les caractères, les valeurs positives les éloignent. La typographie dans le développement mobile nécessite un réglage minutieux de ces paramètres : pour les grands titres, l'espacement entre les caractères est généralement augmenté, pour le corps du texte il reste standard.
| Paramètre | iOS | Android |
|---|---|---|
| Chaîne stylisée | NSAttributedString | SpannableString |
| Police | UIFont / CTFont | Typeface |
| Espacement des caractères | NSKernAttributeName | letterSpacing |
| Espacement des lignes | lineSpacing | lineSpacingExtra |
| Ligatures | NSLigatureAttributeName | Fonctionnalités OpenType |
| Ellipse | lineBreakMode .byTruncatingTail | android:ellipsize |
Les ligatures sont des glyphes spéciaux qui remplacent des combinaisons de deux caractères ou plus : fi, fl, ffi. Sur iOS, les ligatures sont contrôlées via NSLigatureAttributeName : 0 — désactivées, 1 — standard, 2 — toutes disponibles. Sur Android, les ligatures sont contrôlées au niveau de la police via les fonctionnalités OpenType. Activer les ligatures améliore l'apparence du texte, en particulier dans les polices avec empattements. La typographie dans le développement mobile utilise les ligatures principalement pour les titres et les logos.
Les polices personnalisées sont l'un des principaux outils pour créer un style visuel unique pour une application. Elles aident à mettre en valeur la marque et à améliorer l'expérience utilisateur. Dans les applications mobiles, les polices personnalisées sont utilisées pour les titres, les logos, les éléments d'accentuation et l'identité d'entreprise.
Les polices variables sont une technologie de police moderne où un seul fichier contient plusieurs styles : du fin à l'extra-gras, de l'étroit au large. Cela réduit la taille de l'application en remplaçant plusieurs fichiers de police par un seul. Sur iOS, les polices variables sont prises en charge via UIFont avec le paramètre weight. Sur Android — via Typeface.Builder en spécifiant les axes de variabilité wght, wdth, slnt. L'utilisation de polices variables simplifie la typographie dans les applications mobiles : le développeur n'a pas besoin de charger des fichiers séparés pour chaque style.
let customFont = UIFont(name: "CustomFont-Regular", size: 16)
let scaledFont = UIFontMetrics.default
.scaledFont(for: customFont)
label.font = scaledFont
label.adjustsFontForContentSizeCategory(true)
NSTextAttachment sur iOS permet d'intégrer UIImage dans NSAttributedString — l'image s'aligne sur la ligne de base et se déplace avec le texte. Sur Android, l'équivalent est ImageSpan dans SpannableString. Les deux approches sont utiles pour les chats avec des émojis, les fils d'actualité avec des icônes et les formulaires avec des cases à cocher personnalisées. Il est important de redimensionner correctement l'image pour correspondre à la hauteur de la police afin que le texte et les graphiques semblent harmonieux.
En plus du formatage de base, le texte dans les applications mobiles prend en charge des effets visuels supplémentaires : ombres, contours, barré et soulignement. Ces outils élargissent les possibilités de la typographie mais nécessitent une application minutieuse pour maintenir la lisibilité.
L'ombre du texte sur iOS est définie via NSShadow avec offset, blurRadius et color. Le contour — via NSStrokeWidthAttributeName : les valeurs négatives créent un remplissage avec contour, les valeurs positives créent uniquement le contour. Le barré — NSUnderlineStyle (.single, .thick, .double). Sur Android, l'ombre de TextView est configurée via android:shadowRadius, android:shadowDx, android:shadowDy. SpannableString prend en charge StrikethroughSpan et UnderlineSpan. Le contour du texte sur Android est implémenté via OutlineSpan ou une police personnalisée.
L'ellipse est le tronquage du texte avec des points de suspension lorsque le conteneur déborde. Sur iOS, elle est configurée via lineBreakMode .byTruncatingTail et numberOfLines. Sur Android — via android:ellipsize="end" et android:maxLines. Marquee est une animation de texte défilant disponible sur Android via android:ellipsize="marquee". Sur iOS, il n'y a pas d'équivalent intégré — la bibliothèque MarqueeLabel est utilisée. L'ellipse est obligatoire pour tous les textes sur une seule ligne dans les applications mobiles pour éviter le rognage du contenu.
Dynamic Type est un système de texte adaptatif sur iOS qui ajuste la taille de la police en fonction des paramètres d'Accessibilité de l'utilisateur. Utilisez UIFontMetrics pour mettre à l'échelle les polices personnalisées. Dynamic Type est obligatoire pour les applications conformes à l'accessibilité. Sur Android, l'équivalent est les unités sp et scaledPixels, qui s'adaptent en fonction des paramètres de taille de texte du système.
Questions fréquentes
NSAttributedString est une classe iOS pour créer du texte formaté avec des attributs de police, couleur et style au niveau des caractères et des plages.
SpannableString est une classe Android pour le marquage de texte via des objets Span : ForegroundColorSpan, StyleSpan, URLSpan, UnderlineSpan.
Ajoutez le fichier .ttf au projet, spécifiez-le dans Info.plist sous la clé Fonts provided by application, puis utilisez UIFont(name:).
Placez le fichier .ttf dans res/font/, créez une famille de polices XML et spécifiez android:fontFamily ou utilisez Typeface.createFromAsset().
Le crénage est l'espace entre les paires de caractères. Les ligatures sont des glyphes spéciaux pour les combinaisons de lettres. Ils sont contrôlés via NSKernAttributeName et NSLigatureAttributeName.
Résumé
Nous développerons une application mobile clé en main
IT Sectr crée des applications iOS et Android pour les startups et les entreprises depuis 2017. Nous vous conseillerons et vous proposerons la meilleure solution.