Référentiel des contrôles graphiques

Note

Attention, les éléments présentés ici sont à la frontière (ou au delà…) du SDK. Ces éléments ne sont donc pas obligatoirement maintenus sur des évolutions de versions.

Cette page présente chaque champ et composant graphique présent dans le framework, ainsi que les méthodes principales sur les classes.

En Java, les méthodes associées aux attributs (getter/setter) sont accessibles :

  • Soit directement depuis la classe
  • Soit sur le component lié : récupérable sur la classe via un get*InputComponent()

Champs

In addition to the graphical components, Process offers a whole set of objects named “fields” enabling to quickly develop screens via an XML description. These fields are available to build process documents forms (customization) and screens defined in the screens XML definition file.

Two notes about the description of these fields:

  • Shortcuts are available only in the form customization context.
  • The name attribute that identifies a screen field is called “property” in the form customization context.

Most of Java classes displayed in this section respect the same convention. For one Java class named XXXField, there is one Java class named CltXXX (graphical component: widget). A XXXField class is in fact a Clt XXX element linked to a document by an internal event mechanism .

Tip

In the case of screens defined in the definition file, fields are linked to a GenericDocument-type document. In the case of customization forms, fields are linked to a CoreDocument-type process document.

The following table lists the common attributes to every screen:

Attribute Description
name System name for the screen
action System name for the action assigned to the object represented by the screen.
label Translation ID corresponding to the screen title
information Translation ID corresponding to the screen information zone.
provider Provider class associated to the screen

Champs textuels

Champ texte

Champ input texte.

Classe : com.axemble.vdp.ui.core.document.fields.TextBoxField

Stockage : String

Storage table: vdp_string_values

Paramètre Description
size Valeurs possibles : veryshort,short,medium,long,auto
disableautocorrect Booléen, default false; permet de gérer les attributs HTML : autocapitalize, autocorrect, spellcheck
maxlength Nombre de caractères maximum
placeholder Placeholder dans le champ
mask Masque de saisie du champ; pour les syntaxes, voir le plugin : http://igorescobar.github.io/jQuery-Mask-Plugin/
cssclass Classe CSS
value Valeur à déposer dans le champ
formulaValue Valeur à déposer dans le champ (formule)
autoTrim Booléen, default à false; gère un trim sur la saisie.
autocomplete Booléen, default à true; gère l’attribut “autocomplete” HTML.

Example:

<field name="fldTextBox" label="TextBox" ctrl="com.axemble.vdp.ui.core.document.fields.TextBoxField" throw-events="true" /> 
<field name="fldTextBox" label="TextBox" ctrl="com.axemble.vdp.ui.core.document.fields.TextBoxField" mode="read" />

Champ texte multi-lignes

Champ TEXTAREA HTML.

Classe : com.axemble.vdp.ui.core.document.fields.TextAreaField

Stockage : String

Storage table: vdp_string_values

Paramètre Description
width Largeur du champ
rows Nombre de lignes affichées dans le champ

Certains des attributs du champ texte sont également exploitables.

Champ mot de passe

Champ avec saisie cachée.

Classe : com.axemble.vdp.ui.core.document.fields.PasswordField

Stockage : String

Paramètre Description
authentication-class Pour vérifier l’authentification selon le standard Visiativ, nous plaçons ici : com.axemble.vdp.ui.core.document.fields.classes.DefaultAuthentication

Certains des attributs du champ texte sont également exploitables.

Example:

<field name="fldPassword" label="Password" ctrl="com.axemble.vdp.ui.core.document.fields.PasswordField" throw-events="true" /> 
<field name="fldPassword" label="Password" ctrl="com.axemble.vdp.ui.core.document.fields.PasswordField" mode="read" />

Champ texte riche

Champ avec saisie WYSIWYG.

Classe : com.axemble.vdp.ui.core.document.fields.FCKEditorField

Stockage : BLOB; un getValue renvoie donc un byte[]

Storage table: vdp_byte_values

Paramètre Description
width Largeur
height Hauteur
toolbar Nom de la toolbar FCKEditor (cas d’une toolbar personnalisée)
encoding Encoding, default UTF-8
editingAreaBackgroundColor Couleur de fond; default #FFFFFF

Champ URL

Champ d’affichage d’une URL.

Classe : com.axemble.vdp.ui.core.document.fields.EnhancedUrlField

Stockage : String

Storage table: vdp_string_values

Paramètre Description
params Suite de valeurs pour paramétrer le mode d’ouverture du lien : width, height, resizable, scrollbars, status, toolbar
Exemple : 800,600,0,0,0,1
show-url Booléen
show-title Booléen
show-description Booléen
show-params Booléen

Le stockage est en chaîne de caractères avec le format suivant : url¤title¤params¤description

Champ script/xml

Champ “éditeur” permettant une présentation de script/xml avec une coloration syntaxique.

Classe : com.axemble.vdp.ui.core.document.fields.ScriptEditorField

Stockage : String

Paramètre Description
width Largeur
height Hauteur
type Format du texte : javascript,css,htmlmixed,xml

Champ “nom système”

Champ permettant de gérer la saisie de noms systèmes; à l’enregistrement, la saisie de l’utilisateur sera validée par rapport aux contraintes des noms systèmes (caractères spéciaux, espaces, …).

Classe : com.axemble.vdp.ui.core.document.fields.SystemNameField

Stockage : String

Paramètre Description
allowNull Booléen, default false.

Champs numériques

Champ entier

Classe : com.axemble.vdp.ui.core.document.fields.IntegerField

Stockage : Integer

Paramètre Description
min Valeur minimum
max Valeur maximum

Example:

