Swift Academy · Leçon

GeometryReader pour des mises en page adaptatives

Lire la géométrie du parent pour créer des interfaces proportionnelles et adaptées à l’appareil.

Leçon 4 sur 412 étapes

GeometryReader pour des mises en page adaptatives est une leçon Swift Academy gratuite sur CoddyKit. Ceci est la leçon 4 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage Swift Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours Swift Academy comprend 4 leçons au total.

Bienvenue

`GeometryReader` lit la taille disponible auprès du parent, ce qui vous permet de créer des mises en page proportionnelles aux dimensions de l'écran ou du conteneur.

Utilisation de base

```swift GeometryReader { geo in Text("Width: \(Int(geo.size.width))") .frame(width: geo.size.width * 0.8) } ```

Propriétés de GeometryProxy

`GeometryProxy` fournit : • `size: CGSize` — largeur et hauteur disponibles • `safeAreaInsets: EdgeInsets` — zone sécurisée du système • `frame(in:)` — cadre dans un espace de coordonnées donné

Dimensions proportionnelles

```swift GeometryReader { geo in HStack(spacing: 0) { Color.blue.frame(width: geo.size.width * 0.6) Color.green } } ```

Espaces de coordonnées

```swift GeometryReader { outer in VStack { GeometryReader { inner in let f = inner.frame(in: .named("outer")) Text("y: \(Int(f.minY))") } } } .coordinateSpace(name: "outer") ```

Zone sécurisée

```swift GeometryReader { geo in VStack { Spacer() Text("Bottom safe: \(Int(geo.safeAreaInsets.bottom))") .padding(.bottom, geo.safeAreaInsets.bottom) } } ```

Effet de défilement parallaxe

```swift ScrollView { ForEach(items) { item in GeometryReader { geo in let offset = geo.frame(in: .global).minY Image(item.image).offset(y: offset * 0.3) } } } ```

Clés de préférence pour la communication de la mise en page

```swift struct HeightKey: PreferenceKey { static var defaultValue: CGFloat = 0 static func reduce(value: inout CGFloat, nextValue: () -> CGFloat) { value = max(value, nextValue()) } } ``` Utilisez-les pour communiquer les dimensions des vues enfants vers le haut de la hiérarchie des vues.

Quand éviter GeometryReader

`GeometryReader` s'étend par défaut pour remplir tout l'espace disponible — il peut perturber les mises en page s'il est utilisé sans précaution. Privilégiez `.frame(maxWidth:.infinity)` et les piles flexibles lorsque c'est possible.

Alternative : protocole Layout

Swift 5.7+ a introduit le protocole `Layout` pour créer des algorithmes de mise en page entièrement personnalisés, sans la surcharge de GeometryReader.

Vérification rapide

Que contient `GeometryProxy.size` ?

Réponds-y dans la leçon interactive

Récapitulatif

Points essentiels : • `GeometryReader { geo in }` lit la taille proposée par le parent • `geo.size` — largeur/hauteur ; `geo.safeAreaInsets` — marges internes du système • `frame(in:)` — position dans un espace de coordonnées nommé ou global • Utilisez PreferenceKeys pour communiquer les dimensions vers le haut • Privilégiez les mises en page flexibles à GeometryReader lorsque c'est possible Cours terminé ! Ensuite : flux de données SwiftUI.

Gratuit pour commencer

Apprends Swift avec un tuteur IA — gratuit

Écris et exécute du vrai code dans ton navigateur, obtiens de l'aide instantanée d'un tuteur IA disponible 24h/24, et reprends là où tu t'es arrêté sur le web ou dans l'app.

Cours: 122
Leçons: 409

Commencer gratuitement Voir le cours complet

Questions Fréquemment Posées

La leçon « GeometryReader pour des mises en page adaptatives » est-elle gratuite ?

Oui — le texte complet de « GeometryReader pour des mises en page adaptatives » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours Swift Academy, passe à CoddyKit PRO. Le cours Swift Academy comprend 4 leçons au total.

Qu'est-ce que j'apprendrai dans « GeometryReader pour des mises en page adaptatives » ?

Lire la géométrie du parent pour créer des interfaces proportionnelles et adaptées à l’appareil. Tu pratiques Swift Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.

Dois-je avoir de l'expérience pour commencer Swift Academy ?

Aucune expérience préalable n'est requise. Swift Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 4 sur 4.

Combien de temps prend la leçon « GeometryReader pour des mises en page adaptatives » ?

La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.

Peux-tu écrire et exécuter du code dans cette leçon Swift Academy ?

Oui. Chaque leçon Swift Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.

Toutes les leçons de ce cours

Fondamentaux de VStack, HStack et ZStack
LazyVGrid et LazyHGrid
Modificateurs Spacer, Padding et Frame
GeometryReader pour des mises en page adaptatives

← Retour à Swift Academy