FireMonkey-Komponentendesign
Nach oben zu FireMonkey-Komponentenhandbuch
Inhaltsverzeichnis
In diesem Thema wird beschrieben, wie Komponenten mit FireMonkey entworfen werden.
Überblick über ausgewählte integrierte Steuerelemente
Anhand einiger vorhandener Steuerelemente wird eine Auswahl von Designs in FireMonkey veranschaulicht.
TPanel: Zuweisen von Stilen für Grundelemente
Da der Quellcode für TPanel kurz ist, kann er hier in seiner Gesamtheit wiedergegeben werden, und zwar sowohl das Interface:
TPanel = class(TStyledControl)
public
constructor Create(AOwner: TComponent); override;
published
property StyleLookup;
end;
als auch die Implementierung:
constructor TPanel.Create(AOwner: TComponent);
begin
inherited;
Width := 120;
Height := 100;
end;
TPanel ist von TStyledControl, der Basisklasse für alle Steuerelemente auf Benutzerebene, abgeleitet. TPanel veröffentlicht die Eigenschaft StyleLookup, die den Namen des zu suchenden Stils enthält. Die Eigenschaften Width und Height von TControl werden durch den Konstruktor gesetzt. Aber wie rendert dieses Steuerelement sich selbst?
Ein Schlüsselkonzept von FireMonkey ist die Verwendung von Stilen. Der Standardstil für TPanel unter Windows, der durch Speichern einer STYLE-Datei eingesehen werden kann, ist ungefähr wie folgt definiert:
object TRectangle
StyleName = 'panelstyle'
Width = 50
Height = 50
HitTest = False
Fill.Color = $FFffFFff
Stroke.Color = $FF8e8e8e
end
TPanel ist ein gefülltes weißes Rechteck mit einem grauen Rahmen. (Auf dem Mac enthält das Rechteck einen Farbverlauf.)
Als mit Stilen versehenes Steuerelement enthält TStyledControl eine ResourceLink-Eigenschaft, die auf ein TFmxObject zeigt. ResourceLink ist ein Klon der Stilressource des Steuerelements, die entweder anhand des Namens (angegeben in der Eigenschaft StyleLookup des Steuerelements mit dem Wert der Eigenschaft StyleName der Ressource) oder des Standardwerts gesucht wird. Dieses Ressourcen-Link-Objekt wird auch beim Laden des Steuerelements oder bei jeder Änderung seiner Eigenschaft StyleLookup als erstes untergeordnetes Element des Steuerelements eingefügt. Dies erfolgt in TStyledControl.ApplyStyleLookup.
Wenn sich das Steuerelement als TControl selbst zeichnet, zeichnet es daher auch alle seine untergeordneten Elemente. Das erste untergeordnete Element ist das Aussehen des Steuerelements selbst, und dann werden die anderen "echten" untergeordneten Elemente (falls vorhanden) gezeichnet.
Als grundlegendes Steuerelement zeichnet TRectangle sich selbst in seiner Paint-Methode durch Aufruf von FillRect und DrawRect auf die Zeichenfläche.
TCalloutPanel: Stilvereinbarungen
TCalloutPanel erweitert TPanel mit Eigenschaften für ein zusätzliches visuelles Callout-Element. Der Standardstil für TCalloutPanel ist praktisch identisch mit dem für TPanel und lautet ungefähr folgendermaßen:
object TCalloutRectangle
StyleName = 'calloutpanelstyle'
Width = 50
Height = 50
HitTest = False
Fill.Color = $FFffFFff
Stroke.Color = $FF8e8e8e
end
Anstelle eines TRectangle wird als Stil der obersten Ebene ein TCalloutRectangle verwendet, das ein Rechteck mit einer dreieckigen Spitze an einer Seite ist. Ansonsten sind genau dieselben Eigenschaften wie bei dem mit dem Stil versehenen Steuerelement vorhanden, mit dem es das Dreieck zeichnet. Die Zuordnung erfolgt mit der Methode ApplyStyle:
procedure TCalloutPanel.ApplyStyle;
var
Back: TFmxObject;
begin
inherited;
Back := FindStyleResource('Background');
if (Back = nil) and (ResourceLink is TCalloutRectangle) then
Back := ResourceLink;
if (Back <> nil) and (Back is TCalloutRectangle) then
begin
TCalloutRectangle(Back).CalloutWidth := FCalloutWidth;
TCalloutRectangle(Back).CalloutLength := FCalloutLength;
TCalloutRectangle(Back).CalloutPosition := FCalloutPosition;
TCalloutRectangle(Back).CalloutOffset := FCalloutOffset;
end;
end;
Nach der Zuordnung des Ressourcen-Link-Objekts wird ApplyStyle von ApplyStyleLookup und von jeder Methode zum Setzen weiterer Eigenschaften aufgerufen.Für TCalloutPanel wird von ApplyStyle entweder erwartet, dass:
- das Stammobjekt ein TCalloutRectangle ist, was für den Standardstil zutrifft; oder dass
- sich in der Komponentenstruktur für den Stil ein Objekt befindet, dessen StyleName "Background" ist und das ein TCalloutRectangle ist.
Wenn das richtige Objekt nicht gefunden wird, funktioniert TCalloutPanel nicht: die zusätzlichen Eigenschaften, die es deklariert, haben keinen Effekt.
Dies ist ein Beispiel einer Stilvereinbarung bei der die Komponenten, mit denen ein Stil für ein Steuerelement übernommen wird, bestimmten Erwartungen entsprechen müssen. Bei der Entwicklung von Komponenten, die spezielle Stilvereinbarungen wie diese erfordern, ist es wichtig, dass diese Vereinbarungen für andere Benutzer der Komponenten dokumentiert werden, damit sie geeignete Stile dafür entwickeln können.
TCalendar: Konstruierte Komplexität
TCalendar hat keinen Standardstil. Stattdessen erzeugt es sich in seinem Konstruktor selbst (der im Gegensatz zu dem von TPanel zu lang ist, um hier aufgenommen zu werden). Tatsächlich erstellt TCalendar die folgende Komponentenhierarchie:
- TLayout ganz oben
- Drei links positionierte TButton-Steuerelemente mit dem Stil "transparentcirclebuttonstyle" für:
- Den vorherigen Monat mit einem von einem TPath-Objekt gezeichneten nach links zeigenden Dreieck
- Den heutigen Tag mit einem von einem TEllipse-Objekt gezeichneten Kreis
- Den nächsten Monat mit einem von einem TPath-Objekt gezeichneten nach rechts zeigenden Dreieck
- TPopupBox für den Monat mit dem Stil "labelstyle", das Strings für die Monate des Jahres enthält und im Client-Bereich links neben den drei Schaltflächen angeordnet ist.
- TPopupBox für das Jahr mit dem Stil "labelstyle", das Strings für 10 zukünftige und 10 vergangene Jahreszahlen enthält und rechts außen positioniert ist.
- Drei links positionierte TButton-Steuerelemente mit dem Stil "transparentcirclebuttonstyle" für:
- TGridLayout oben positioniert
- Sieben TLabel-Steuerelemente für die Wochentage (Montag, Dienstag etc.)
- TGridLayout links außen, anfänglich unsichtbar, in der Größe einer einzelnen Spalte
- Sechs TLabel-Steuerelemente für Wochennummern, die von der Eigenschaft WeekNumbers angezeigt werden
- TListBox mit 7 Spalten oben positioniert mit dem Stil "transparentlistboxstyle" und AlternatingRowBackground
- 42 TListBoxItem-Steuerelemente für sechs Reihen für sechs Wochen
Für jedes Objekt in der Komponentenhierarchie ist die Eigenschaft Stored auf False und die Eigenschaft Locked auf True gesetzt. Durch Deaktivieren der Stored-Eigenschaft wird verhindert, dass das Objekt vom Formular-Designer in die .fmx-Datei geschrieben wird. Wenn die Stored-Eigenschaft nicht deaktiviert wäre, würden Unterkomponenten beim Laden redundant erstellt. Durch Aktivieren der Locked-Eigenschaft wird die Arbeitsweise des Treffertests und des Auslösens geändert, damit die Unterkomponente Teil eines größeren Gesamten wird.
Die relative Position aller Komponenten ist fest codiert, aber ihr Erscheinungsbild wird fast vollständig von Stilen gesteuert. Ausnahmen bilden die beiden Dreiecke und der Kreis in den drei Schaltflächen oben links. Den Schaltflächen selbst sind Stile zugewiesen. Die Standardstile der Popups zur Anzeige des Monats und des Jahres auf der rechten Seite wurden überschrieben, damit sie wie Beschriftungen (und nicht wie Schaltflächen) mit dem Standardbeschriftungsstil aussehen. Die Tage der Woche und die Wochennummern sind Instanzen von TLabel und verwenden diesen Beschriftungsstil automatisch. Das mehrspaltige Listenfeld, das die Tage des Monats anzeigt, verwendet Stile. Die einzelnen Tage-Steuerelemente schließlich übernehmen den Standardstil für Listenfeldeinträge.
Obwohl dafür kein Standardstil vorhanden ist, stellt sich die Frage, was geschieht, wenn die Eigenschaft Resource eines TCalendar gesetzt wird. Es wird wie immer die resultierende Stilressource als erstes untergeordnetes Element des Steuerelements gesetzt, wodurch es als Hintergrund gerendert wird. Daher können TCalendar als Ganzes bis zu einem gewissen Grad Stile zugeordnet werden.
Richtlinien für Komponenten
Zusammenfassung der Komponentenerstellung in FireMonkey:
- Verwenden Sie FireMonkey-Stile, damit das Aussehen von Anwendungsentwicklern geändert werden kann.
- Kapseln Sie direktes Zeichnen mit einem primitiven Steuerelement, das ausgetauscht oder für das eine Unterklasse erstellt werden kann.
- Stilvereinbarungen müssen dokumentiert werden.
- Komponenten werden am einfachsten über ihren StyleName gefunden, setzen Sie StyleName daher entsprechend.
- Komplexe Steuerelemente können programmseitig mit Komponenten mit Stilen erstellt werden.