Widget Vertical Tab


Note : Ce type de widget n'est plus disponible depuis Product name - ev sas.png version H2.2015 et est remplacé par le type de widget Tab. Il continue néanmoins à fonctionner sur toutes les applications qui l'utilisent.

Apps - Widget - Vertical Tab icon.png Ce type de widget appartient à la catégorie Basic de la bibliothèque des widgets. Il permet de créer une barre verticale d'onglets, chacun pouvant contenir du texte, des images, appeler une page Html, une page de l'application ou d'une autre application... Cela permet d'afficher un maximum d'informations sur un minimum de pages.

Remarques

 Open url.png  voir Remarques générales sur les widgets

  • Définissez la hauteur du widget de manière à pouvoir afficher tous les onglets.

Best Practice big icon.pngBonnes pratiques

  • Utilisez le widget Vertical Tab pour regrouper des informations dans des onglets affichés verticalement.
    • Pour disposer les onglets sous forme d'une barre horizontale, utilisez le widget Horizontal Tab
    • Pour regrouper les informations dans des sections d'un menu dépliable, utilisez le widget Accordion.
  • La longueur du titre des onglets étant limitée en taille, utilisez le widget Accordion lorsque les titres sont longs.

Exemple

      EVApps - widget Vertical tab - Example.png

Liste des propriétés

Content

Tabs : Liste des onglets, chacun étant constitué d'un titre et d'un contenu. Cliquez sur [ ADD ITEM ] pour ajouter un nouvel onglet. Voir Procédure

Theme

   Open url.png  voir Description des propriétés

Procédures

Comment créer une barre verticale d'onglets

1. Cliquez sur [ ADD ITEM ] ; dans la zone Tabs, renseignez le titre du premier onglet de la barre, puis renseignez son contenu : saisissez directement le code dans la zone ou cliquez sur Apps - Edit icon.png pour ouvrir l'éditeur de texte.

2. De la même façon, créez les autres onglets dans l'ordre souhaité d'affichage.

  • Pour modifier l'ordre de la liste Tabs, cliquez-glissez l'onglet souhaité vers sa nouvelle position via Apps - Order objects icon.png.
  • Pour supprimer un onglet, cliquez sur Apps - Delete icon.png.

3. Passez en mode Exécution EVApps - GUI - Execute icon.png pour visualiser la barre verticale d'onglets telle qu'elle apparaîtra à l'utilisateur.

Comment récupérer l'URL de lancement d'une application

1. Sur la galerie, cliquez sur Apps - Application properties icon.png en regard de l'application souhaitée.

2. Dans la barre d'outils de l'éditeur graphique, cliquez sur EVApps - GUI - Share icon.png.
                   EVApps - GUI - Share Apps.png

3. Copiez l'URL de lancement de l'application.

4. Revenez sur votre application et collez l'URL :

  • soit dans la propriété URL d'un lien hypertexte inséré sur une propriété Label, Header/Footer, Html Code d'un widget (via Apps - Text Editor - Hyperlink icon.png sur l'éditeur de texte) ;
  • soit dans la propriété URL to Load du widget Button ;
  • soit dans la propriété Data > Select Link Type du widget Menu.
Tags:
Modifié par Utilisateur inconnu le 2017/01/04 11:10
Créé par Administrator XWiki le 2014/11/12 20:42

Raccourcis

Recent Updates

Haven't been here in a while? Here's what changed recently:

-   Product name - ev itsm.png
-   Product name - ev sas.png

Interesting Content

How to Automate Integration
Add a Shortcut to an App
History
Quick Dashboard
Full text search - Stop Words

Powered by XWiki ©, EasyVista 2019