Anpassen der ProgressBar-Komponente

Stile und die ProgressBar-Komponente
Skins und die ProgressBar-Komponente

ProgressBar-Komponenten können sowohl beim Authoring als auch zur Laufzeit horizontal und vertikal transformiert werden. Beim Authoring wählen Sie hierzu die Komponente auf der Bühne aus und verwenden anschließend das Werkzeug „Frei transformieren“ oder die Befehle unter „Modifizieren“ > „Transformieren“. Zur Laufzeit verwenden Sie die Methode setSize() oder die entsprechenden Eigenschaften der ProgressBar-Klasse, zum Beispiel height und width , scaleX und scaleY .

Eine ProgressBar-Komponente hat drei Skins: je eine für Fortschritt, Leiste und den unbestimmten Zustand. Für die Skalierung der Elemente wird Scale-9 verwendet.

Stile und die ProgressBar-Komponente

Durch Zuweisen von Stileigenschaften können Sie die Gestaltung einer ProgressBar-Instanz ändern. Die ProgressBar-Stile legen die Werte für die Skins und Auffüllung beim Zeichnen der Komponente fest. Im folgenden Beispiel wird gezeigt, wie Sie eine ProgressBar-Instanz vergrößern und ihren barPadding-Stil festlegen.

Erstellen Sie eine neue FLA-Datei.
Ziehen Sie die ProgressBar-Komponente aus dem Bedienfeld „Komponenten“ auf die Bühne und nennen Sie die Instanz myPb .
Klicken Sie auf Bild 1 der Hauptzeitleiste und geben Sie im Bedienfeld „Aktionen“ den folgenden Code ein:
```
myPb.width = 300; 
myPb.height = 30; 
 
myPb.setStyle("barPadding", 3);
```
Wählen Sie „Steuerung“ > „Film testen“.

Weitere Informationen zum Festlegen von Skin-Stilen finden Sie unter Überblick über Skins .

Skins und die ProgressBar-Komponente

Die Skins der ProgressBar-Komponente zeigen den Fortschritt, die abgeschlossene Leiste und einen unbestimmten Zustand, wie in der folgenden Abbildung dargestellt.

ProgressBar-Skins

Die Leiste wird über der Fortschritt-Skin platziert, wobei die Position mithilfe der barPadding-Eigenschaft bestimmt wird. Für die Skalierung der Elemente wird Scale-9 verwendet.

Die unbestimmte Leiste wird verwendet, wenn die Eigenschaft indeterminate der ProgressBar-Instanz auf true gesetzt wurde. Die Größe der Skin wird vertikal und horizontal geändert, um sie an die Größe der ProgressBar-Komponente anzupassen.

Sie können diese Skins bearbeiten, um die Darstellung der Fortschrittsleiste zu ändern. Im folgenden Verfahren wird beispielsweise die Farbe der Leiste für den unbestimmten Zustand geändert.

Erstellen Sie eine neue FLA-Datei.
Ziehen Sie eine ProgressBar-Komponente auf die Bühne und doppelklicken Sie darauf, um das Fenster mit den Skinsymbolen zu öffnen.
Doppelklicken Sie auf die Skin der unbestimmten Leiste.
Stellen Sie die Vergrößerung auf 400 % ein, um das Symbol besser bearbeiten zu können.
Doppelklicken Sie auf einen der diagonalen Streifen, halten Sie die Umschalttaste gedrückt und klicken Sie auf die anderen Streifen. Die aktuelle Farbe wird in der Farbauswahl „Füllung“ im Eigenschafteninspektor angezeigt.
Klicken Sie im Eigenschafteninspektor auf die Farbauswahl „Füllung“, um sie öffnen, und wählen Sie die Farbe #00CC00 aus, um sie für die ausgewählten diagonalen Streifen zu verwenden.
Klicken Sie links neben der Bearbeitungsleiste über der Bühne auf „Zurück“, um zum Dokumentbearbeitungsmodus zurückzukehren.
Wählen Sie „Steuerung“ > „Film testen“.

Die ProgressBar-Komponente sollte jetzt wie in der folgenden Abbildung aussehen.