Widget Collection (thématisable)
Le widget Collection est un widget dynamique qui vous permet d'afficher une série d'applications composites répétées en tant que cellules au sein d'une collection. Vous pouvez configurer des mises en page avancées et des cellules de groupe pour faciliter l'affichage de la collection sur les différentes tailles d'écran des utilisateurs. Pour afficher des données dans les cellules d'une collection, vous devez définir une table d'informations contenant les données des cellules de l'application composite. Vous pouvez également configurer le comportement de chargement des données afin d'optimiser les performances lors du chargement de grands ensembles.
 |
Ce widget est également disponible en tant que composant Web dans le kit de développement Web Component SDK.
|
Bonnes pratiques
Evitez d'exécuter des services dans chaque cellule de la collection. L'exécution répétée de plusieurs services pour chaque cellule d'une collection génère un nombre important de requêtes réseau. Tous les services de l'application composite de collection sont exécutés de manière répétée lors de l'initialisation de l'application composite parente, ce qui peut entraîner d'importants problèmes de performances à mesure que chaque cellule est chargée. Pour éviter les problèmes de performances, exécutez les services de données sur l'application composite parente, puis transmettez les données aux applications composites contenues à l'aide des paramètres d'application composite et de la propriété MashupPropertyBinding. Pour plus d'informations sur l'utilisation des paramètres, consultez la rubrique Configuration des paramètres d'application composite.
Propriétés
|
Nom de propriété
|
Description
|
Type de base
|
Valeur par défaut
|
Liable
|
Localisable ? (O/N)
|
|---|---|---|---|---|---|
|
Data
|
Source de données de la table d'informations pour le widget Collection.
|
INFOTABLE
|
O
|
N
|
|
|
ItemLoadBehavior
|
Contrôle le comportement de chargement des données de la collection. Vous pouvez charger et décharger les données à mesure que l'utilisateur fait défiler les pages, charger progressivement les données à la demande ou charger initialement l'ensemble des données.
|
STRING
|
Charger/Décharger
|
N
|
N
|
|
Layout
|
Spécifie le type de mise en page à utiliser pour les cellules de la collection. Options : Flexible, Grille, Table.
|
STRING
|
Flexible
|
O
|
N
|
|
Mashup
|
Application composite à utiliser pour afficher les données de la collection.
|
MASHUPNAME
|
O
|
N
|
|
|
Width
|
Définit la largeur du widget.
|
NUMBER
|
400
|
N
|
N
|
|
Height
|
Définit la hauteur du widget.
|
NUMBER
|
300
|
N
|
N
|
|
MashupHeight
|
Définit la hauteur de l'application composite de la collection.
|
NUMBER
|
O
|
N
|
|
|
MashupWidth
|
Définit la largeur de l'application composite de la collection.
|
NUMBER
|
O
|
N
|
|
|
MashupWidthField
|
Spécifie le champ de table d'informations pour définir la largeur de cellule à l'aide d'un service. Les valeurs remplacent MashupHeight.
|
Colonne de table d'informations
|
N
|
N
|
|
|
MashupHeightField
|
Spécifie le champ de table d'informations pour définir la hauteur de cellule à l'aide d'un service. Les valeurs remplacent MashupHeight.
|
Colonne de table d'informations
|
N
|
N
|
|
|
UIDField
|
Obligatoire. Spécifie le champ de table d'informations avec l'identificateur unique de chaque cellule.
|
Colonne de table d'informations
|
N
|
N
|
|
|
LastRowAlignment
|
Contrôle l'alignement des cellules dans la dernière ligne de la collection. Options : Par défaut, Espacer uniformément, Espacer entre, A gauche, Au centre, A droite, Etirer
|
STRING
|
Par défaut
|
N
|
N
|
|
HorizontalAlignment
|
Contrôle l'alignement horizontal des cellules dans les lignes de la collection. Options : Espacer uniformément, Espacer entre, A gauche, Au centre, A droite, Etirer
|
STRING
|
Espacer uniformément
|
N
|
N
|
|
VerticalAlignment
|
Contrôle l'alignement vertical des cellules sur les lignes de la collection. Options : En haut, Au centre, Etirer, En bas
|
STRING
|
Au centre
|
N
|
N
|
|
UniformRowHeight
|
Affiche les lignes en utilisant la même hauteur.
|
BOOLEAN
|
Faux
|
N
|
N
|
|
RowGap
|
Définit l'espacement entre les lignes de la collection.
|
NUMBER
|
40
|
N
|
N
|
|
ColumnGap
|
Définit l'espacement entre les colonnes de la collection.
|
NUMBER
|
40
|
N
|
N
|
|
SectionGap
|
Définit l'espacement entre les sections de la collection.
|
NUMBER
|
48
|
N
|
N
|
|
TopPadding
|
Définit le remplissage entre la marge supérieure de la collection et la première cellule.
|
NUMBER
|
24
|
N
|
N
|
|
BottomPadding
|
Définit le remplissage entre la marge inférieure de la collection et la dernière cellule.
|
NUMBER
|
24
|
N
|
N
|
|
RightPadding
|
Définit le remplissage entre la bordure droite du widget et la collection de cellules.
|
NUMBER
|
24
|
N
|
N
|
|
LeftPadding
|
Définit le remplissage entre la bordure gauche du widget et la collection de cellules.
|
NUMBER
|
0
|
N
|
N
|
|
MashupBackground
|
Contrôle l'arrière-plan de l'application composite de la collection et de tous ses conteneurs. Lorsque l'arrière-plan de l'application composite est transparent, les styles appliqués à l'arrière-plan des cellules sont visibles. Options : Transparent, Visible
|
STRING
|
Visible
|
N
|
N
|
|
MashupNameField
|
Permet de spécifier un champ de table d'informations pour fournir le nom de l'application composite à l'aide d'un service de données. Cette propriété remplace la propriété Mashup.
|
Colonne de table d'informations
|
N
|
N
|
|
|
MashupPropertyBinding
|
Objet JSON sérialisé dont les clés sont des champs de table d'informations et les valeurs des paramètres d'application composite. Par ex. : {\"min_temp\":\"minTemp\"}
|
JSON
|
N
|
N
|
|
|
MashupGlobalPropertyBinding
|
Objet JSON sérialisé dont les clés sont des noms de paramètres globaux et les valeurs des types de données. Il s'agit des propriétés qui peuvent être liées au widget Collection et qui sont envoyées à chaque application composite des cellules. {\"minTemp\":\"STRING\"}
|
JSON
|
N
|
N
|
|
|
SelectedCellMashupField
|
Permet de spécifier un champ de table d'informations pour définir l'état sélectionné de chaque cellule de la collection.
|
Colonne de table d'informations
|
N
|
N
|
|
|
UseMashupDimensions
|
Calque la taille des cellules sur les dimensions de l'application composite.
|
BOOLEAN
|
Faux
|
N
|
N
|
|
SelectionMode
|
Permet de contrôler le nombre de cellules que les utilisateurs peuvent sélectionner lors de l'exécution. Options : Aucune, Une seule, Plusieurs
|
STRING
|
Aucun
|
N
|
N
|
|
HasSelectedCells
|
Renvoie la valeur Vrai lorsque le widget a des cellules sélectionnées.
|
BOOLEAN
|
Faux
|
O
|
N
|
|
SelectedCellsCount
|
Renvoie le nombre de cellules sélectionnées dans la collection.
|
NUMBER
|
0
|
N
|
N
|
|
ScrollToSelectedCell
|
Fait défiler automatiquement les cellules lors de leur sélection.
|
BOOLEAN
|
Faux
|
N
|
N
|
|
AutoSelectFirstRow
|
Permet de sélectionner automatiquement la première ligne lors du chargement des données dans la collection.
|
BOOLEAN
|
Faux
|
N
|
N
|
|
SelectedCells
|
Spécifie les cellules de la collection à sélectionner à l'aide d'une table d'informations.
|
INFOTABLE
|
O
|
N
|
|
|
SelectedCellMashup
|
Spécifie une application alternative pour afficher les cellules sélectionnées dans la collection. Cette application composite doit contenir les mêmes propriétés que l'application composite par défaut.
|
Sélecteur d'application composite
|
O
|
N
|
|
|
HandleSelectionUpdates
|
Lorsque cette propriété est activée, le widget envoie et reçoit des mises à jour de sélection vers et depuis son service de données.
|
BOOLEAN
|
Vrai
|
N
|
N
|
|
CellMenu
|
Spécifie la définition de l'état utilisée pour définir le menu de cellule qui apparaît en passant le doigt sur les cellules sur des appareils tactiles. Sur des appareils sans interface tactile, ce menu s'affiche à l'aide d'un clic droit dans la cellule.
|
STATEDEFINITION
|
N
|
N
|
|
|
CellMenuIconSize
|
Spécifie la taille des icônes dans le menu de la cellule.
|
NUMBER
|
20
|
N
|
N
|
|
CellTabKeyScope
|
Contrôle l'étendue de la navigation lors des interactions avec le contenu d'une cellule à l'aide du clavier. Options : Cellule, Collection. Lorsque l'étendue est définie sur Cellule, l'utilisation de la touche TAB permet de parcourir tour à tour les éléments de la cellule. Lorsque l'étendue est définie sur Collection, l'utilisation de la touche TAB renvoie le focus sur la cellule une fois le dernier élément sélectionné.
|
STRING
|
Cellule
|
N
|
N
|
|
SectionField
|
Spécifie le champ de table d'informations avec les valeurs de l'identificateur que vous pouvez utiliser pour grouper les cellules au sein des sections.
|
INFOTABLE
|
N
|
N
|
|
|
SectionInsetLeft
|
Définit la valeur de l'incrustation de gauche des sections lors du groupement de cellules.
|
NUMBER
|
0
|
N
|
N
|
|
SectionInsetTop
|
Définit la valeur de l'incrustation supérieure des sections lors du groupement de cellules.
|
NUMBER
|
0
|
N
|
N
|
|
SectionInsetRight
|
Définit la valeur d'incrustation de droite des sections lors du groupement de cellules.
|
NUMBER
|
0
|
N
|
N
|
|
SectionInsetBottom
|
Définit la valeur de l'incrustation inférieure des sections lors du groupement de cellules.
|
NUMBER
|
0
|
N
|
N
|
|
SortField
|
Spécifie le champ de table d'informations selon lequel le contenu de la section est trié. Le tri est effectué côté client et n'affecte pas la table d'informations source ni les autres widgets liés à l'ensemble de données.
|
INFOTABLE
|
O
|
N
|
|
|
SortAscending
|
Trie le contenu de la section par ordre croissant lorsque la propriété SortField est activée. Par défaut, les sections sont triées dans l'ordre décroissant.
|
BOOLEAN
|
Faux
|
O
|
N
|
|
SectionHeaders
|
Contrôle la visibilité des en-têtes de section lors du groupement des cellules dans la collection. Options : Aucun, Visible, Epinglé
|
STRING
|
Aucun
|
N
|
N
|
|
HeaderMashup
|
Spécifie l'application composite à utiliser pour les en-têtes de section lors du groupement des cellules dans la collection.
|
MASHUPNAME
|
Aucun
|
N
|
N
|
|
HeaderSectionParam
|
Nom du paramètre d'application composite En-tête qui recevra l'identificateur de section.
|
STRING
|
N
|
N
|
|
|
HeaderHeight
|
Définit la hauteur des en-têtes de section dans la collection.
|
NUMBER
|
40
|
N
|
N
|
|
SectionFooters
|
Contrôle la visibilité des pieds de page de section lors du groupement des cellules dans la collection. Options : Aucun, Visible, Epinglé
|
STRING
|
Aucun
|
N
|
N
|
|
FooterMashup
|
Spécifie l'application composite à utiliser pour le pied de page de la section lors du groupement des cellules dans la collection.
|
MASHUPNAME
|
N
|
N
|
|
|
FooterSectionParam
|
Nom du paramètre de l'application composite Pied de page qui recevra l'identificateur de section.
|
STRING
|
N
|
N
|
|
|
FooterHeight
|
Définit la hauteur des pieds de page de section lors du groupement des cellules dans la collection.
|
NUMBER
|
40
|
N
|
N
|
|
EmptyMashup
|
Spécifie l'application composite à afficher lorsqu'une cellule de la collection ne contient aucune donnée.
|
MASHUPNAME
|
Aucun
|
N
|
N
|
|
Deselect
|
Service pouvant être lié qui efface la sélection dans la collection.
|
Service
|
O
|
N
|
|
|
SelectAll
|
Service pouvant être lié qui sélectionne toutes les cellules dans la collection.
|
Service
|
O
|
N
|
|
|
DisableWrapping
|
Lorsque cette propriété est activée, elle affiche les cellules sur une ligne avec une barre de défilement horizontale. Lorsqu'elle est désactivée, les cellules sont renvoyées dans une nouvelle ligne lorsque l'espace horizontal est insuffisant pour afficher la collection entière. Cette propriété n'est prise en charge que lorsque la collection est configurée avec le mode de mise en page Flexible.
|
BOOLEAN
|
Faux
|
N
|
N
|
Evénements
|
Nom de propriété
|
Description
|
Type de base
|
Liable
|
Localisable ? (O/N)
|
|---|---|---|---|---|
|
CellClicked
|
Evénement déclenché lorsqu'un utilisateur clique ou appuie sur une cellule de la collection.
|
Evénement
|
O
|
N
|
|
CellDoubleClicked
|
Evénement déclenché lorsqu'un utilisateur double-clique ou appuie deux fois sur une cellule de la collection.
|
Evénement
|
O
|
N
|
|
CellLongClicked
|
Evénement qui se déclenche lorsqu'un utilisateur clique ou appuie en maintenant le bouton enfoncé dans une cellule de la collection pendant une durée supérieure à 400 millisecondes.
|
Evénement
|
O
|
N
|
|
CellRightClicked
|
Evénement déclenché lorsqu'un utilisateur clique avec le bouton droit de la souris sur une cellule de la collection.
|
Evénement
|
O
|
N
|