Créer des composants visuels

sans faire de composant

Webinaire du 22 février 2019

(c) Patrick Prémartin / developpeur-pascal.fr

 Au menu du jour

• Introduction
• Un composant, c’est quoi ?
• Créer un composant VCL
• Faire un pseudo composant visuel sans coder
• Etendre un composant existant dans FMX
• Créer un composant FMX
• Conclusion
• Questions / réponses

(c) Patrick Prémartin / developpeur-pascal.fr

Introduction

(c) Patrick Prémartin / developpeur-pascal.fr

 Patrick Prémartin

• Ancien utilisateur de Turbo Pascal, amoureux de Delphi depuis toujours,

développeur web depuis NCSA Mosaic…

• Prestataire et formateur à travers sa société Olf Software.

• Editeur du blog https://developpeur-pascal.fr/

• MVP Embarcadero depuis octobre 2017.

• Auteur d’articles, de livres, webinariste et parfois même conférencier.

(c) Patrick Prémartin / developpeur-pascal.fr

 A propos de Olf Software

• Depuis octobre 2001 la société de services Olf Software propose des

prestations de conseil, développement et formation sur les
technologies liées au web et au développement logiciel.

• La société édite également des livres, des sites Internet et des

logiciels.

• Site web principal : https://olfsoftware.fr

(c) Patrick Prémartin / developpeur-pascal.fr

 Organisme de formation

• Olf Software propose des formations en lien avec Delphi.

• Des formations inter entreprises sont organisées régulièrement et

annoncées sur https://se-former-a-delphi.fr/

• Des formations intra entreprise personnalisées sont faisables sur demande

partout en France et en Europe.

• Olf Software est un organisme de formation professionnelle enregistré en

préfecture et référencé sur Datadock.
Nos formations peuvent être prises en charge par les OPCA.

(c) Patrick Prémartin / developpeur-pascal.fr

 Les versions de Delphi

• Plusieurs licences de Delphi existent (vendu seul ou dans RAD Studio):

• Academic : pour les établissements d’enseignement et leurs étudiants
• Community Edition : gratuit pour tous, en licence commerciale limitée
• Professional, Enterprise, Architect : pour les entreprises, selon leurs besoins

• Pour toutes informations sur les licences et les tarifs contactez la

société Barnsten sur https://www.barnsten.com/fr/

(c) Patrick Prémartin / developpeur-pascal.fr

 Les webinaires précédents

• Je participe régulièrement à des webinaires. Une page leur est

consacrée sur mon blog à l’adresse https://vasur.fr/webinairesdelphi

• Vous y trouverez les rediffusions en vidéos lorsqu’elles sont

disponibles, un PDF de mes présentations, le lien vers les sources des
exemples présentés et des informations complémentaires.

• S’y trouvent aussi les dates et liens d’inscriptions pour les prochains
webinaires et les formations.
(c) Patrick Prémartin / developpeur-pascal.fr
 Introduction

• Présentation de la société Olf Software

https://www.olfsoftware.fr
• Présentation de Patrick Prémartin
https://www.linkedin.com/in/patrickpremartin/
• Les différentes versions de Delphi
https://www.embarcadero.com/fr/products/delphi
• Voir ou revoir les webinaires précédents
https://vasur.fr/webinairesdelphi

(c) Patrick Prémartin / developpeur-pascal.fr

Un composant, c’est quoi ?

(c) Patrick Prémartin / developpeur-pascal.fr

 Un composant, c’est quoi ?

• Delphi et C++Builder proposent des concepteurs de fiches pour

dessiner les écrans des logiciels et applications mobiles de façon
visuelle.

• Il suffit de glisser des objets, appelés composants, depuis une liste

vers l’écran.

(c) Patrick Prémartin / developpeur-pascal.fr

 Un composant, c’est quoi ?

• Il existe deux types de composants : les visuels et les non visuels.

• Les composants visuels correspondent à des éléments de l’interface
utilisateur (boutons, champs de saisie, images, dessins, textes, …).
• Les composants non visuels servent uniquement aux développeurs
pour des menus, des bases de données, des images et tout un tas de
choses. Pour des raisons de simplicité d’usage ils se placent sur les
fiches comme les composants visuels mais n’ont pas d’impact pour
l’utilisateur.

(c) Patrick Prémartin / developpeur-pascal.fr

Exemples de composants
Démonstration

(c) Patrick Prémartin / developpeur-pascal.fr

Créer un composant VCL

(c) Patrick Prémartin / developpeur-pascal.fr

 Créer un composant VCL

• Pour créer un composant utilisable dans un projet VCL c’est assez

simple : il suffit d’utiliser l’assistant qui génère une unité.

• Le hic, c’est qu’il faut tout programmer car c’est du code pur.

(c) Patrick Prémartin / developpeur-pascal.fr

Créer un composant VCL
Démonstration

(c) Patrick Prémartin / developpeur-pascal.fr

Faire un pseudo composant
visuel sans coder

(c) Patrick Prémartin / developpeur-pascal.fr

 Faire un pseudo composant
