@Children
Prend comme valeur un tableau de classes étendant TagImpl qui correspondent aux classes des tags enfants à instancier. Lors du lancement de l’application, cette annotation est traitée en premier afin de construire entièrement l’arborescence des tags. Puis l’arbre est parcouru afin de traiter les autres annotations.
Exemple : InstancesTable permet d’afficher les instances d’un type. Les instances de cette classe ont 3 enfants : HeaderRow qui correspond à la ligne de titre, InstanceBuilder qui permet de créer une nouvelle instance du type affiché, et enfin ContentRow qui affiche les instances du type affiché.
|
1 2 3 4 5 |
/* ... */ @Children({ HeaderRow.class, InstanceBuilder.class, ContentRow.class }) /* ... */ public class InstancesTable extends FlexDiv implements SelectionDefaults { } |
@Attribute
Prend en paramètre un nom (name) et une valeur (value) d’attribut HTML à appliquer au(x) DOM node(s) à créer.
Exemple : Définition d’attributs pour une image :
|
1 2 3 4 5 6 7 |
@Children(HtmlImg.class) @Attribute(path = HtmlImg.class, name = "src", value = "logoTransp.png") @Attribute(path = HtmlImg.class, name = "alt", value = "logo") @Style(path = HtmlImg.class, name = "height", value = "auto") @Style(path = HtmlImg.class, name = "width", value = "150px") public static class Logo extends FlexDiv { } |
@BindAction
Prend comme valeur une classe implémentant l’interface ContextAction, qui étend elle-même BiConsumer<Context, Tag>.
S’applique à des tags implémentant ActionDefaults, par exemple des boutons ou liens. Au clic, le biconsumer défini dans la classe indiquée est exécuté avec en arguments le tag et le contexte associés au DOM node concerné.
Exemple : Création d’un lien permettant de supprimer un générique.
|
1 2 3 4 5 6 7 8 9 |
@BindAction(value = REMOVE.class) public class RemoveLink extends HtmlHyperLink { } public class REMOVE implements ContextAction { @Override public void accept(Context context, Tag tag) { context.remove(); } } |
@BindSelection
S’applique à un tag implémentant l’interface SelectionDefaults.
Prend en paramètre une classe (value) et éventuellement un entier (valuePos).
La classe et l’entier permettent de sélectionner un enfant du tag auquel l’annotation est appliquée. Si ce tag n’a qu’un enfant de la classe indiquée, l’entier n’est pas nécessaire. Sinon, l’entier précise qu’il faut choisir le valuePos-ième enfant (en commençant à 0) de la classe donnée par value.
Une propriété appelée sélection est créée à la racine de l’arbre des contextes. Elle contient un contexte et peut-être utilisée par exemple pour éditer l’élément sélectionné à l’aide d’un composant dédié. @BindSelection est utilisée typiquement sur un composant auquel un forEach est appliqué, et indique que la sélection est un des contextes liés à ce composant. La sélection sera modifiée ou réinitialisée lorsqu’un des génériques correspondant à un de ces contextes est supprimé ou modifié.
Exemple : InstancesTable a 3 enfants qui étendent tous la classes Composite. Le 3e est répété pour chaque instance du générique du contexte courant. Les contextes ainsi créés peuvent être stockés dans la sélection.
On aurait pu utiliser @BindSelection(ContentRow.class) au lieu de préciser une position.
|
1 2 3 4 5 6 7 8 |
@BindSelection(value = Composite.class, valuePos = 2) /* ... */ @Children({ HeaderRow.class, InstanceBuilder.class, ContentRow.class }) /* ... */ @ForEach(path = ContentRow.class, value = ObservableListExtractor.SUBINSTANCES.class) /* ... */ public class InstancesTable extends FlexDiv implements SelectionDefaults { } |
@BindText
Prend comme valeur une classe implémentant TextBinding, qui étend BiFunction<Context, Tag, ObservableValue>. Le contenu textuel du ou des DOM nodes créés correspondra à la valeur de l’ObservableValue. Par défaut, affiche une chaîne correspondant au générique du contexte courant, déterminée en fonction du StringExtractor (que l’on peut définir avec l’annotation @SetStringExtractor).
Exemple : Pour afficher un message d’erreur dépendant du contexte :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
@BindText(ERROR_COMPONENTS.class) public static class ErrorSpan extends HtmlSpan {} public static class ERROR_COMPONENTS implements TextBinding { @Override public ObservableValue apply(Context context, Tag tag) { if (context.getGeneric().getComponents().isEmpty()) return new SimpleStringProperty("You must enter a value."); return new SimpleStringProperty(context.getGeneric().getComponents().stream() .map(i -> i.toString()) .collect(Collectors.joining(", ")) + " needed to create a " + context.getGeneric().toString() + "."); } } |
@SetStringExtractor
Prend en paramètre une classe implémentant StringExtractor, qui étend Function<Generic, String>. Cette fonction est utilisée pour déterminer la chaîne à afficher lors de l’utilisation de bindText() ou @BindText().
Exemple : Indique que le titre de la table contenant les instances d’un type doit contenir « Type(s) management ».
|
1 2 3 4 5 6 7 8 9 10 |
@SetStringExtractor(StringExtractor.MANAGEMENT.class) public static class InstancesTableTitle extends HtmlDiv { } public static class MANAGEMENT implements StringExtractor { @Override public String apply(Generic generic) { return StringExtractor.SIMPLE_CLASS_EXTRACTOR.apply(generic) + "(s) Management"; } } |
@SetText
Prend en paramètre une chaîne de caractères qui est le contenu du HTML DOM node à créer.
Exemple : Met le texte « User Guide » sur le bouton :
|
1 2 3 4 |
@SetText("User Guide") /* ... */ public static class GuideButton extends HtmlButton { } |
Remarque : Comme @DirectSelect, @SetText peut avoir comme paramètre un tableau de valeurs au lieu d’une valeur unique, pour les cas où plusieurs tags descendants sont sélectionnés par les paramètres path et pos.
@StyleClass
Prend en paramètre un tableau de chaînes de caractères correspondant aux noms des classes CSS à appliquer aux DOM nodes créés.
Exemple : Indique que la div contenue dans une div modale a les classes widthResponsiveet modal-content :
|
1 2 3 4 5 6 |
@Children(FlexDiv.class) /* ... */ @StyleClass(path = FlexDiv.class, value = { "widthResponsive", "modal-content" }) /* ... */ public class Modal extends FlexDiv { } |
@Switch
Prend en paramètre un tableau de classes implémentant TagSwitcher, qui étend BiFunction<Context, Tag, ObservableValue>. Le tag ne sera pris en compte que si toutes les ObservableValue retournées par les fonctions valent true.
Exemple : L’InstanceBuilder n’est affiché que si on est en admin mode.
|
1 2 3 4 5 6 7 8 9 10 11 |
@Switch(TagSwitcher.ADMIN_MODE_ONLY.class) /* ... */ public class InstanceBuilder extends Composite implements GSBuilderDefaults, PasswordDefaults { } public static class ADMIN_MODE_ONLY implements TagSwitcher { @Override public ObservableValue apply(Context context, Tag tag) { return tag.getAdminModeProperty(context); } } |
@FlexDirectionStyle
Prend en paramètre soit FlexDirection.ROW, soit FlexDirection.COLUMN. Ne peut être appliqué qu’à FlexDiv ou ses extensions. Définit la flex-direction à appliquer.
Exemple : On crée une div contenant elle-même une div de titre et une table contenant les instances d’un type, avec une flex-direction column.
|
1 2 3 4 |
@Children({ TitleDiv.class, InstancesTable.class }) @FlexDirectionStyle(FlexDirection.COLUMN) public static class TitledInstancesTable extends DivWithTitle { } |
@InheritStyle
Prend en paramètre un tableau de chaînes de caractères correspondant aux noms de styles CSS que l’on souhaite hériter de l’ancêtre le plus proche pour lequel cette propriété est définie. N’a d’intérêt que pour les styles qui ne sont pas hérités automatiquement en CSS.
Exemple : Indique que le bouton doit avoir la même couleur de fond que son conteneur :
|
1 2 3 |
@InheritStyle("background-color") public static class GuideButton extends HtmlButton { } |
@KeepFlexDirection
Ne peut être appliqué qu’à FlexDiv ou ses extensions. Indique que ce composant a la même direction que son parent.
@ReverseFlexDirection
Ne peut être appliqué qu’à FlexDiv ou ses extensions. Indique que ce composant a la direction orthogonale à celle de son parent.
Exemple : Les enfants d’InstanceTable doivent avoir la direction opposée à celle de la table elle-même.
|
1 2 3 |
@ReverseFlexDirection(path = Composite.class) public class InstancesTable extends FlexDiv implements SelectionDefaults { } |
Remarque : Les annotations @FlexDirectionStyle, @KeepFlexDirection et @ReverseFlexDirection permettent de définir des composants dont tous les descendants changent de direction de façon appropriée lorsque la direction du tag racine est inversée.
Exemple : InstancesTable est définie avec une direction colonne, avec chaque instance correspondant à une ligne. Pour créer la même table en direction ligne, avec chaque instance sur une colonne, il suffit de modifier @FlexDirectionStyle :
|
1 2 3 |
@FlexDirectionStyle(FlexDirection.ROW) public static class HorizontalInstancesTable extends InstancesTable { } |
@Style
Prend en paramètre un nom (name) et une valeur (value) de propriété CSS à appliquer au(x) DOM node(s) à créer.
Exemple : Style du titre de la page :
|
1 2 3 4 5 6 7 8 9 |
@FlexDirectionStyle(FlexDirection.ROW) @Style(name = "justify-content", value = "center") @Style(name = "flex", value = "3") @Style(name = "align-items", value = "center") @Style(name = "color", value = "White") @Style(name = "text-shadow", value = "1px 1px 2px black, 0 0 25px blue, 0 0 5px darkblue") /* ... */ public static class AppTitleDiv extends FlexDiv { } |
