Jetpack Compose : développez des interfaces accessibles et modernes pour Android

Auteur(s) :

Demey, Fanny Découvrir l'auteur

Résumé

Un guide pour se former à la création d'applications mobiles pour Android en utilisant Jetpack Compose, basé sur le langage Kotlin. L'auteure présente les notions de base puis explique comment l'utiliser à travers des exemples concrets.

Éditeur(s)
- Éditions ENI
Date
- C 2023
Notes
- La couv. porte e plus : "Informatique technique" ; "Version en ligne offerte ! pendant 1 an"
- Contient un "flashcode" permettant d'accéder à un contenu
Langues
- Français
Description matérielle
- 1 vol. (488 p.) : ill. ; 22 cm
Collections
- Expert IT
Sujet(s)
ISBN
- 978-2-409-03966-9
Indice
- 681.25 Autres langages informatiques
Quatrième de couverture
- Jetpack Compose
  Développez des interfaces accessibles et modernes pour Android
  Ce livre s'adresse aux développeuses et développeurs qui souhaitent apprendre à développer des interfaces pour Android en utilisant Jetpack Compose, le kit d'outils recommandé par Google, basé sur le langage Kotlin. Il porte un regard soucieux sur les bonnes pratiques d'accessibilité qui intéresseront également toute personne désireuse d'améliorer le quotidien numérique des personnes en situation de handicap. Des connaissances de base sur le développement Android sont requises.
  Dans ce livre, l'autrice détaille pas à pas la manière de prendre en main la bibliothèque Jetpack Compose pour d'une part développer des interfaces qui répondent aux besoins de modernité des applications actuelles, et d'autre part pour répondre à la nécessité de développer des applications accessibles à toutes et à tous.
  Après une explication des raisons motivant la création de Jetpack Compose et des nouveaux concepts ainsi apportés au développement d'interfaces pour Android tels que la programmation déclarative ou le mécanisme de Recomposition, le lecteur découvre comment l'utiliser au sein d'un projet Android et initie son premier composant. Il est invité à parcourir les composants de base de cette bibliothèque en réalisant des textes, des boutons et des champs de formulaires, et à les mettre en page. Un chapitre est ensuite dédié à la gestion des états et des effets, deux notions importantes qui permettront au lecteur de concevoir ses composants dans les règles de l'art. Pour finir, l'autrice explique comment afficher des listes de manière optimisée et comment effectuer des mises en page plus avancées. Pour finir, le lecteur apprend à animer simplement une interface et à la tester de manière automatisée.
  Dans chaque chapitre de ce livre, l'autrice partage des bonnes pratiques d'accessibilité avec des exemples concrets.
