14 347
modifications
Modifications
m
Updated. LOC-15241
{{Parent|Développement des applications Metropolis UI}}
__TOC__
Cette rubrique décrit les trois templates d'applications ou de fiches Metropolis UI de {{Product}}. {{f|vcl|La rubrique inclut les détails d'implémentation pour les deux frameworks - [[Plate-forme d'applications {{FM}}|{{FM}}]] et [[Présentation de la VCL|VCL]]. Une différence majeure est que {{FM}} implémente de nouveaux contrôles pour Metropolis UI (tels que [[lib_fr:FMX.ListBox.TMetropolisUIListBoxItem|TMetropolisUIListBoxItem]]), tandis que le framework VCL utilise les contrôles Windows existants, stylés pour Windows 8.|La rubriaue inclut des détails d'implémentation pour [[Plate-forme d'applications {{FM}}|{{FM}}]].}}
Voici les templates que vous pouvez choisir dans les experts Metropolis UI :
* [[#Template Vide Metropolis UI|Template Vide Metropolis UI]]
* [[#Template Grille Metropolis UI|Template Grille Metropolis UI]]
* [[#Template Volet de fractionnement Metropolis UI|Template Volet de fractionnement Metropolis UI]]
==Les templates Metropolis UI sont spécifiques à Windows==
Les templates Metropolis UI pour la disposition '''Grille''' et '''Volet de fractionnement''' ont été conçus spécifiquement pour Windows 8, bien qu'ils peuvent aussi être déployés sur Windows 7, Vista et XP. Les templates sont représentatifs des applications courantes que vous pouvez voir sur Windows 8.
Nous vous déconseillons d'utiliser les templates Metropolis UI sur le Mac car les conceptions de templates sont spécifiques à Windows 8, et elles n'ont pas été conçues pour livrer une interface utilisateur commune ou une expérience utilisateur familière aux utilisateurs Mac. Néanmoins, il est possible de retirer le style Metropolis UI d'une application, puis de déployer l'application sur le Mac.
==Propriétés communes partagées par tous les templates Metropolis UI==
Les templates Metropolis UI, à la fois pour VCL et {{FM}}, partagent des propriétés similaires qui caractérisent l'apparence Metropolis UI, tel que :
* '''Plein écran :''' Les fiches Metropolis UI sont automatiquement définies en hauteur plein écran sans zone non-client, afin que votre application soit vraiment plein écran :
** [[lib_fr:FMX.Forms.TForm.WindowState|WindowState]] est définie sur {{Const|wsMaximized}}.
** [[lib_fr:FMX.Forms.TForm.BorderStyle|BorderStyle]] est définie sur {{Const|None}}.
** Les propriétés '''GlassFrame''' ne sont pas définies.
{{f|vcl|
===Fonctionnalités des templates {{FM}}===
}}
* '''Barre d'application :''' Les fenêtres des templates Grille et Volet de fractionnement ont une barre d'outils contextuelle ([[Création d'une barre d'application Metropolis UI|Barre d'application de style Metropolis UI]]) qui peut être invoquée par un mouvement de glissement à partir du bas de l'écran.
: La barre d'application est constituée d'une disposition '''ToolbarHolder''' utilisée pour capturer les événements de mouvement, et un '''TPopup''' enfant qui contient la barre d'outils elle-même. '''ToolbarPopupAnimation''' est déclenchée automatiquement chaque fois que le popup est affiché et masqué, et le code invoquant le popup (*Form.ShowToolbar) calcule la valeur de départ de la position Popup basée sur la dimension de la fenêtre.
* '''TListBox avec TMetropolisUIListBoxItem :''' Les deux contrôles Grille et Volet de fractionnement utilisent les contrôles TListBox avec '''[[lib_fr:FMX.ListBox.TMetropolisUIListBoxItem|TMetropolisUIListBoxItem]]''', un nouveau contrôle {{FM}} Metropolis UI.
* Dans les fiches Metropolis UI, les contrôles {{FM}} utilisent beaucoup les propriétés '''[[lib_fr:FMX.Controls.TControl.Align|Align]]''' et '''[[lib_fr:FMX.Controls.TControl.Padding|Padding]]''' afin d'occuper l'intégralité de l'espace écran disponible.
* Le style {{FM}} fait partie d'une fiche Metropolis UI qui inclut un '''[[lib_fr:FMX.Controls.TStyleBook|StyleBook]]''' contenant le style Metropolis UI spécifique.
* '''StyleLookup :''' Pour les contrôles {{FM}}, la propriété '''StyleLookup''' active le contrôle brut (tel que [[lib_fr:FMX.StdCtrls.TButton|TButton]]) pour le changer en contrôle Metropolis UI, tel que [[lib_fr:FMX.Edit.TPasswordEditButton|TPasswordEditButton]]. Pour de plus amples informations, voir [[Support StyleLookup pour les contrôles Metropolis UI]] et [[Application des styles FireMonkey]].
{{f|vcl|
===Fonctionnalités des templates VCL===
* '''Barre d'application :''' La barre d'application tactile est implémentée sous la forme d'un TLabel situé sur le bord inférieur de la fiche, juste au-dessus de la barre de défilement horizontale. Quand vous effectuez un glissement ou une pichenette vers le haut à partir du bord inférieur, la barre d'application s'affiche ; le template contient un bouton Fermer de style Windows 8.
* '''Barre de défilement horizontale :''' En bas de la fiche se trouve un [[lib_fr:Vcl.Forms.TScrollBox|TScrollBox]] avec la propriété [[lib_fr:Vcl.Forms.TScrollingWinControl.HorzScrollBar|HorzScrollBar]] définie sur [[lib_fr:Vcl.Forms.TControlScrollBar|TControlScrollBar]].
* '''Clavier virtuel :''' Le fichier <code>.dpr</code> inclut du code pour afficher automatiquement le clavier d'écran pour les composants nécessitant une entrée utilisateur si aucun clavier physique n'est connecté :
<l s="delphi"/>
'''{{Delphi}} :
<source lang="delphi">
Application.UseMetropolisUI;
</source>
<l e="delphi"/>
<l s="cpp"/>
'''C++ :
<source lang="cpp">
Application->UseMetropolisUI();
</source>
<l e="cpp"/>
}}
==Template Vide Metropolis UI==
Les templates '''Metropolis UI vides''' n'ont pas de disposition prédéfinie et peuvent ainsi être traités comme un canevas vide. A l'exécution, vous effectuez un glissement ou une pichenette sur la fiche affichée (par toucher ou avec la souris) pour réaliser un déplacement vers l'autre fiche.
* Il n'y a pas de composants placés sur la fiche (autre qu'une [[Création d'une barre d'application Metropolis UI|barre d'application]]).
* Le style par défaut pour l'application est '''MetroDark'''.{{f|vcl|2=
* Pour le template Vide VCL, la [[lib_fr:Vcl.Forms.TForm.HorzScrollBar|barre de défilement horizontale]] (englobant la fiche même) est définie sur {{Code|Visible}}={{True}}.}}
: '''Remarque :''' Quand vous exécutez une application Metropolis UI plein écran vide à partir de l'EDI, vous pouvez fermer l'application en appuyant sur {{Key|Alt+F4}}.
==Template Grille Metropolis UI==
L'application '''Grille''' contient plusieurs groupes d'éléments, chacun d'eux ouvrant une page Vue Détail.
===Template Grille {{FM}}===
{|
|
'''DetailView :'''
|
'''GridView :'''
|
|- valign="top"
|
[[image:GridViewFontSm.png]]
|
[[image:GridPanelSM.png]]
|}
Les composants notables du template Grille {{FM}} sont :
Le défilement peut être effectué avec une barre de défilement, avec MouseTracking = True il peut être effectué en tirant le contenu avec LMB
* Activés pour les touchers et les mouvements. Avec GestureManager, tous les mouvements standard peuvent aussi être utilisés.
* TLayout utilisé pour l'en-tête, le cadre principal et le pied de page
* Barre de défilement horizontale ('''[[lib_fr:FMX.Layouts.THorzScrollBox|THorzScrollBox]]'''), qui fonctionne comme un [[lib_fr:FMX.Layouts.TVertScrollBox|TVertScrollBox]] orienté horizontalement, contient tous les contrôles et est utilisée pour la pagination à travers l'application à l'exécution. Les dimensions du THorzScrollBox sont calculées en tant que rectangle d'union de tous les contrôles qu'il contient.
* '''[[lib_fr:FMX.ListBox.TMetropolisUIListBoxItem|TMetropolisUIListBoxItem]]''', qui contient un titre et un sous-titre (texte descriptif).
* Boutons de style Metropolis UI (Enregistrer, Appliquer, Fermer)
{{f|vcl|
===Template Grille VCL===
Voici les fiches d'exécution VCL pour le template Grille Metropolis UI (les styles VCL ne sont pas employés à la conception) :
[[image:VCLGridtemplatePage1.png]]
[[image:VCLGridPage2Small.png]]
Le template '''VCL Grille Metropolis UI''' est une application fiches VCL ayant deux fiches :
* '''groupedItems '''
*: La fiche principale, groupedItems.pas, affiche des groupes d'éléments avec des images, un titre et un sous-titre. La disposition de la fiche '''groupedItems''' est implémentée par le biais de '''[[lib_fr:Vcl.ExtCtrls.TFlowPanel|TFlowPanel]]''' et est défilable (vers la gauche et la droite). Cliquer sur l'image affiche la fiche '''ItemDetail'''.
* '''ItemDetail'''
*: Affiche l'image, le titre et la zone de détail contenant du texte. La zone de détail entière est défilable (vers la gauche et la droite). La zone de détail est implémentée en utilisant les composants '''TMemo''' en lecture seule.
Les principales fonctionnalités du template '''VCL Grille Metropolis UI''' sont :
* Le style par défaut pour l'application est '''MetropolisUIDark''' (notez que le style est seulement utilisé à l'exécution pour le framework VCL).
* Cliquer sur une image de '''groupedItems''' affiche la fiche '''itemDetail'''.
* La zone de détail de la fiche '''itemDetail''' est défilable (vers la gauche et la droite).
* Un glissement vers le haut à partir du bord inférieur de la fiche affiche une barre d'application. Pour plus d'informations sur les barres d'applications, voir [[Création d'une barre d'application Metropolis UI]].
}}
==Template Volet de fractionnement Metropolis UI==
L'application '''Volet de fractionnement''' contient le même GridView que l'application Grille, mais avec moins d'éléments. Chaque élément ouvre un SplitPaneView (Vue Volet de fractionnement), qui contient une liste d'éléments sur la gauche et le DetailView (Vue Détail) sur la droite.
===Template Volet de fractionnement {{FM}}===
{|
|
'''GridPaneView :'''
|
'''SplitPaneView :'''
|- valign="top"
|
[[image:FMXSplitPane.png]]
|
[[image:FMXSplitPanepage2.png]]
|}
Les composants notables du template '''Volet de fractionnement {{FM}}''' sont :
* Un en-tête qui contient le titre et les boutons facultatifs : un TLayout avec un TLabel
* TImageControl pour les graphiques
* TLayout avec des TLabels pour l'affichage des informations
* TLabels pour l'affichage
* Pied de page avec des boutons :
** TToolBar avec des boutons
** TLayout avec des boutons de style Metropolis UI
{{f|vcl|
===Template Volet de fractionnement VCL===
Voici les fiches d'exécution VCL pour le template Volet de fractionnement Metropolis UI (les styles VCL ne sont pas employés à la conception) :
'''Volet GroupedItems :'''
[[image:VCLSplitPane3.png]]
'''Volet ItemDetail :'''
[[image:VCLPaneSmall3.png]]
Le template '''VCL Volet de fractionnement Metropolis UI''' est une application Fiches VCL ayant deux fiches :
* '''groupedItems'''
*: La fiche principale est '''groupedItems.pas'''. Cette fiche affiche les groupes d'éléments, les images, un titre et un sous-titre pour le groupe. La zone des éléments est défilable (vers la gauche et la droite). Cliquer sur l'image affiche la fiche '''splitItemDetail'''.
* '''splitItemDetail'''.
*: Affiche une vue de fractionnement utilisant deux éléments '''TScrollBox'''.
* Le '''TScrollBox''' sur la gauche simule l'apparence d'une vue liste avec des images et du texte. Cela est effectué en utilisant '''TGridPanel'''. Cliquer sur une image, un titre, un sous-titre ou une description sur la gauche actualise les libellés titre et sous-titre de la zone de détail située sur la droite.
* La zone de détail sur la droite est un '''TScrollBox''' contenant un '''TImage''' et les composants '''TMemo''' en lecture seule pour afficher les informations. La zone de détail sur la droite est défilable (vers le haut et le bas).
Les principales fonctionnalités du template '''VCL Volet de fractionnement Metropolis UI''' sont :
* Le style par défaut pour l'application est '''MetropolisUIDark'''.
* La disposition de la fiche '''groupedItems''' est implémentée par le biais de '''TFlowPanel''' et est défilable (vers la gauche et la droite).
* Cliquer sur une image dans '''groupedItems''' affiche la fiche '''splitItemDetail''', et le titre est dérivé à l'exécution de l'élément d'origine sur le volet '''groupedItems'''.
* La vue liste sur la gauche dans splitItemDetail est implémentée par des composants '''TGridPane'''.
* La zone de détail sur la droite de la fiche '''splitItemDetail''' est défilable (vers le haut et le bas).
==Voir aussi==
* Experts d'applications Metropolis UI :
** [[Application FireMonkey Metropolis UI]]
** [[Application VCL Metropolis UI]]
* [[Fontes Metropolis UI]]
* [[Application des styles FireMonkey]]
[[Category:Metropolis UI]][[Category:XE3]]
[[en:Metropolis UI Application Templates]]
[[de:Vorlagen für Metropolis-UI-Anwendungen]]
[[ja:Metropolis UI アプリケーション テンプレート]]
__TOC__
Cette rubrique décrit les trois templates d'applications ou de fiches Metropolis UI de {{Product}}. {{f|vcl|La rubrique inclut les détails d'implémentation pour les deux frameworks - [[Plate-forme d'applications {{FM}}|{{FM}}]] et [[Présentation de la VCL|VCL]]. Une différence majeure est que {{FM}} implémente de nouveaux contrôles pour Metropolis UI (tels que [[lib_fr:FMX.ListBox.TMetropolisUIListBoxItem|TMetropolisUIListBoxItem]]), tandis que le framework VCL utilise les contrôles Windows existants, stylés pour Windows 8.|La rubriaue inclut des détails d'implémentation pour [[Plate-forme d'applications {{FM}}|{{FM}}]].}}
Voici les templates que vous pouvez choisir dans les experts Metropolis UI :
* [[#Template Vide Metropolis UI|Template Vide Metropolis UI]]
* [[#Template Grille Metropolis UI|Template Grille Metropolis UI]]
* [[#Template Volet de fractionnement Metropolis UI|Template Volet de fractionnement Metropolis UI]]
==Les templates Metropolis UI sont spécifiques à Windows==
Les templates Metropolis UI pour la disposition '''Grille''' et '''Volet de fractionnement''' ont été conçus spécifiquement pour Windows 8, bien qu'ils peuvent aussi être déployés sur Windows 7, Vista et XP. Les templates sont représentatifs des applications courantes que vous pouvez voir sur Windows 8.
Nous vous déconseillons d'utiliser les templates Metropolis UI sur le Mac car les conceptions de templates sont spécifiques à Windows 8, et elles n'ont pas été conçues pour livrer une interface utilisateur commune ou une expérience utilisateur familière aux utilisateurs Mac. Néanmoins, il est possible de retirer le style Metropolis UI d'une application, puis de déployer l'application sur le Mac.
==Propriétés communes partagées par tous les templates Metropolis UI==
Les templates Metropolis UI, à la fois pour VCL et {{FM}}, partagent des propriétés similaires qui caractérisent l'apparence Metropolis UI, tel que :
* '''Plein écran :''' Les fiches Metropolis UI sont automatiquement définies en hauteur plein écran sans zone non-client, afin que votre application soit vraiment plein écran :
** [[lib_fr:FMX.Forms.TForm.WindowState|WindowState]] est définie sur {{Const|wsMaximized}}.
** [[lib_fr:FMX.Forms.TForm.BorderStyle|BorderStyle]] est définie sur {{Const|None}}.
** Les propriétés '''GlassFrame''' ne sont pas définies.
{{f|vcl|
===Fonctionnalités des templates {{FM}}===
}}
* '''Barre d'application :''' Les fenêtres des templates Grille et Volet de fractionnement ont une barre d'outils contextuelle ([[Création d'une barre d'application Metropolis UI|Barre d'application de style Metropolis UI]]) qui peut être invoquée par un mouvement de glissement à partir du bas de l'écran.
: La barre d'application est constituée d'une disposition '''ToolbarHolder''' utilisée pour capturer les événements de mouvement, et un '''TPopup''' enfant qui contient la barre d'outils elle-même. '''ToolbarPopupAnimation''' est déclenchée automatiquement chaque fois que le popup est affiché et masqué, et le code invoquant le popup (*Form.ShowToolbar) calcule la valeur de départ de la position Popup basée sur la dimension de la fenêtre.
* '''TListBox avec TMetropolisUIListBoxItem :''' Les deux contrôles Grille et Volet de fractionnement utilisent les contrôles TListBox avec '''[[lib_fr:FMX.ListBox.TMetropolisUIListBoxItem|TMetropolisUIListBoxItem]]''', un nouveau contrôle {{FM}} Metropolis UI.
* Dans les fiches Metropolis UI, les contrôles {{FM}} utilisent beaucoup les propriétés '''[[lib_fr:FMX.Controls.TControl.Align|Align]]''' et '''[[lib_fr:FMX.Controls.TControl.Padding|Padding]]''' afin d'occuper l'intégralité de l'espace écran disponible.
* Le style {{FM}} fait partie d'une fiche Metropolis UI qui inclut un '''[[lib_fr:FMX.Controls.TStyleBook|StyleBook]]''' contenant le style Metropolis UI spécifique.
* '''StyleLookup :''' Pour les contrôles {{FM}}, la propriété '''StyleLookup''' active le contrôle brut (tel que [[lib_fr:FMX.StdCtrls.TButton|TButton]]) pour le changer en contrôle Metropolis UI, tel que [[lib_fr:FMX.Edit.TPasswordEditButton|TPasswordEditButton]]. Pour de plus amples informations, voir [[Support StyleLookup pour les contrôles Metropolis UI]] et [[Application des styles FireMonkey]].
{{f|vcl|
===Fonctionnalités des templates VCL===
* '''Barre d'application :''' La barre d'application tactile est implémentée sous la forme d'un TLabel situé sur le bord inférieur de la fiche, juste au-dessus de la barre de défilement horizontale. Quand vous effectuez un glissement ou une pichenette vers le haut à partir du bord inférieur, la barre d'application s'affiche ; le template contient un bouton Fermer de style Windows 8.
* '''Barre de défilement horizontale :''' En bas de la fiche se trouve un [[lib_fr:Vcl.Forms.TScrollBox|TScrollBox]] avec la propriété [[lib_fr:Vcl.Forms.TScrollingWinControl.HorzScrollBar|HorzScrollBar]] définie sur [[lib_fr:Vcl.Forms.TControlScrollBar|TControlScrollBar]].
* '''Clavier virtuel :''' Le fichier <code>.dpr</code> inclut du code pour afficher automatiquement le clavier d'écran pour les composants nécessitant une entrée utilisateur si aucun clavier physique n'est connecté :
<l s="delphi"/>
'''{{Delphi}} :
<source lang="delphi">
Application.UseMetropolisUI;
</source>
<l e="delphi"/>
<l s="cpp"/>
'''C++ :
<source lang="cpp">
Application->UseMetropolisUI();
</source>
<l e="cpp"/>
}}
==Template Vide Metropolis UI==
Les templates '''Metropolis UI vides''' n'ont pas de disposition prédéfinie et peuvent ainsi être traités comme un canevas vide. A l'exécution, vous effectuez un glissement ou une pichenette sur la fiche affichée (par toucher ou avec la souris) pour réaliser un déplacement vers l'autre fiche.
* Il n'y a pas de composants placés sur la fiche (autre qu'une [[Création d'une barre d'application Metropolis UI|barre d'application]]).
* Le style par défaut pour l'application est '''MetroDark'''.{{f|vcl|2=
* Pour le template Vide VCL, la [[lib_fr:Vcl.Forms.TForm.HorzScrollBar|barre de défilement horizontale]] (englobant la fiche même) est définie sur {{Code|Visible}}={{True}}.}}
: '''Remarque :''' Quand vous exécutez une application Metropolis UI plein écran vide à partir de l'EDI, vous pouvez fermer l'application en appuyant sur {{Key|Alt+F4}}.
==Template Grille Metropolis UI==
L'application '''Grille''' contient plusieurs groupes d'éléments, chacun d'eux ouvrant une page Vue Détail.
===Template Grille {{FM}}===
{|
|
'''DetailView :'''
|
'''GridView :'''
|
|- valign="top"
|
[[image:GridViewFontSm.png]]
|
[[image:GridPanelSM.png]]
|}
Les composants notables du template Grille {{FM}} sont :
Le défilement peut être effectué avec une barre de défilement, avec MouseTracking = True il peut être effectué en tirant le contenu avec LMB
* Activés pour les touchers et les mouvements. Avec GestureManager, tous les mouvements standard peuvent aussi être utilisés.
* TLayout utilisé pour l'en-tête, le cadre principal et le pied de page
* Barre de défilement horizontale ('''[[lib_fr:FMX.Layouts.THorzScrollBox|THorzScrollBox]]'''), qui fonctionne comme un [[lib_fr:FMX.Layouts.TVertScrollBox|TVertScrollBox]] orienté horizontalement, contient tous les contrôles et est utilisée pour la pagination à travers l'application à l'exécution. Les dimensions du THorzScrollBox sont calculées en tant que rectangle d'union de tous les contrôles qu'il contient.
* '''[[lib_fr:FMX.ListBox.TMetropolisUIListBoxItem|TMetropolisUIListBoxItem]]''', qui contient un titre et un sous-titre (texte descriptif).
* Boutons de style Metropolis UI (Enregistrer, Appliquer, Fermer)
{{f|vcl|
===Template Grille VCL===
Voici les fiches d'exécution VCL pour le template Grille Metropolis UI (les styles VCL ne sont pas employés à la conception) :
[[image:VCLGridtemplatePage1.png]]
[[image:VCLGridPage2Small.png]]
Le template '''VCL Grille Metropolis UI''' est une application fiches VCL ayant deux fiches :
* '''groupedItems '''
*: La fiche principale, groupedItems.pas, affiche des groupes d'éléments avec des images, un titre et un sous-titre. La disposition de la fiche '''groupedItems''' est implémentée par le biais de '''[[lib_fr:Vcl.ExtCtrls.TFlowPanel|TFlowPanel]]''' et est défilable (vers la gauche et la droite). Cliquer sur l'image affiche la fiche '''ItemDetail'''.
* '''ItemDetail'''
*: Affiche l'image, le titre et la zone de détail contenant du texte. La zone de détail entière est défilable (vers la gauche et la droite). La zone de détail est implémentée en utilisant les composants '''TMemo''' en lecture seule.
Les principales fonctionnalités du template '''VCL Grille Metropolis UI''' sont :
* Le style par défaut pour l'application est '''MetropolisUIDark''' (notez que le style est seulement utilisé à l'exécution pour le framework VCL).
* Cliquer sur une image de '''groupedItems''' affiche la fiche '''itemDetail'''.
* La zone de détail de la fiche '''itemDetail''' est défilable (vers la gauche et la droite).
* Un glissement vers le haut à partir du bord inférieur de la fiche affiche une barre d'application. Pour plus d'informations sur les barres d'applications, voir [[Création d'une barre d'application Metropolis UI]].
}}
==Template Volet de fractionnement Metropolis UI==
L'application '''Volet de fractionnement''' contient le même GridView que l'application Grille, mais avec moins d'éléments. Chaque élément ouvre un SplitPaneView (Vue Volet de fractionnement), qui contient une liste d'éléments sur la gauche et le DetailView (Vue Détail) sur la droite.
===Template Volet de fractionnement {{FM}}===
{|
|
'''GridPaneView :'''
|
'''SplitPaneView :'''
|- valign="top"
|
[[image:FMXSplitPane.png]]
|
[[image:FMXSplitPanepage2.png]]
|}
Les composants notables du template '''Volet de fractionnement {{FM}}''' sont :
* Un en-tête qui contient le titre et les boutons facultatifs : un TLayout avec un TLabel
* TImageControl pour les graphiques
* TLayout avec des TLabels pour l'affichage des informations
* TLabels pour l'affichage
* Pied de page avec des boutons :
** TToolBar avec des boutons
** TLayout avec des boutons de style Metropolis UI
{{f|vcl|
===Template Volet de fractionnement VCL===
Voici les fiches d'exécution VCL pour le template Volet de fractionnement Metropolis UI (les styles VCL ne sont pas employés à la conception) :
'''Volet GroupedItems :'''
[[image:VCLSplitPane3.png]]
'''Volet ItemDetail :'''
[[image:VCLPaneSmall3.png]]
Le template '''VCL Volet de fractionnement Metropolis UI''' est une application Fiches VCL ayant deux fiches :
* '''groupedItems'''
*: La fiche principale est '''groupedItems.pas'''. Cette fiche affiche les groupes d'éléments, les images, un titre et un sous-titre pour le groupe. La zone des éléments est défilable (vers la gauche et la droite). Cliquer sur l'image affiche la fiche '''splitItemDetail'''.
* '''splitItemDetail'''.
*: Affiche une vue de fractionnement utilisant deux éléments '''TScrollBox'''.
* Le '''TScrollBox''' sur la gauche simule l'apparence d'une vue liste avec des images et du texte. Cela est effectué en utilisant '''TGridPanel'''. Cliquer sur une image, un titre, un sous-titre ou une description sur la gauche actualise les libellés titre et sous-titre de la zone de détail située sur la droite.
* La zone de détail sur la droite est un '''TScrollBox''' contenant un '''TImage''' et les composants '''TMemo''' en lecture seule pour afficher les informations. La zone de détail sur la droite est défilable (vers le haut et le bas).
Les principales fonctionnalités du template '''VCL Volet de fractionnement Metropolis UI''' sont :
* Le style par défaut pour l'application est '''MetropolisUIDark'''.
* La disposition de la fiche '''groupedItems''' est implémentée par le biais de '''TFlowPanel''' et est défilable (vers la gauche et la droite).
* Cliquer sur une image dans '''groupedItems''' affiche la fiche '''splitItemDetail''', et le titre est dérivé à l'exécution de l'élément d'origine sur le volet '''groupedItems'''.
* La vue liste sur la gauche dans splitItemDetail est implémentée par des composants '''TGridPane'''.
* La zone de détail sur la droite de la fiche '''splitItemDetail''' est défilable (vers le haut et le bas).
==Voir aussi==
* Experts d'applications Metropolis UI :
** [[Application FireMonkey Metropolis UI]]
** [[Application VCL Metropolis UI]]
* [[Fontes Metropolis UI]]
* [[Application des styles FireMonkey]]
[[Category:Metropolis UI]][[Category:XE3]]
[[en:Metropolis UI Application Templates]]
[[de:Vorlagen für Metropolis-UI-Anwendungen]]
[[ja:Metropolis UI アプリケーション テンプレート]]