<field name="fldInteger" label="Integer" integer-value="7" ctrl="com.axemble.vdp.ui.core.document.fields.IntegerField" mode="write" throw-events="true" /> 
<field name="fldInteger" label="Integer" ctrl="com.axemble.vdp.ui.core.document.fields.IntegerField" mode="read" />

Champ long

Classe : com.axemble.vdp.ui.core.document.fields.LongField

Stockage : Long

Paramètre Description
min Valeur minimum
max Valeur maximum

Example:

<field name="fldLong" label="Long" long-value="8" ctrl="com.axemble.vdp.ui.core.document.fields.LongField" mode="write" /> 
<field name="fldLong" label="Long" ctrl="com.axemble.vdp.ui.core.document.fields.LongField" mode="read" />

Champ float

Classe : com.axemble.vdp.ui.core.document.fields.FloatField

Stockage : Float

Storage table: vdp_float_values

Paramètre Description
min Valeur minimum
max Valeur maximum
decimals Nombre de decimales

Example:

<field name="fldFloat" label="Float" float-value="9.5" ctrl="com.axemble.vdp.ui.core.document.fields.FloatField" mode="write" /> 
<field name="fldFloat" label="Float" ctrl="com.axemble.vdp.ui.core.document.fields.FloatField" mode="read" />

Champ double

Classe : com.axemble.vdp.ui.core.document.fields.DoubleField

Stockage : Double

Paramètre Description
min Valeur minimum
max Valeur maximum
decimals Nombre de decimales

Example:

<field name="fldDouble" label="Double" double-value="10.5" ctrl="com.axemble.vdp.ui.core.document.fields.DoubleField" mode="write" /> 
<field name="fldDouble" label="Double" ctrl="com.axemble.vdp.ui.core.document.fields.DoubleField" mode="read" />

Champ BigDecimal

Classe : com.axemble.vdp.ui.core.document.fields.BigDecimalField

Stockage : Double

Paramètre Description
min Valeur minimum
max Valeur maximum
decimals Nombre de decimales

Champs dates et périodes

Champ date

Champ avec un simple sélecteur de date.

Classe : com.axemble.vdp.ui.core.document.fields.DateField

Stockage : java.util.Date

Storage type: java.sql.Timestamp

Storage table: vdp_timestamp_values

Paramètre Description
min Valeur minimum; formats des dates : yyyy-MM-dd'T'HH:mm:ss.SSS'Z' ou yyyy-MM-dd
max Valeur maximum; formats des dates : yyyy-MM-dd'T'HH:mm:ss.SSS'Z' ou yyyy-MM-dd
showWeek Booléen
displaydayofweek String; default “mon”; prefix du jour de début de semaine.
numberOfMonths Nombre. default 1. Pour plus d’informations, voir la documentation sur cette option ici
changeMonth Booléen. Pour plus d’informations, voir la documentation sur cette option ici
changeYear Booléen. Pour plus d’informations, voir la documentation sur cette option ici
showOtherMonths Booléen. Pour plus d’informations, voir la documentation sur cette option ici
startSelectionRange
endSelectionRange
autoRoundTripServer Booléen. Default false. Si à true, un aller-retour serveur sera immédiatement déclenché à la modification du champ

Example:

<field name="fldDate" label="Date" ctrl="com.axemble.vdp.ui.core.document.fields.DateField" mode="write" throw-events="true" /> 
<field name="fldDate" label="Date" ctrl="com.axemble.vdp.ui.core.document.fields.DateField" mode="read" />

Champ time

Champ de sélection de temps : heures, minutes.

Classe : com.axemble.vdp.ui.core.document.fields.TimeField

Stockage : java.lang.Long

Storage type: java.lang.Long

Storage table: dp_long_values

Paramètre Description
hour-format String; Valeurs : 12,24
autoRoundTripServer Booléen. Default false. Si à true, un aller-retour serveur sera immédiatement déclenché à la modification du champ

Example:

<field name="fldTime" label="Time" long-value="43200000" hour-format="12" ctrl="com.axemble.vdp.ui.core.document.fields.TimeField" mode="write" /> 
<field name="fldTime" label="Time" ctrl="com.axemble.vdp.ui.core.document.fields.TimeField" mode="read" />

Champ datetime

Champ de sélection d’une date et heure.

Classe : com.axemble.vdp.ui.core.document.fields.DateTimeField

Stockage : java.util.Date

Storage type: java.sql.Timestamp

Storage table: vdp_timestamp_values

Les attributs sont le cumul des attributs des champs date et time.

Example:

<field name="fldDateTime" label="DateTime" ctrl="com.axemble.vdp.ui.core.document.fields.DateTimeField" mode="write" /> 
<field name="fldDateTime" label="DateTime" ctrl="com.axemble.vdp.ui.core.document.fields.DateTimeField" mode="read" />

Champ période (dates)

Champ de sélection d’une période entre deux dates.

Classe : com.axemble.vdp.ui.core.document.fields.PeriodDateField

Stockage : com.axemble.vdoc.sdk.structs.Period

Storage type: com.axemble.vdp.information.structures.Period

Storage table: vdp_period_values

Paramètre Description
displayInline Booléen; default true; affichage en inline
autoRoundTripServer Booléen. Default false. Si à true, un aller-retour serveur sera immédiatement déclenché à la modification du champ

Example:

<field name="fldPeriod" label="LG_PERIOD" ctrl="com.axemble.vdp.ui.core.document.fields.PeriodField" mode="write" /> 
<field name="fldPeriod" label="LG_PERIOD" ctrl="com.axemble.vdp.ui.core.document.fields.PeriodField" mode="read" />

Champ période (times)

Champ de sélection d’une période entre deux temps.

Classe : com.axemble.vdp.ui.core.document.fields.PeriodTimeField

Stockage : com.axemble.vdoc.sdk.structs.Period

Storage type: com.axemble.vdp.information.structures.Period

