PowerApps - Palette de Couleurs Dynamique avec Formules Nommées Tutoriels

Découvrez dans cette vidéo "palette de couleurs dynamique avec formules nommées" comment harmoniser l'apparence de votre application Power Apps. Grâce aux formules nommées, centralisez la gestion des couleurs pour simplifier les mises à jour futures. Ne manquez pas ces conseils pratiques qui transformeront vos projets en un clin d'œil !

04:39
3 vues

Disponible dans Microsoft365

00:00:04

l'apparence visuelle d'une application joue un rôle essentiel

00:00:08

pour garantir une bonne expérience utilisateur,

00:00:12

renforcer la cohérence graphique

00:00:14

et s'adapter aux standards de l'entreprise.

00:00:17

Grâce aux formules nommées,

00:00:19

il est possible de centraliser la gestion des couleurs dans un seul endroit,

00:00:23

assurant ainsi une harmonisation parfaite

00:00:26

et facilitant grandement les mises à jour

00:00:29

futures.

00:00:30

Dans ce tutoriel,

00:00:32

nous allons apprendre à créer une palette

00:00:34

de couleurs dynamique avec des formules nommées.

00:00:37

Nous utiliserons cette palette pour styliser différents éléments de l'interface

00:00:42

de manière simple et évolutive.

00:00:45

Utiliser des couleurs centralisées

00:00:47

permet d'unifier visuellement toute l'application

00:00:50

en suivant un thème principal,

00:00:52

souvent dicté par une charte graphique d'entreprise.

00:00:55

Cela permet également d'assurer

00:00:57

que toutes les modifications futures

00:00:59

se fassent en un seul changement de formule,

00:01:02

sans devoir passer manuellement sur chaque écran ou composant.

00:01:06

Dans l'arborescence de l'application,

00:01:08

sélectionnez l'objet app,

00:01:10

puis dans ses propriétés,

00:01:11

accédez à la section

00:01:13

formulace.

00:01:14

Saisissez la formule suivante.

00:01:17

chaque propriété correspond à un usage particulier.

00:01:21

La couleur principale,

00:01:23

secondaire,

00:01:24

d'accentuation

00:01:25

de fond

00:01:26

et de texte.

00:01:27

Le nom FXpalette est proposé à titre d'exemple.

00:01:31

Vous pouvez choisir une autre dénomination

00:01:34

en version française de Power Ups.

00:01:36

Chaque élément est séparé par un point virgule

00:01:39

et la formule est terminée par deux point virgule.

00:01:43

Toutes vos couleurs seront ainsi centralisées

00:01:45

et facilement réutilisables dans toute l'application.

00:01:50

Maintenant que la formule nommée FX palette a

00:01:53

été définie avec les différentes couleurs de l'interface,

00:01:57

il est temps

00:01:57

de l'appliquer concrètement

00:01:59

à vos éléments visuels.

00:02:01

Cette étape permet d'harmoniser l'apparence de votre application

00:02:06

tout en facilitant les modifications futures.

00:02:09

Voici comment procéder.

00:02:11

Pour commencer,

00:02:12

insérez un bouton sur l'écran en passant par le menu insérer

00:02:17

puis bouton.

00:02:18

une fois le bouton ajouté,

00:02:20

sélectionnez le et accédez à la propriété fil

00:02:23

qui correspond à la couleur de fond du bouton

00:02:26

dans la barre de formule située en haut de l'éditeur,

00:02:29

remplacez la valeur par défaut,

00:02:32

souvent un code RGBA

00:02:34

par fxpalette point primaire.

00:02:37

Vous constaterez immédiatement que le bouton adopte

00:02:39

la couleur principale définie dans votre palette.

00:02:43

Ensuite,

00:02:44

ajoutons un étiquette afin d'afficher un texte.

00:02:48

Une fois inséré,

00:02:49

sélectionnez ce contrôle

00:02:51

et accéder

00:02:52

à la propriété colore

00:02:54

qui détermine la couleur du texte.

00:02:57

Écrivez la formule FX

00:02:59

palette point texte.

00:03:01

Le texte s'affiche désormais avec la couleur

00:03:03

prévue pour les éléments textuels de l'application.

00:03:08

Poursuivons avec la personnalisation du fond de l'écran.

00:03:12

cliquer sur un espace vide de l'application pour sélectionner l'écran principal.

00:03:18

Une fois sélectionnée,

00:03:19

ouvrez la propriété fil dans la barre supérieure,

00:03:22

puis remplacez la valeur existante par FX palette point fond.

00:03:26

L'arrière-plan de votre application prendra alors automatiquement la

00:03:30

couleur de fond définie dans votre palette.

00:03:34

Enfin,

00:03:35

vous pouvez également créer un bouton secondaire

00:03:37

qui utilise une couleur différente de celle du bouton principal.

00:03:42

Pour cela,

00:03:42

insérer un nouveau bouton ou dupliquer celui que vous avez déjà stylisé.

00:03:48

dans la propriété fil,

00:03:50

indiquez la valeur FXpalette point secondaire afin

00:03:53

de lui appliquer une teinte secondaire.

00:03:55

Puis dans la propriété colore,

00:03:58

inscrivez de nouveau FXpalette point texte

00:04:01

pour que le texte reste cohérent

00:04:03

avec le reste de votre interface.

00:04:06

Grâce à cette méthode,

00:04:07

l'ensemble des éléments visuels de votre application

00:04:11

adopte automatiquement les couleurs définies dans la formule nommée.

00:04:15

Cela vous permet de centraliser la gestion de votre charte graphique.

00:04:19

si vous décidez un jour de modifier une couleur

00:04:22

dans FXpalette,

00:04:24

tous les composants liés se mettront à jour instantanément

00:04:27

sans que vous ayez à parcourir manuellement l'application

00:04:31

pour ajuster chaque élément un par un.

00:04:33

C'est une approche à la fois propre,

00:04:35

cohérente et évolutive.

Mandarine AI: CE QUI POURRAIT VOUS INTÉRESSER

LES COURS ASSOCIÉS Ce tutoriel fait partie des cours suivants

Abonnés

1 vues

E-learning Avancé

PowerApps : Approfondir les fonctionnalités avancées avec variables, formules nommées et automatisation

Découvrez des fonctionnalités avancées de Power Apps pour développer des applications encore plus puissantes, dynamiques et maintenables. Ce...

Cours E-learning

TOUS LES COURS