visuel sans coder
• Pour les composants qui sont un assemblage d’autres composants
visuels, pourquoi devrions-nous tout coder à la main ?

• Les cadres (TFrame) sont là pour nous simplifier la vie !

• Le TFrame ressemble à une fiche mais n’en est pas une. Il est
utilisable comme n’importe quel composant visuel une fois référencé.

(c) Patrick Prémartin / developpeur-pascal.fr

 Faire un pseudo composant
visuel sans coder
• Pour créer un TFrame on passe par l’assistant classique de création de
fiches ou d’unités.

• On remplit notre TFrame, on y ajoute nos méthodes, on gère le code

associé aux éléments que l’on place dessus et au final on l’enregistre.

• Pour que le TFrame soit disponible pour les autres fiches il suffit de
l’ajouter à la palette.

(c) Patrick Prémartin / developpeur-pascal.fr

Simuler un composant VCL
Démonstration

(c) Patrick Prémartin / developpeur-pascal.fr

Simuler un composant FMX
Démonstration

(c) Patrick Prémartin / developpeur-pascal.fr

 Faire un pseudo composant
visuel sans coder
• Si on y regarde de plus près, on constate donc que TFrame peut
s’ajouter à la palette des composants et se comporte comme un
composant…

• Serait-ce un composant ?

(c) Patrick Prémartin / developpeur-pascal.fr

 Faire un pseudo composant
visuel sans coder
• Si on y regarde de plus près, on constate donc que TFrame peut
s’ajouter à la palette des composants et se comporte comme un
composant…

• Serait-ce un composant ?

• La réponse est oui : il a TComponent comme ancêtre !

(c) Patrick Prémartin / developpeur-pascal.fr

 Faire un pseudo composant
visuel sans coder
• TFrame héritant de TComponent c’est donc bel et bien un composant.

• On peut jouer avec lui comme on le ferait avec un composant maison.

• On peut donc lui ajouter des propriétés et des événements…

• Transformons notre TFrame en composant exploitable comme les

autres par l’inspecteur de propriétés.
(c) Patrick Prémartin / developpeur-pascal.fr
Convertir un TFrame en
composant visuel
Démonstration

(c) Patrick Prémartin / developpeur-pascal.fr

Etendre un composant
existant dans FMX

(c) Patrick Prémartin / developpeur-pascal.fr

 Etendre un composant existant
dans FMX
• Avec FireMonkey on peut aller encore plus loin grâce aux styles FMX.

• Rappel : un composant visuel dans FMX est à la base un assemblage

de formes et de lignes de code.

(c) Patrick Prémartin / developpeur-pascal.fr

 Etendre un composant existant
dans FMX
• On peut modifier complètement un composant FMX en modifiant le
style qui lui est associé. La seule contrainte est de conserver des
éléments nommés comme ceux d’origine pour ne pas planter le code
existant.

• C’est pour ça qu’il est plus simple de partir d’un layout vide quand on
crée nos propres composants mais on peut étendre un composant
existant si on le désire.

(c) Patrick Prémartin / developpeur-pascal.fr

Etendre un composant FMX
Démonstration

(c) Patrick Prémartin / developpeur-pascal.fr

Créer un composant FMX

(c) Patrick Prémartin / developpeur-pascal.fr

 Créer un composant FMX

• La création d’un composant FMX se fait comme la création d’un

composant VCL à la différence près qu’on peut choisir d’utiliser les
styles plutôt que du code pour dessiner le composant.

• Je vous laisse consulter la documentation sur le sujet. Nous y

reviendrons sans doute une prochaine fois en webinaire ou plus
probablement sur une journée de formation pour les personnes
intéressées.

(c) Patrick Prémartin / developpeur-pascal.fr

 Conclusion

(c) Patrick Prémartin / developpeur-pascal.fr

 Conclusion

• Chaque framework lié à un concepteur de fiches sous Delphi a sa

propre hiérarchie de composants. Nous l’avons vu pour la VCL et
FireMonkey. C’est pareil pour IntraWeb, UniGUI, TMS Web Core et
tous les outils tiers permettant de générer des interfaces utilisateurs
basées sur Delphi.
• Pour faire un composant il faut généralement tout faire à la main.
• Nous avons vu qu’avec des Tframe sur la VCL ou FMX on arrive à
simuler simplement des composants utilisables dans nos projets.
• La palme de la conception de composants personnalisables revenant
à FireMonkey avec son mélange de styles et de code.
(c) Patrick Prémartin / developpeur-pascal.fr
 Conclusion

• Ce webinaire et les sources des démos seront rapidement mis à

disposition sur le blog https://developpeur-pascal.fr

• Les prochains événements en live :

=> c’est pour très bientôt J

• Les prochains événements en ligne :

=> webinaire sur l’utilisation de QR Code le 26 mars

• Surveillez vos emails pour les prochaines dates.

(c) Patrick Prémartin / developpeur-pascal.fr
Questions / réponses

(c) Patrick Prémartin / developpeur-pascal.fr