Storage table: vdp_period_values

Paramètre Description
displayInline Booléen; default true; affichage en inline

Example:

<field name="fldPeriodTime" label="LG_PERIOD" ctrl="com.axemble.vdp.ui.core.document.fields.PeriodTimeField" mode="write" /> 
<field name="fldPeriodTime" label="LG_PERIOD" ctrl="com.axemble.vdp.ui.core.document.fields.PeriodTimeField" mode="read" />

Champ période (dates et times)

Champ de sélection d’une période entre deux dates avec heures.

Classe : com.axemble.vdp.ui.core.document.fields.PeriodDateTimeField

Stockage : com.axemble.vdoc.sdk.structs.Period

Storage type: com.axemble.vdp.information.structures.Period

Storage table: vdp_period_values

Paramètre Description
displayInline Booléen; default true; affichage en inline
autoRoundTripServer Booléen. Default false. Si à true, un aller-retour serveur sera immédiatement déclenché à la modification du champ

Champs listes

Champ liste simple

Champ liste déroulante.

Classe : com.axemble.vdp.ui.core.document.fields.ComboBoxField

Stockage : String

Storage table: vdp_string_values

Paramètre Description
allowreset String; default true; Autorisation de vidage du champ (sélection d’une valeur vide); valeurs possibles : true, false (seulement en création, si le champ est initialement vide), never
emptyValue String; default null; Valeur de stockage pour une valeur vide (note : il s’agit d’une clé de traduction)

Example:

<field name="fldComboBox" label="ComboBox" string-value="A" list="A;B;C;D" ctrl="com.axemble.vdp.ui.core.document.fields.ComboBoxField" mode="write" /> 
<field name="fldComboBox" label="ComboBox" ctrl="com.axemble.vdp.ui.core.document.fields.ComboBoxField" mode="read" />

Champ liste multiple

Champ liste à sélection multiple.

Classe : com.axemble.vdp.ui.core.document.fields.SelectListField

Stockage : Collection<String>

Storage table: vdp_collection_values

Paramètre Description
rows Nombre; default -1; Nombre de lignes affichées dans la liste
minItemsToSelect Nombre; default -1; Nombre de sélections minimum possibles dans la liste
maxItemsToSelect Nombre; default -1; Nombre de sélections maximum possibles dans la liste

Champ case à cocher

Champ présentant une case à cocher.

Classe : com.axemble.vdp.ui.core.document.fields.CheckBoxField

Stockage : java.lang.Boolean

Paramètre Description
additionalLabel String; default null; Libellé à côté de la case à cocher
reversedValue Booleén; default false; inversion du booléen sur le stockage

Example:

<field name="fldCheckBox" label="CheckBox" throw-events="true" boolean-value="true" ctrl="com.axemble.vdp.ui.core.document.fields.CheckBoxField" />

Champ groupe de cases à cocher

Champ présentant un groupe de cases à cocher (équivalent d’une liste multiple, mais présentée sous la forme de cases à cocher).

Classe : com.axemble.vdp.ui.core.document.fields.CheckBoxGroupField

Stockage : Collection<String>

Storage table: vdp_collection_values

Paramètre Description
inverseLabelPosition Booléen; default false : case à cocher à gauche et libellé à droite; Inversion de la position des libellés et des case à cocher
presentationMode String; default vertical; mode de présentation des cases à cocher; valeurs : vertical,horizontal,inline
nbOfColumns Nombre; default 1; si on est en mode horizontal, nombre de colonnes affichés.
allowSelectAll Booléen; default false; affiche un bouton pour tout sélectionner.
allowReset Booléen; default false; affiche un bouton pour réinitialiser la sélection.
summaryMode Booléen; default false; affiche une présentation simplifiée si le champ est en lecture.

Example:

<field name="fldCheckBoxGroup" label="CheckBoxGroup" throw-events="true" string-values="un;trois" list="un;deux;trois;quatre;cinq;six;sept" nbofcolumns="3" fillingmode="vertical" allowreset="true" allowselectall="true" ctrl="com.axemble.vdp.ui.core.document.fields.CheckBoxGroupField" />

Champ groupe de sélection radio

Champ présentant un groupe de bouton radios (équivalent d’une liste simple mais présentée sous la forme de groupe de boutons radios).

Classe : com.axemble.vdp.ui.core.document.fields.RadioGroupField

Stockage : String

Paramètre Description
inverseLabelPosition Booléen; default false : radio à gauche et libellé à droite; Inversion de la position des libellés et des radios
presentationMode String; default vertical; mode de présentation des radios; valeurs : vertical,horizontal,inline
nbOfColumns Nombre; default 1; si on est en mode horizontal, nombre de colonnes affichés.
allowReset Booléen; default false; affiche un bouton pour réinitialiser la sélection.
summaryMode Booléen; default false; affiche une présentation simplifiée si le champ est en lecture.

Example:

<field name="fldRadioGroup" label="RadioGroup" string-value="un" list="un;deux;trois;quatre;cinq;six;sept" nbofcolumns="3" fillingmode="horizontal" ctrl="com.axemble.vdp.ui.core.document.fields.RadioGroupField" />

Champ prédictif simple

Champ liste simple avec saisie par auto-suggestion.

Classe : com.axemble.vdp.ui.core.document.fields.AutocompleteListField

Stockage : String

Paramètre Description
size String; default auto; valeurs possibles : veryshort,short,medium,long,auto
displaySelectionOutside Booléen; default false; permet d’afficher la sélection effectuée en dehors du champ de sélection.
maxDisplayedItems Nombre; default 10; nombre d’éléments maximum affichés sur une saisie prédictive.
allowReset Booléen; default false; affiche un bouton pour réinitialiser la sélection.
cssClass String; classe CSS.

Champ prédictif multiple

