Ajouter et connecter des widgets

Ajoutez des widgets fonctionnels et de mise en page aux applications que vous créez avec Experience Builder. Vous pouvez accepter les styles par défaut ou personnaliser l’apparence et connecter les widgets à des données, des liens et d’autres widgets, pour une expérience Web unique.

Insérer des widgets

Les widgets représentent les blocs de construction de vos applications. Si vous n’utilisez pas les widgets dans les modèles de pages et les modèles de blocs, vous pouvez ajouter des widgets à la page à partir du panneau Insert widget (Insérer un widget) à l’aide du placement par glisser-déplacer. Les widgets Widget Controller (Contrôleur de widgets) et Placeholder (Espace réservé) comportent également un bouton Add widget (Ajouter un widget). Les widgets sont regroupés en deux catégories : les widgets de base et les widgets de mise en page. Les widgets de base sont des widgets fonctionnels qui peuvent servir d’outils d’application et les widgets de mise en page sont les conteneurs permettant d’organiser les widgets sur la page. Lorsque vous ajoutez et imbriquez des widgets, vous pouvez vous appuyer sur la vue de contour interactive de chaque page, qui montre la hiérarchie des widgets de la page et vous aide à organiser, sélectionner et configurer les widgets imbriqués.

L’onglet Pending (Attente) du panneau Insert widget (Insérer un widget) s’avère utile si vous devez concevoir votre application pour plusieurs tailles d’écran. Par exemple, une exigence de conception peut nécessiter l’implémentation du widget cartographique sur des tailles d’écran moyennes et grandes, mais pas sur de petites tailles. Dans ce cas, vous pouvez retirer le widget cartographique de la conception des petites tailles d’écran et l’ajouter à la liste en attente.

Connexion des widgets

Le panneau de configuration des widgets inclut les paramètres Content (Contenu), Style (Style) et Action (Opération). L’onglet Content (Contenu) définit le comportement, les connexions aux données et d’autres paramètres du widget. Les widgets sont alignés et stylisés dans l’onglet Style (Style) avec des paramètres tels que la taille, la position, l’arrière-plan, la bordure et l’ombre des zones. Vous pouvez également utiliser les barres d’outils des widgets pour supprimer ou aligner des widgets. La localisation des panneaux de widget est mémorisée dans l’application en temps réel.

Vous pouvez combiner des outils et des widgets et les connecter pour une plus grande interactivité. Aidez les utilisateurs finaux à naviguer dans votre application en définissant des liens vers des pages et des vues de section. Certains widgets prennent en charge l’ajout d’un déclencheur d’actions qui permet aux widgets de communiquer entre eux ; une action dans un widget déclenche une action dans un autre widget. Par exemple, cliquez sur une entité cartographique pour mettre à jour les détails de l’entité indiqués dans un widget Feature Info (Informations d’entité).

Définir des liens

Vous pouvez ajouter un hyperlien à votre contenu à l’aide de l’option Set link (Définir un lien) qui permet de renvoyer les utilisateurs finaux vers une autre page ou vue de section de votre application ou vers une autre adresse Web. Les widgets suivants prennent en charge la définition d’un lien :

Paramètres

Lorsque vous définissez un lien, vous pouvez choisir une option parmi les suivantes :

  • Page (Page) : lien renvoyant vers une autre page de votre application.
  • View (Vue) : lien renvoyant vers une vue spécifique d’un widget Section (Section).
  • Web address (Adresse Web) : lien renvoyant vers une adresse Web ; vous spécifiez une URL.

Vous pouvez également choisir l’endroit où le contenu lié doit s’ouvrir :

  • App window (Fenêtre d'application) : le contenu lié s’ouvre dans la fenêtre de navigateur actuelle que votre application utilise.
  • Top window (Fenêtre supérieure) : le contenu lié quitte les cadres dans lesquels il est imbriqué et s’ouvre par dessus les autres fenêtres ouvertes.
  • New window (Nouvelle fenêtre) : le contenu lié s’ouvre dans une nouvelle fenêtre de navigateur, en laissant l’application ouverte dans une autre fenêtre.