SwiftUI Series 11｜Mode sombre de SwiftUI, polices dynamiques et adaptation multi-tailles

Au début, de nombreuses pages semblaient normales sur la machine de développement :

-La couleur est ok -La taille de la police est également appropriée

• La mise en page est assez fluide

Mais venons-en à :

• mode sombre
• Police plus grande
• Écran plus étroit
• Copie plus longue

Le problème sera exposé immédiatement.

Cela montre que de nombreux soi-disant « problèmes d’adaptation » sont essentiellement dus au fait que la page est écrite dans un état par défaut depuis le début.

1. Le mode sombre, les polices dynamiques et les différents écrans demandent tous la même chose : la page est-elle flexible face aux changements environnementaux ?

Une situation courante consiste à examiner ces éléments d’adaptation séparément :

• Le mode sombre est un problème de couleur
• Les polices dynamiques sont une question de taille de police
• L’adaptation sur petit écran est un problème de mise en page

Bien sûr, ces jugements sont corrects, mais à un niveau supérieur, ils testent essentiellement la même chose :

La page est-elle établie uniquement dans un « environnement par défaut » ?

Si une page ne semble raisonnable que dans la taille de police par défaut, le mode clair et la taille standard, son problème est en réalité un manque de flexibilité.

2. L’échec d’adaptation le plus courant est que trop d’hypothèses visuelles sont codées en dur.

Par exemple :

• Le texte est toujours une ligne
• Hauteur de carte fixe
• La distance entre les icônes et la rédaction peut toujours être maintenue
• Une certaine couleur est suffisamment claire sur n’importe quel fond

Ces hypothèses peuvent toutes être vraies dans un environnement unique, mais une fois que l’environnement change, elles s’effondrent toutes ensemble.

Ce qui est donc vraiment important en matière d’adaptation, c’est d’écrire moins sur cette hypothèse fragile.

3. Le problème le plus courant exposé par les polices dynamiques est que le niveau de mise en page n’est pas stable.

Lorsque le sujet des polices dynamiques est abordé, la première réaction est :

• Si la taille de la police est trop grande, est-ce qu’elle dépassera la

Il s’agit certainement d’un problème, mais les risques les plus graves sont les suivants :

• Certaines structures ne sont intrinsèquement valables que sous une longueur de copie fixe.
• Certaines cartes sont intrinsèquement maintenues avec des hauteurs codées en dur
• Il n’y a aucune flexibilité dans certaines relations image-texte.

Les polices dynamiques testent donc si la mise en page n’est valable qu’à “cette taille”.

4. La vraie difficulté du mode sombre est de savoir si la relation entre la hiérarchie et le contraste sera déséquilibrée.

De nombreuses pages rencontrent des problèmes après le passage aux couleurs sombres :

• La relation entre l’arrière-plan et la hiérarchie du texte n’est pas claire
• Les couleurs d’accentuation sont belles en mode clair, mais sont dures en mode sombre
• Les informations secondaires ont un contraste trop faible dans les couleurs sombres

En d’autres termes, le mode sombre teste si la hiérarchie visuelle est suffisamment claire.

5. L’adaptation aux écrans de différentes tailles consiste essentiellement à savoir si la logique d’allocation d’espace est suffisamment stable

Certaines pages semblent confortables sur un grand écran, mais commencent à ressembler à ceci sur un petit écran :

• presser
• pause
• Tout est foiré après le saut de ligne

Cela montre que le problème ne vient généralement pas du petit écran lui-même, mais d’une logique d’allocation d’espace instable. Par exemple :

• Quels domaines doivent être élargis de manière élastique ? -Quelles zones peuvent être renvoyées à la ligne ?
• Quel contenu a la plus haute priorité

Je n’y ai pas pensé clairement au début, mais cela sera exposé une fois l’équipement modifié.

6. Conclusion : La véritable adaptabilité est essentiellement la flexibilité de la page aux changements environnementaux.

Pour le dire sous une forme plus courte, je dirais :

Les pages SwiftUI s’adaptent au mode sombre, aux polices dynamiques et aux écrans de différentes tailles. Ce qu’il faut vraiment faire, c’est ne pas verrouiller la page dans un environnement par défaut dès le début.

Lorsque la page elle-même est flexible, l’adaptation sera beaucoup plus naturelle ; Lorsqu’il n’y a pas d’élasticité, les plaques ultérieures deviennent généralement de plus en plus nombreuses.