Champ liste multiple avec saisie par auto-suggestion.

Classe : com.axemble.vdp.ui.core.document.fields.AutocompleteMultipleListField

Stockage : Collection<String>

Paramètre Description
size String; default auto; valeurs possibles : veryshort,short,medium,long,auto
maxDisplayedItems Nombre; default 10; nombre d’éléments maximum affichés sur une saisie prédictive.
minItemsToSelect Nombre; default -1; nombre de sélections minimum possibles dans la liste.
maxItemsToSelect Nombre; default -1; nombre de sélections maximum possibles dans la liste.
cssClass String; classe CSS.

Champ pièce jointe

Champ d’upload de fichiers multiple.

Classe : com.axemble.vdp.ui.core.document.fields.MultipleFileField

Stockage : Collection<IAttachment>

Storage table: vdp_collection_values

Paramètre Description
min-file-number Nombre; default 0; nombre de fichiers minimum.
max-file-number Nombre; default Integer.MAX_VALUE; nombre de fichiers maximum.
min-file-size Nombre; default 0; taille minimum des fichiers uploadés.
max-file-size Nombre; default configuration dans les options d’administration; taille maximum des fichiers uploadés
min-total-size Nombre; default 0; taille minimum globale à tous les fichiers.
max-total-size Nombre; default Long.MAX_VALUE; taille maximum globale à tous les fichiers.
max-file-name-length Nombre; default 250; taille maximum en nombre de caractères dans les noms de fichiers.
forbidden-extensions String; default configuration dans les options d’administration; extensions interdites séparées par des “;”

Example:

<field name="fldFiles" label="MultipleFile" value="files" ctrl="com.axemble.vdp.ui.core.document.fields.MultipleFileField" mandatory="true" max-file-number="1" supported-extensions="*" />

Champs annuaire

Note

Les champs ci-dessous n’ont plus vocation à être utilisés et devraient être remplacés par des selecteurs d’annuaire.

Champ annuaire simple

Champ de sélection simple d’un objet de l’annuaire : user, group, organization, localization.

Classe : com.axemble.vdp.ui.core.document.fields.SingleDirectoryField

Stockage : IUser, IOrganization, ILocalization, IGroup

Storage table: vdp_directory_element_values

Paramètre Description
type String; valeurs possibles : user,group,organization,localization
ordered Booléen; default false; Les valeurs du sélecteur doivent elle être triées ?
minItemsToSelect Nombre; default -1; nombre de sélections minimum possibles dans la liste.
maxItemsToSelect Nombre; default -1; nombre de sélections maximum possibles dans la liste.
maxFilteredItems Nombre; default 10; nombre de filtres maximum.
size String; default medium; valeurs possibles : veryshort,short,medium,long,auto
maxDisplayedItems Nombre; default 10; nombre d’éléments maximum affichés sur une saisie prédictive.
maxDisplayedSelectedItems Nombre; default 5; nombre d’éléments sélectionnés directement affichés.
displaySelectionOutside Booléen; default false; permet d’afficher la sélection effectuée en dehors du champ de sélection.
showSelectedItemsDetailedView Booléen; default false; permet d’afficher une vue plus détaillée des éléments sélectionnés.
quick-create String; default null; référence d’un écran Process permettant d’accéder directement à une création d’élément : class.method
cssClass String; classe CSS.

Example:

<field name="fldDirectory" label="SingleDirectoryGroup" type="group" ctrl="com.axemble.vdp.ui.core.document.fields.SingleDirectoryField" /> 
<field name="fldFilecenter" label="SingleFilecenter" type="filecenter" ctrl="com.axemble.vdp.ui.core.document.fields.SingleDirectoryField" />

Champ annuaire multiple

Champ de sélection simple d’un objet de l’annuaire : user, group, organization, localization.

Classe : com.axemble.vdp.ui.core.document.fields.MultipleDirectoryField

Stockage : Collection<IUser>, Collection<IOrganization>, Collection<ILocalization>, Collection<IGroup>

Storage table: vdp_collection_values

Mêmes attributs que le champ sélecteur d’annuaire simple.

Example:

<field name="fldDirectories" label="MultipleDirectoryUser" type="user" ctrl="com.axemble.vdp.ui.core.document.fields.MultipleDirectoryField" />

Champs sélecteurs

Champ sélecteur générique

Champ générique sélecteur permettant de naviguer vers un écran sélecteur (sélecteur ou vue).

Classe : com.axemble.vdp.ui.core.document.fields.SelectorField

Stockage : dépend des keys des ViewModelItems de la vue du sélecteur.

Storage table: vdp_string_values or vdp_collection_values

Paramètre Description
screen String; Nom de l’écran : nommé dans Process “screen” ou “class”
method String; Méthode de l’écran
multiple Booléen; default false; sélecteur simple ou multiple.

Champ sélecteur de ressources

Champ sélecteur de ressources des réservoirs de données.

Classe : com.axemble.vdp.ui.core.document.fields.ResourceSelectorField

Stockage : IStorageResource, Collection<IStorageResource>

Paramètre Description
view String; Protocol URI de la vue de la table de réservoir à utiliser comme sélecteur.
label String; Colonne de la vue utilisée comme libellé de sélection.
allowcreate Booléen; default false; Permettre la création d’une nouvelle ressource directement.
multiple Booléen; default false; sélecteur simple ou multiple.

Champ sélecteur de documents de processus

Pas de classe dédiée, mais possibilité d’utiliser les mêmes syntaxes que le champ sélecteur de ressources.

Champ sélecteur d’espaces documentaires

Champ sélecteur d’espaces documentaires

Classe : com.axemble.vdp.ui.core.document.fields.SelectorField

Stockage : String, Collection<String> (cocher “référence un objet”)

