Tutoriel : Liaison de contrôles via le Concepteur LiveBindings

De RAD Studio
Aller à : navigation, rechercher

Remonter à Tutoriels Bases de données et LiveBindings


Ce tutoriel montre comment utiliser le Concepteur LiveBindings pour créer visuellement des LiveBindings entre les contrôles afin de créer des applications qui nécessitent peu de code, ou pas du tout.

Dans ce tutoriel, vous allez créer une application multi-périphérique HD qui utilise LiveBindings pour lier plusieurs objets afin de changer les couleurs de remplissage et de trait d'un cercle. Toutes les liaisons sont créées en toute transparence d'une façon visuelle par le biais du Concepteur LiveBindings.

Etape 1 : Création du projet

Créez un nouveau projet. Choisissez une application multi-périphérique HD pour cet exemple.

  1. Faites glisser et déposez un composant TCircle sur le Concepteur de fiches.
  2. Dans la palette d'outils, localisez un composant TColorPanel et déposez-le sur la fiche.
  3. Faites de même pour un contrôle TComboColorBox.

Le contrôle panneau de couleurs définira la couleur de remplissage du cercle, tandis que la zone de liste déroulante des couleurs définira la couleur du trait du cercle.

L'image suivante représente la fiche après y avoir placé les composants.

LBDLinkingControls.png

Etape 2 : Création de la liaison dynamique (LiveBindings)

Jetez maintenant un coup d'oeil sur la fenêtre du Concepteur LiveBindings. Si elle n'est pas visible, accédez au menu Voir et sélectionnez la commande Concepteur LiveBindings.

Votre diagramme contient des blocs individuels qui représentent les objets de votre fiche. A ce stade, ils ne sont pas liés les uns aux autres. Localisez le bloc qui représente le cercle (Circle1) et cliquez sur les trois points dans le coin inférieur droit.

  1. Sélectionnez les propriétés Fill.Color et Stroke.Color dans la boîte de dialogue Membres liables.

    LBDBlock3Dots.png

    Après l'appui sur OK, le composant Circle1 est dessiné avec les deux propriétés exposées.
  2. Cliquez sur la propriété Color du bloc ComboColorBox1 et faites glisser une ligne sur la propriété Stroke.Color du bloc Circle1.

    LBDLinking2Controls.png

  3. Cliquez sur la propriété Color du bloc ColorPanel1 et faites glisser une ligne sur la propriété Fill.Color du bloc Circle1.
  4. Appuyez sur le bouton Réorganiser (LBDRearrange.png) afin d'organiser automatiquement le diagramme, ou bien organisez les blocs vous-même.

A ce stade, votre diagramme de liaisons doit ressembler à celui illustré ci-dessous.

LBDLinkingDiagram.png

Les résultats

Exécutez l'application en appuyant sur F9 ou en utilisant la commande de menu Exécuter > Exécuter. Changez les couleurs et observez les résultats.

LBDLinkingResults.png

Voir aussi