Tables des matières
- - Jetpack Compose
  - Développez des interfaces accessibles et modernes pour Android
  - Avant-propos
  - 1. Introduction13
  - 2. Parti pris de ce livre15
  - 2.1 Ce qui ne sera pas abordé15
  - 2.2 Choix techniques15
  - 2.3 Choix d'écriture16
  - Chapitre 1
  - Introduction
  - 1. Des applications accessibles17
  - 1.1 Qu'est-ce que l'accessibilité numérique ?18
  - 1.2 Quatre formes de handicap18
  - 1.2.1 Le handicap auditif19
  - 1.2.2 Le handicap moteur20
  - 1.2.3 Le handicap cognitif21
  - 1.2.4 Le handicap visuel23
  - 1.3 Responsabilités des développeurs et développeuses24
  - 1.3.1 Les référentiels d'accessibilité25
  - 1.3.2 Savoir utiliser Talkback27
  - 2. Des applications modernes32
  - 2.1 Des challenges uniques spécifiques au mobile32
  - 2.2 Des appareils de plus en plus puissants menant à des interfaces de plus en plus complexes33
  - 2.3 Un UI Toolkit original qui n'est plus à la hauteur35
  - 3. Prérequis35
  - 3.1 Kotlin35
  - 3.1.1 Fonctions36
  - 3.1.2 Traitement asynchrone38
  - 3.2 Android42
  - Chapitre 2
  - La genèse de Jetpack Compose
  - 1. Introduction45
  - 2. Les raisons motivant la création de Jetpack Compose45
  - 2.1 Pouvoir mettre à jour le UI toolkit en dehors du cycle de mise à jour de la plateforme45
  - 2.2 Améliorer la maintenabilité du UI Toolkit original46
  - 2.3 Se débarrasser des choix d'implémentation contraignants, liés au principe d'héritage47
  - 2.4 Simplifier le développement de composants réutilisables48
  - 2.5 Prendre en compte l'accessibilité dès la conception49
  - 2.6 Appliquer une meilleure séparation des responsabilités52
  - 2.7 Les lacunes de la programmation impérative54
  - 2.8 Conclusion56
  - 3. Les partis pris techniques de Jetpack Compose57
  - 3.1 Avant-propos57
  - 3.2 La structure d'un composant Jetpack Compose58
  - 3.3 Un composant est une fonction58
  - 3.3.1 La piste écartée de l'utilisation des classes59
  - 3.3.2 L'utilisation de fonction61
  - 3.4 Un composant est une fonction qui prend en entrée des paramètres62
  - 3.4.1 Des données qui circulent dans un sens62
  - 3.4.2 Des événements qui circulent dans l'autre sens63
  - 3.4.3 Une fonction Composable ne gère pas l'état du composant mais le représente64
  - 3.5 L'annotation @Composable66
  - 3.5.1 Comment fonctionne cette annotation ?66
  - 3.5.2 Comment utiliser le mot-clé @Composable ?67
  - 3.5.3 L'arbre de composition68
  - 3.6 La recomposition68
  - 3.6.1 Les optimisations du processus de recomposition70
  - 3.6.2 Règle n°1 : une fonction Composable ne doit pas générer d'effet de bord70
  - 3.6.3 Règle n°2 : une fonction Composable doit être idempotente73
  - 3.7 Le nommage des fonctions Composables75
  - 3.8 Une fonction @Composable ne retourne rien76
  - 3.9 La programmation déclarative76
  - 4. L'arbre sémantique pour gérer l'accessibilité78
  - 4.1 Représentation de l'arbre sémantique79
  - 4.2 Propriétés sémantiques81
  - 4.3 Propriétés sémantiques des composants de la bibliothèque Compose UI83
  - 4.4 Visualiser l'arbre sémantique et ses propriétés avec Android Studio84
  - 5. De l'annotation @Composable au rendu visuel à l'écran86
  - 5.1 Interprétation de l'annotation Composable par le compilateur87
  - 5.2 Mise en mémoire de l'interface dans la Slot table lors de l'exécution88
  - 5.3 Les trois phases de rendu d'un écran90
  - 6. Conclusion91
  - Chapitre 3
  - Les bases de Compose UI
  - 1. Premiers pas93
  - 1.1 Les dépendances Jetpack Compose93
  - 1.2 Créer un nouveau projet Android avec Jetpack Compose94
  - 1.3 Ajouter Jetpack Compose à un projet existant96
  - 1.4 Le composant racine98
  - 1.4.1 Une activité Jetpack Compose98
  - 1.4.2 Jetpack Compose au sein d'une vue XML100
  - 1.5 Aperçu d'un composant utilisant Compose UI102
  - 1.6 Prévisualiser un composant avec Android Studio104
  - 2. Modifier106
  - 2.1 Définition106
  - 2.1.1 À quoi sert un Modifier ?107
  - 2.1.2 Les Modifiers peuvent se chaîner108
  - 2.1.3 L'ordre des Modifiers a une importance109
  - 2.1.4 Certains Modifiers sont type safe111
  - 2.2 Le Modifier .semantics() pour gérer l'accessibilité113
  - 2.3 Des Modifiers qui s'enchaînent114
  - 2.4 Bonne pratique : tout composant doit exposer un paramètre Modifier117
  - 3. Les thèmes121
  - 3.1 Création d'un MaterialTheme121
  - 3.1.1 La notion de thème au sein de Material Design121
  - 3.1.2 La fonction Composable MaterialTheme124
  - 3.1.3 Définir un thème propre à notre application125
  - 3.1.4 Personnalisation des couleurs127
  - 3.1.5 Personnalisation de la typographie128
  - 3.1.6 Personnalisation des formes133
  - 3.2 L'objet MaterialTheme pour accéder aux attributs de notre thème134
  - 3.3 Appliquer les couleurs « On » par défaut136
  - 3.3.1 Le composant Surface137
  - 3.3.2 CompositionLocal139
  - 3.4 Bonnes pratiques d'accessibilité141
  - 3.4.1 Des couleurs avec des niveaux de contraste suffisamment prononcés142
  - 3.4.2 Une typographie lisible145
  - 3.4.3 Un thème homogène et cohérent146
  - 3.4.4 Un thème sombre146
  - 3.5 Aller plus loin avec les thèmes147
  - 4. Conclusion148
  - Chapitre 4
  - Textes, boutons et images
  - 1. Textes149
  - 1.1 Les paramètres de la fonction Composable Text150
  - 1.2 Style153
  - 1.2.1 Première version brute du composant153
  - 1.2.2 Version stylisée du composant155
  - 1.2.3 Version stylisée via TextStyle156
  - 1.2.4 Version reposant sur le thème Material Design157
  - 1.3 Plusieurs styles au sein d'un même texte158
  - 1.4 Bonnes pratiques d'accessibilité concernant les textes161
  - 1.4.1 Le contexte du texte est véhiculé implicitement par un élément non textuel162
  - 1.4.2 Le texte contient du texte barré166
  - 1.4.3 Le texte contient des caractères spéciaux ou des abréviations168
  - 1.4.4 Le texte est réparti sur plusieurs composants agencés d'une manière spécifique168
  - 2. Boutons171
  - 2.1 Les paramètres du composant Button172
  - 2.1.1 Introduction172
  - 2.1.2 Un composant 100 % personnalisable175
  - 2.1.3 Personnaliser l'apparence d'un bouton avec ButtonDefaults178
  - 2.2 Bouton icône181
  - 2.2.1 Les paramètres du composant IconButton181
  - 2.2.2 Le composant Icon183
  - 2.3 Boutons flottants183
  - 2.4 Un composant cliquable grâce au Modifier .clickable186
  - 2.5 Bonnes pratiques d'accessibilité concernant les boutons188
  - 2.5.1 Associer un texte alternatif aux composants de type IconButton189
  - 2.5.2 Veillez à ce que les boutons flottants soient bien atteignables avec un lecteur d'écran190
  - 2.5.3 Annoncer les informations affichées temporairement suite à une action194
  - 2.5.4 Annoncer les changements d'état d'un composant suite à une action198
  - 2.5.5 Personnaliser le nom de l'action associée au bouton avec la propriété onClickLabel200
  - 3. Images202
  - 3.1 Les paramètres de la fonction Image202
  - 3.2 Charger une image à partir d'une URL205
  - 3.3 La fonction Icon206
  - 3.4 Bonnes pratiques d'accessibilité208
  - 3.4.1 Quand faut-il écrire un texte alternatif ?208
  - 3.4.2 Comment écrire un texte alternatif ?210
  - Chapitre 5
  - Champs de formulaire
  - 1. Introduction213
  - 2. Champs de saisie213
  - 2.1 Aperçu du composant TextField214
  - 2.2 Les paramètres de la fonction Composable TextField217
  - 2.3 Style220
  - 2.4 Styles multiples au sein d'un champ de saisie222
  - 2.5 Faciliter la saisie des douze chiffres d'une carte bancaire225
  - 2.6 Bonnes pratiques d'accessibilité pour les champs de saisie227
  - 2.6.1 Donner la possibilité à l'utilisateur d'afficher et masquer le contenu d'un champ de type mot de passe227
  - 2.6.2 Informer suffisamment tôt l'utilisateur des contraintes d'un champ de saisie232
  - 2.6.3 Informer l'utilisateur s'il y a une erreur dans sa saisie234
  - 2.6.4 Permettre le remplissage automatique dans certains types de champs237
  - 2.6.5 Utiliser un label et pas seulement un placeholder240
  - 3. Boutons de type radio, cases à cocher et switchs245
  - 3.1 Boutons de type radio245
  - 3.2 Cases à cocher249
  - 3.3 Switch253
  - 3.3.1 Amélioration du contraste du composant Switch254
  - 3.3.2 Associer un texte à un Switch256
  - Chapitre 6
  - Mise en page standard
  - 1. Introduction259
  - 2. Le processus de mise en page260
  - 2.1 La phase de layout261
  - 2.1.1 Le processus de mesure261
  - 2.1.2 Le processus de positionnement264
  - 3. Mise en page en ligne ou en colonne265
  - 3.1 Le layout Row265
  - 3.2 Le layout Column267
  - 4. Modifiers affectant la mise en page269
  - 4.1 La taille270
  - 4.2 Le positionnement272
  - 4.2.1 Alignement272
  - 4.2.2 Alignement sur la ligne de base274
  - 4.2.3 Poids277
  - 4.2.4 Marge279
  - 4.3 Le défilement280
  - 5. Mise en page en superposition282
  - 5.1 Les paramètres du layout Box282
  - 5.2 Cas d'usage du layout Box286
  - 5.3 Alignement unitaire des composants en superposition288
  - 5.4 Taille relative d'un enfant289
  - 6. Mise en page selon l'espace disponible avec BoxWithConstraints292
  - 6.1 Cas d'usage293
  - 6.2 Impact sur le processus de mise en page295
  - 7. Les mesures intrinsèques296
  - 7.1 Introduction296
  - 7.2 Définition des mesures intrinsèques297
  - 7.3 Cas d'usage en largeur298
  - 7.4 Cas d'usage en hauteur300
  - 8. Bonnes pratiques d'accessibilité302
  - 8.1 Redimensionnement sans dégradation jusqu'à 200 %302
  - 8.1.1 Exemple303
  - 8.1.2 Comment détecter ce type d'anomalies ?305
  - 8.1.3 Correction307
  - 8.2 Navigation facilitée grâce aux titres309
  - 8.2.1 Exemple309
  - 8.2.2 Correction310
  - 8.3 Navigation facilitée grâce aux regroupements de composant.311
  - 8.3.1 Exemple311
  - 8.3.2 Correction311
  - Chapitre 7
  - Gestion des états et des effets
  - 1. Qu'est-ce qu'un état ?313
  - 1.1 Introduction313
  - 1.2 Différents types d'états315
  - 1.3 Production d'un Screen UI State318
  - 1.4 Production d'un UI Elément State321
  - 1.4.1 Cas n°1 : la logique UI est simple323
  - 1.4.2 Cas n°2 : la logique UI est complexe et implique un ou plusieurs états324
  - 1.5 Résumé329
  - 2. Composant sans état interne330
  - 2.1 Origine de cette pratique330
  - 2.2 Conception de composants sans état332
  - 2.2.1 Unidirectional Data Flow (UDF)332
  - 2.2.2 Etats et événements dans les paramètres333
  - 2.3 Résumé341
  - 3. Composants avec état interne342
  - 3.1 La fonction remember342
  - 3.2 Composant avec état immutable343
  - 3.2.1 Cas pratique343
  - 3.3 Composant avec état mutable345
  - 3.3.1 La fonction mutableStateOf()345
  - 3.3.2 Cas pratique346
  - 3.3.3 Différentes manières de déclarer un état mutable347
  - 3.4 La fonction rememberSaveable349
  - 3.5 Autres états Android supportés349
  - 3.5.1 Cas pratique350
  - 3.6 Résumé351
  - 4. Arbre de décision : où gérer l'état ?351
  - 5. Gestion des effets de bord352
  - 5.1 Introduction352
  - 5.2 Gestion d'effet de bord synchrone354
  - 5.2.1 DisposableEffect354
  - 5.2.2 SideEffect356
  - 5.3 Gestion d'effet de bord asynchrone359
  - 5.3.1 rememberCoroutineScope359
  - 5.3.2 LaunchedEffect361
  - 5.4 Effets de bord produisant un état363
  - 5.4.1 rememberUpdatedState363
  - 5.4.2 produceState365
  - 5.4.3 derivedStateOf366
  - 5.4.4 remember368
  - Chapitre 8
  - Les listes
  - 1. Introduction371
  - 2. Définition du contenu via un DSL374
  - 2.1 DSL : définition374
  - 2.2 Accès au DSI via LazyListScope375
  - 2.3 Les fonctions du DSL377
  - 2.3.1 La fonction item377
  - 2.3.2 Les fonctions items379
  - 2.3.3 La fonction itemslndexed384
  - 2.3.4 La fonction stickyHeader386
  - 3. LazyColumn et LazyRow387
  - 3.1 Introduction387
  - 3.2 Paramètres388
  - 3.3 Cas d'usage390
  - 3.4 Point de vigilance : imbrication de Lazy layout dans un layout standard défilable394
  - 4. Grilles398
  - 4.1 Paramètres de LazyVerticalGrid et LazyHorizontalGrid398
  - 4.2 Cas d'usage de LazyVerticalGrid et LazyHorizontalGrid400
  - 4.2.1 Grille verticale adaptative400
  - 4.2.2 Grille horizontale avec un nombre de lignes fixe401
  - 4.3 Grilles contenant des éléments de hauteur ou largeur différente403
  - 4.3.1 Cas d'usage403
  - 5. Contrôler et réagir à l'état de défilement404
  - 5.1 Le State Holder d'un lazy layout404
  - 5.2 Cas d'usage406
  - 5.2.1 Observer la position de défilement406
  - 5.2.2 Actionner le défilement vers une position411
  - Chapitre 9
  - Une interface riche et animée
  - 1. Les composants Materials413
  - 1.1 Une librairie de composants personnalisables413
  - 1.2 Le slot API Pattern415
  - 1.2.1 Définition415
  - 1.2.2 Principes de conception du Slot API Pattern415
  - 1.3 Prise en main du composant Scaffold417
  - 1.3.1 Signature et paramètres417
  - 1.3.2 Squelette420
  - 1.3.3 Analyse421
  - 1.3.4 Cas pratique422
  - 2. Les animations430
  - 2.1 Animer la visibilité430
  - 2.2 Animer la taille d'un contenu434
  - 2.3 Animer une valeur437
  - 2.4 Les effets négatifs des animations sur l'accessibilité440
  - 2.4.1 Mouvement, clignotement, défilement440
  - 2.4.2 Animation de mouvement lors d'une interaction441
  - 2.5 Personnaliser le comportement d'une animation442
  - 2.5.1 Différents comportements442
  - 2.5.2 Accélérer ou ralentir444
  - 2.5.3 Personnaliser le comportement d'une animation et sa vitesse d'exécution446
  - 2.6 Aller plus loin450
  - Chapitre 10
  - Les tests automatisés
  - 1. Introduction451
  - 1.1 Installation451
  - 1.2 Différents types de tests452
  - 2. Définir l'interface à tester avec createComposeRule453
  - 3. Les fonctions permettant de tester une interface456
  - 3.1 Rechercher, actionner, vérifier456
  - 3.2 Matcher458
  - 3.3 Associer un tag à un composant459
  - 4. Tester au sein d'une activité461
  - 4.1 Accéder aux ressources462
  - 4.2 Tester de bout en bout une activité464
  - 5. Arbre sémantique465
  - 5.1 Deux versions de l'arbre sémantique : fusionné et non fusionné465
  - 5.2 Imprimer l'arbre sémantique dans les logs pour déboguer466
  - 5.3 Cas d'usage : arbre non fusionné dans un test469
  - 5.4 Synchronisation des tests473
  - 5.4.1 Cas d'usage : synchroniser manuellement l'interface et contrôler le temps474
  - 5.4.2 Cas d'usage : attendre un traitement477
  - 6. Conclusion478
  - Index479
Origine de la notice:
- BPI