Paramètre Description
screen String; saisir dans ce cas “filecenterNode”
method String; saisir dans ce cas “select”
selectable String; saisir dans ce cas “Datastore”
multiple Booléen; default false; sélecteur simple ou multiple.

Champ sélecteur de dossiers Filecenter

Champ sélecteur de dossiers Filecenter.

Classe : com.axemble.vdp.ui.core.document.fields.SelectorField

Stockage : String, Collection<String> (cocher “référence un objet”)

Paramètre Description
screen String; saisir dans ce cas “filecenterNode”
method String; saisir dans ce cas “select”
selectable String; saisir dans ce cas “Folder”
multiple Booléen; default false; sélecteur simple ou multiple.

Champ sélecteur de documents Filecenter

Champ sélecteur de documents Filecenter.

Classe : com.axemble.vdp.ui.core.document.fields.SelectorField

Stockage : String, Collection<String> (cocher “référence un objet”)

Paramètre Description
screen String; saisir dans ce cas “filecenterNode”
method String; saisir dans ce cas “select”
selectable String; saisir dans ce cas “Document”
multiple Booléen; default false; sélecteur simple ou multiple.

Champ sélecteur de catégories Filecenter

Champ sélecteur de catégories Filecenter.

Classe : com.axemble.vdp.ui.core.document.fields.SelectorField

Stockage : String, Collection<String> (cocher “référence un objet”)

Paramètre Description
screen String; saisir dans ce cas “filecenterNode”
method String; saisir dans ce cas “select”
selectable String; saisir dans ce cas “Category”
multiple Booléen; default false; sélecteur simple ou multiple.

Champ sélecteur d’utilisateurs ou groupes

Champ sélecteur d’utilisateurs ou groupes de l’annuaire.

Classe : com.axemble.vdp.ui.core.document.fields.SelectorField

Paramètre Description
screen String; saisir dans ce cas “Property”
method String; saisir dans ce cas “select”
elementType String; saisir dans ce cas “user” ou “group”
multiple Booléen; default false; sélecteur simple ou multiple.

Champ sélecteur d’organisation

Champ sélecteur d’organisation de l’annuaire.

Classe : com.axemble.vdp.ui.core.document.fields.SelectorField

Paramètre Description
screen String; saisir dans ce cas “directory”
method String; saisir dans ce cas “select”
type String; saisir dans ce cas “IOrganization”
multiple Booléen; default false; sélecteur simple ou multiple.

Champ ColorPicker

Champ de sélection d’une couleur.

Classe : com.axemble.vdp.ui.core.document.fields.ColorPickerField

Stockage : String

Pas d’attributs sur ce champ.

Champs tableaux

Champ tableau de ressource

Champ dédié aux processus, ne peut pas être utilisé en dehors de ce contexte. Représente un champ tableau dynamique.

Classe : com.axemble.vdp.ui.core.document.fields.ResourceTableField

Stockage : Collection<ILinkedResource>

Paramètre Description
linemin Nombre; default 0; nombre de lignes minimum.
linemax Nombre; default Integer.MAX_VALUE; nombre de lignes maximum.
allowcreate Booléen; default true si éditable; permettre la création d’une nouvelle ligne.
allowremove Booléen; default true si éditable; permettre la suppression d’une ligne.
allowedit Booléen; default true si éditable; permettre l’édition d’une ligne.
allowread Booléen; default true; permettre de lire une ligne.
filterable Booléen; default true; activation des filtres sur la vue.
exportable Booléen; default true; activation de l’export Excel sur la vue.
elementsperpage Nombre; default 50; nombre d’éléments par page par défaut.

Champ tableau de sous-processus

Champ dédié aux processus, ne peut pas être utilisé en dehors de ce contexte. Représente un champ tableau de documents de sous-processus.

Classe : com.axemble.vdp.ui.core.document.fields.TreatmentTableField

Stockage : Collection<IWorkflowInstance>

Même attributs que le champ tableau de ressources.

Champ ScreenEmbedder

Enables to embed new screens

Class: Com.axemble.vdp.ui.core.document.fields.ScreenEmbedderField

Shortcut: screen_embedder

Java type: java.util.Map

Storage table: vdp_byte_values

Example:

<field name="fldEmbedder" label="fldEmbedder" ctrl="com.axemble.vdp.ui.core.document.fields.ScreenEmbedderField" mode="write" screen="jsp_selector" method="select" />

Composants graphiques

Widgets

Widget

Classe générique, mère de tous les widgets : tous les widgets héritent de cette classe.

Classe : com.axemble.vdp.ui.framework.widgets.Widget

Paramètre Description
addActionListener() Ajout d’un nouvel ActionListener
removeActionListener Suppression d’un ActionListener
isHidden()/setHidden() Gestion de la visibilité du widget
getParam()/setParam() Gestion du param du widget; pour rappel le param est un “objet métier” qui peut être déposé dans le widget et le suivre toute sa vie.
buildFireMessage() Construction d’un script JS d’envoi de message Ajax Process (nécessaire aux listeners)
getJavascriptId() Récupération de l’ID Javascript du widget
focus() Affecter le focus sur ce widget

CtlInputWidget

Classe générique pour tous les widgets avec une input de l’utilisateur.

Classe : com.axemble.vdp.ui.framework.widgets.CtlInputWidget

Héritage : com.axemble.vdp.ui.framework.foundation.Widget

