Attributs variables
Les attributs variables vous permettent de piloter dynamiquement les attributs visuels des composants UI de votre application.
Vous pouvez accéder aux attributs variables d’un composant depuis la fenêtre de propriété à droite en cliquant sur le bouton Attributs variables
Conditions d’application
Un attribut variable dispose de une ou plusieurs conditions d’application. Cela signifie que la nouvelle valeur de l’attribut sera appliqué uniquement si les conditions sont VRAI, sinon c’est l’attribut par défaut du composant qui est appliqué (celui défini dans la fenêtre de propriété)
Vous pouvez définir autant de conditions que nécessaire pour un même attributs en cliquant sur l’icone “plus” Ajouter une condition
Attention cependant à ne pas multiplier les conditions sur les attributs
Les deux attributs variables ci-dessous sont redondant. Etant donné que c’est la valeur par défaut de l’attribut qui est appliqué si la condition est fausse, dans ce cas précis le 2ème attribut variable est inutile puisqu’il suffit de paramétrer la propriété visible par défaut à VRAI du composant
Attribut cible
Un attribut variable dispose d’un attribut cible à modifier (la propriété visible par exemple).
Si vous avez plusieurs lignes d’attributs variables qui concernent un même attribut et que plusieurs de ces lignes sont VRAI en même temps, la valeur de l’attribut qui sera pris en compte est le dernier de la liste en partant du haut.
Valeur de l’attribut
Il s’agit de la nouvelle valeur de l’attribut qui peut être fixe ou variable. Celle-ci dépend de l’attribut, par exemple si l’attribut concerne la couleur de fond, c’est donc logiquement une couleur (rgb ou hex) qui est attendu en valeur.
Exemples
On souhaite passer la couleur de fond de notre bouton “Mon bouton” en rouge lorsque la valeur 1 est saisie dans l’input qui se trouve au dessus.
Lorsque la valeur 1 sera saisie dans l’input la couleur de fond du bouton passera au rouge, dans tous les autres cas c’est la couleur bleu qui sera utilisé (la couleur de fond par défaut définie dans les propriétés du bouton)
On souhaite piloter une barre de progression à partir de la valeur saisie dans un input. La barre de progression est construite à partir d’une zone interne grise à l’intérieur de laquelle se trouve une zone interne bleu sur laquelle nous avons ajouté un attribut variable.
Contrairement à l’exemple 1, cette fois ci nous avons défini la valeur de l’attribut comme variable puisqu’il doit être lié dynamiquement à celle de l’input. L’attribut piloté est la largeur(%) de la zone interne et les conditions sont toutes les deux égale à 0 puisqu’on souhaite que la condition soit toujours VRAI, on souhaite que la largeur de la zone interne soit toujours égale à la valeur de l’input
Nous avons placé un composant label à l’intérieur d’une colonne conteneur dans un tableau. On souhaite modifier la couleur de fond du composant label en fonction de la valeur du champ STATUT de la source de donnée. Les attributs variables on été ajoutés sur le label, celui-ci ayant une couleur de fond vert par défaut.
Deux attributs ont été ajoutés, le premier pour gérer la couleur de fond rouge et le deuxième pour le orange. Le vert étant la couleur de fond par défaut du composant, il n’est pas nécessaire de rajouter un attribut variable pour le piloter, le label sera affiché en vert dans le cas ou le champ STATUT sera différent de Stopped et In progress
On souhaite afficher un bouton uniquement si tous les inputs du formulaire ont été remplis. Par défaut le composant bouton est non visible.