Paramètre Description
isEditable()/setEditable() Gestion du caractère éditable.
addValidationRule()/clearValidationRules()/ hasValidationRules()/getValidationRules() Gestion des validators.
isMandatory()/setMandatory() Gestion du caractère obligatoire
setThrowEvents()/canThrowEventsInWebBrowser() Gestion des allers-retours serveur
getTabIndex()/setTabIndex() Gestion du tabindex HTML
getAccessKey()/setAccessKey() Gestion de l’accesskey HTML
inform() Affichage d’un message d’info sur le widget
setErrorInfo() Définition du message d’erreur en cas de souci de validation du widget.
isEmpty() Quand le widget peut-il être considéré comme vide
getDescription()/setDescription()/isDescription() Gestion de la description
focus()/isFocus() Gestion du focus.
getAssociatedLabel()/setAssociatedLabel() Gestion du libellé de widget associé (CtlText).

Boutons et liens

Bouton

Classe : com.axemble.vdp.ui.framework.widgets.CtlButton

Héritage : com.axemble.vdp.ui.framework.foundation.CtlAbstractAction

Paramètre Description
setCustomRenderer() Permet de définir un IRenderer pour le traitement du bouton
getMode()/setMode() default CtlButton.MODE_NORMAL; Permet de définir le mode du bouton parmi : CtlButton.MODE_NORMAL, CtlButton.MODE_DEFAULT (se lance automatiquement sur la touche entrée + skin mise en avant), CtlButton.MODE_DISABLED (skin dédiée)
getStyle()/setStyle() default CtlButton.STYLE_1; trois styles de boutons parmi : CtlButton.STYLE_1, CtlButton.STYLE_2, CtlButton.STYLE_3
getUrl()/setUrl() Définition de l’URL du bouton
getTarget()/setTarget() Définition de la target HTML
getOnclick()/setOnclick() Définition du javascript sur “onclick”
isDisabled()/setDisabled() Gestion de l’activation du widget
getAdditionnalCssStyle()/setAdditionnalCssStyle()/addAdditionnalCssStyle()

Example using ActionListener:

CtlButton demoAlertBtn = new CtlButton( "alert", new CtlLocalizedText( "LG_ALERT" ) ); 
demoAlertBtn.addActionListener( new ActionListener()  { 
	public void onClick( ActionEvent event ) {
		Navigator.getNavigator().showAlertBox("Message Alert !"); 
	} 
} ); 
getResourceController().getButtonContainer( IResourceController.TOP_CONTAINER ).addLast( demoAlertBtn );

Example using ConfirmBoxListener:

CtlButton demoConfirmBtn = new CtlButton( "confirm", new CtlLocalizedText( "LG_CONFIRM" ) ); 
button.addActionListener( new ActionListener() { 
	public void onClick( ActionEvent event ) { 
		Navigator.getNavigator().showConfirmBox( "Message Confirm !", new ConfirmBoxListener() {
			public void onCancel( ActionEvent event ) {
				Navigator.getNavigator().showAlertBox( "onCancel()" ); 
			} 
			public void onOk( ActionEvent event ) {
				Navigator.getNavigator().showAlertBox( "onOk()" ); 
			}; 
		} ); 
	} 
} ); 
getResourceController().getButtonContainer( IResourceController.TOP_CONTAINER ).addLast( demoConfirmBtn )

Bouton pour navigation

Ce type de bouton est dédié à une navigation vers un écran Process, via un NavigateContext.

Classe : com.axemble.vdp.ui.framework.widgets.CtlNavigationButton

Héritage : com.axemble.vdp.ui.framework.widgets.CtlButton

Paramètre Description
getClassName()/setClassName() Gestion de la classe de l’écran vers lequel on navigue
getMethodName()/setMethodName Gestion de la méthode de l’écran vers lequel on navigue
getObjectName()/setObjectName() Gestion du nom d’objet de l’écran vers lequel on navigue
getParameter…()/setParameter…() Gestion des paramètres de navigation
getContext() Récupération du NavigateContext construit par les méthodes préalables

Lien hypertexte

Classe : com.axemble.vdp.ui.framework.widgets.CtlHyperLink

Héritage : com.axemble.vdp.ui.framework.widgets.CtlAbstractAction

Paramètre Description
isActive()/setActive() Lien actif ou non
getUrl()/setUrl() Définition de l’URL
getTitle()/setTitle() Définition du title du lien
getTarget()/setTarget() Définition de la target HTML
getRel()/setRel() Définition du rel HTML du lien
getRev()/setRev() Définition du rev HTML du lien
isInnerSpan()/setInnerSpan() Présence d’un span sous le lien

Lien hypertexte pour navigation

Classe : com.axemble.vdp.ui.framework.widgets.CtlHyperLink

Héritage : com.axemble.vdp.ui.framework.widgets.CtlNavigationHyperLink

Mêmes méthodes que pour le widget CtlNavigationButton.

Contrôles textuels

Libellé

Classe : com.axemble.vdp.ui.framework.widgets.CtlText

Héritage : com.axemble.vdp.ui.framework.widgets.Widget

Paramètre Description
getText()/setText() Définition du texte du label
isStrong()/setStrong() Passage du texte en strong

Libellé traduit

Ici le libellé est traduit, une clé de traduction est fournie.

Classe : com.axemble.vdp.ui.framework.widgets.CtlLocalizedText

Héritage : com.axemble.vdp.ui.framework.widgets.CtlText

Mêmes méthodes que le widget CtlText

Texte avec une icône devant

Icône avec un libellé à côté.

Classe : com.axemble.vdp.ui.framework.widgets.CtlIconText

Héritage : com.axemble.vdp.ui.framework.widgets.CtlText

Paramètre Description
getIcon()/setIcon() Définition de l’URL de l’icône.

Mandatory text

Managing compulsory elements.

Classe : com.axemble.vdp.ui.framework.widgets.CtlMandatoryText

Héritage : com.axemble.vdp.ui.framework.widgets.CtlLocalizedText

Mêmes méthodes que le widget CtlLocalizedText.

Text box

Enabling text input.

Classe : com.axemble.vdp.ui.framework.widgets.CtlTextBox

Héritage : com.axemble.vdp.ui.framework.widgets.CtlInputWidgetComponent

Text area

Enabling text input

Classe : com.axemble.vdp.ui.framework.widgets.CtlTextArea

Héritage : com.axemble.vdp.ui.framework.widgets.CtlTextBox

Nombres

Managing number elements.

Classe : com.axemble.vdp.ui.framework.widgets.CtlNumber

Héritage : com.axemble.vdp.ui.framework.widgets.CtlTextBox

Date et période

Date

Managing Date elements.

Classe : com.axemble.vdp.ui.framework.widgets.CtlDate

Héritage : com.axemble.vdp.ui.framework.widgets.CtlInputWidgetComponent

Date with time

Managing DateTime elements.

Classe : com.axemble.vdp.ui.framework.widgets.CtlDateTime

Héritage : com.axemble.vdp.ui.framework.widgets.CtlDate

Period

Managing period elements.

Classe : com.axemble.vdp.ui.framework.widgets.CtlPeriodDate

Héritage : com.axemble.vdp.ui.framework.widgets.CtlInputWidgetComponent

Period with time

Managing period with time elements.

Classe : com.axemble.vdp.ui.framework.widgets.CtlPeriodDateTime

Héritage : com.axemble.vdp.ui.framework.widgets.CtlPeriodDate

Images

Image

Affichage simple d’une image.

Classe : com.axemble.vdp.ui.framework.widgets.CtlImage

Héritage : com.axemble.vdp.ui.framework.widgets.Widget

Paramètre Description
setPath()/setUrl()/getUrl() Définition de l’URL de l’image (relative ou absolue)

Image indicatrice d’état

Affichage d’une image indicatrice d’état : pastille de couleur : rouge, vert, gris, orange.

Classe : com.axemble.vdp.ui.framework.widgets.CtlImageState

Héritage : com.axemble.vdp.ui.framework.widgets.Widget

Paramètre Description
setState()/setStateFromBoolean() Les états peuvent être : CtlImageState.STATE_OFF, CtlImageState.STATE_ON, CtlImageState.STATE_UNDEFINED, CtlImageState.STATE_MIDDLE

Image cliquable

Classe : com.axemble.vdp.ui.framework.widgets.CtlImageButton

Héritage : com.axemble.vdp.ui.framework.widgets.CtlAbstractAction

Paramètre Description
getImageByActionName() Permet de générer l’URL relative vers une icone d’action de la skin; exemple “edit”, “delete”, …
getTarget()/setTarget() Définition de la target HTML
setImage()/setImageUrl() Définition du chemin vers l’image (relative ou absolue)
setCustomRenderer() Permet de définir un IRenderer pour le traitement du bouton
getUrl()/setUrl() Définition de l’URL du bouton
getTitle()/setTitle() Définition du title de l’image
getCssImageClass()/setCssImageClass() Définition d’une classe CSS sur l’image du bouton
getRel()/setRel() Définition du rel HTML du lien
getOnclick()/setOnclick() Définition du javascript sur “onclick”

Image cliquable pour navigation

Classe : com.axemble.vdp.ui.framework.widgets.CtlNavigationImageButton

Héritage : com.axemble.vdp.ui.framework.widgets.CtlImageButton

Mêmes méthodes que pour le widget CtlNavigationButton.

Lists

CheckBox

Classe : com.axemble.vdp.ui.framework.widgets.CtlCheckBox

Héritage : com.axemble.vdp.ui.framework.widgets.CtlInputWidgetComponent

CheckBox group

Classe : com.axemble.vdp.ui.framework.widgets.CtlCheckBoxGroup

Héritage : com.axemble.vdp.ui.framework.widgets.list.CtlAbstractListMultipleSelectionComponent

ComboBox

Classe : com.axemble.vdp.ui.framework.widgets.CtlComboBox

Héritage : com.axemble.vdp.ui.framework.widgets.list.CtlAbstractListSingleSelectionComponent

Example:

CtlComboBox selectList = new CtlComboBox(); 
selectList.addOption( new Option( "key1" ,getStaticString( "LG_VALUE1" ) ) ); 
selectList.addOption( new Option( "key2", getStaticString( "LG_VALUE2" ) ) ); 
selectList.setSelectedKey( "key1" );

Selective list

Classe : com.axemble.vdp.ui.framework.widgets.CtlSelectList

Héritage : com.axemble.vdp.ui.framework.widgets.list.CtlAbstractListMultipleSelectionComponent

Radio group

Classe : com.axemble.vdp.ui.framework.widgets.CtlRadioGroup``

Héritage : com.axemble.vdp.ui.framework.widgets.list.CtlAbstractListSingleSelectionComponent

List view

Classe : com.axemble.vdp.ui.framework.widgets.CtlListView

Héritage : com.axemble.vdp.ui.framework.widgets.CtlInputWidget

Example:

// add a table CtlListView listView = new CtlListView(); 
// create the table columns 
listView.createColumn("col1",new CtlLocalizedText("LG_COL1")); listView.createColumn("col2",new CtlLocalizedText("LG_COL2") ); 
// create table elements 
CtlListView.Item item = listView.createItem(new CtlText("1") ); item.setParam( "key1" ); 
listView.createSubitem( new CtlText( "A" ), item ); item = listView.createItem( new CtlText( "2" ) ); item.setParam( "key2" ); 
listView.createSubitem( new CtlText( "B" ), item );

Container et inclusion

Container

Container permettant de structurer des widgets. Un container peut avoir un layout et on peut ensuite y déposer des widgets. On peut évidemment déposer un container dans un container.

Classe : com.axemble.vdp.ui.framework.runtime.Container

Héritage : com.axemble.vdp.ui.framework.widgets.Widget

Paramètre Description
add()/add…()/remove()/clear()/getWidgets() Gestion des widgets dans le container
getLayout()/setLayout() Gestion du layout du container

Example:

CtlText text = new CtlLocalizedText( "LG_TEXTE" );
// create the container 
Container container = new Container(new FreeLayout()); 
// add text 
container.add( text ); 
// add a list 
container.add( selectList );  
// add a view 
container.add( listView );
Layouts des containers

Des layouts existant sont mis à disposition. Il est possible de développer ses propres layouts en héritant de com.axemble.vdp.ui.framework.foundation.layouts.AbstractLayout.

Layout Description
com.axemble.vdp.ui.framework.foundation.layouts.FreeLayout Layout neutre, pas de rendu HTML particulier
com.axemble.vdp.ui.framework.foundation.layouts.HorizontalLayout Layout horizontal : utilise des tableaux
com.axemble.vdp.ui.framework.foundation.layouts.VerticalLayout Layout vertical : utilise des tableaux
com.axemble.vdp.ui.framework.foundation.layouts.SpanLayout Layout span : place des spans autour de chaque widget
com.axemble.vdp.ui.framework.foundation.layouts.ListLayout Layout UL/LI; une méthode setCssClass permet de définir une classe CSS sur la UL
com.axemble.vdp.ui.framework.foundation.layouts.OrderedListLayout Layout OL/LI; une méthode setCssClass permet de définir une classe CSS sur la OL

Element HTML

Permet de render une élément HTML.

Classe : com.axemble.vdp.ui.framework.widgets.CtlHtmlTag

Héritage : com.axemble.vdp.ui.framework.widgets.Widget

A la construction, on définit le name de l’élément HTML et le widget qui sera déposé à l’intérieur.

IFrame

Permet de déclarer une IFrame.

Classe : com.axemble.vdp.ui.framework.widgets.CtlIFrame

Héritage : com.axemble.vdp.ui.framework.widgets.Widget

Paramètre Description
getStyle()/setStyle() Classe CSS sur l’IFrame
getUrl()/setUrl() Définition de l’URL de l’IFrame

Include (via JSP)

Permet une inclusion du contenu HTML d’une URL via JSP.

Classe : com.axemble.vdp.ui.framework.widgets.CtlInclude

Héritage : com.axemble.vdp.ui.framework.widgets.Widget

A la création du widget, on définit l’URL concernée.

Permet de déclarer un menu déroulant. Le menu peut intégrer CtlPopupMenuItem. Dans chaque item, il est possible de définir des sous-items.

Classe : com.axemble.vdp.ui.framework.widgets.CtlPopupMenu

Paramètre Description
addItem()/getItems() Permet d’ajouter un nouveau CtlPopupMenuItem qui aura été construit préalablement
addSeparator() Permet d’ajouter un séparateur dans le menu
CtlPopupMenuItem

Ce widget est contenu dans un menu déroulant Il hérite des CtlHyperLink et donc de toutes leurs méthodes.

Classe : com.axemble.vdp.ui.framework.writers.CtlPopupMenuItem

Héritage : com.axemble.vdp.ui.framework.widgets.CtlHyperLink

Paramètre Description
addStyle()/getStyle()/setStyle() Permet de déposer une classe CSS sur l’entrée de menu
addSubItem()/getSubItems() Permet de gérer les sous-items

Section

Classe : com.axemble.vdp.ui.framework.widgets.CtlSection

Sous-section

Classe : com.axemble.vdp.ui.framework.widgets.CtlSubSection

Autre

Barre de progression

Ce widget présente une simple barre de progression

Classe : com.axemble.vdp.ui.framework.widgets.CtlBar

Héritage : com.axemble.vdp.ui.framework.widgets.Widget

Paramètre Description
getPercentage()/setPercentage() Définition du pourcentage courant dans la barre
getText()/setText() Définition du texte de description de la barre

Captcha

Ce widget permet de représenter un captcha pour validation.

Classe : com.axemble.vdp.ui.framework.widgets.CtlCaptcha

Héritage : com.axemble.vdp.ui.framework.widgets.CtlInputWidget

Paramètre Description
validate() Lance la validation du widget
isValidated() Le captcha est-il validé ?
refresh() Lance une regénération de l’image du captcha

Composant arbre

Ce widget permet de présenter un arbre avec possibilité de présentation d’icônes et de sélection sur les noeuds.

Classe : com.axemble.vdp.ui.framework.widgets.CtlTreeView

Héritage : com.axemble.vdp.ui.framework.widgets.Widget

Paramètre Description
add()/clear()/iterator()/size() Gestion des sous-entries
getSelectedEntries() Récupération des TreeEntry sélectionnées dans l’arbre
addSelectedEntries() Gestion des selected entries
getSelectedEntry(entry) Récupération de la première sous-entry sélectionnée
recursiveSelectChildren() Permet de sélectionner une entry récursivement : cette entry et tous les enfants
recursiveSelectParent() Permet de sélectionner une entry récursivement : cette entry et tous les parents
getTotalSize() Récupération de la taille totale de l’arbre

TreeEntry

Ce widget représente un noeud dans notre arbre.

Paramètre Description
getState()/setState() Définition de l’état du noeud parmi : TreeEntry.COLLAPSED, TreeEntry.EXPANDED, TreeEntry.NOTEXPANDABLE
getParent()/setParent() Définition du noeud parent
getLabel()/setLabel() Définition du libellé du noeud
getParam()/setParam() Gestion du param du widget; pour rappel le param est un “objet métier” qui peut être déposé dans le widget et le suivre toute sa vie
isSelected()/setSelected() Le noeud est-il sélectionné ou non ?
add()/clear()/iterator()/size() Gestion des sous-entries

Source : https://wiki.myvdoc.net/xwiki/bin/view/Dev+Floor/ReferenceWidgets