Wie Sie das Thema eines Link-Button auf Halo mit ActionScript festlegen

Flex Builder ist ein Web-Design und Entwicklung-Software zur Erstellung von Rich Internet Applications. XML und ActionScript sind die beiden primären Sprachen in Flex verwendet. XML wird die Struktur der Website und ActionScript stellt die Funktionalität. Ein Entwickler wird XML und ActionScript verwenden, um eine Verknüpfungsschaltfläche mit einem Halo-Effekt zu erstellen. Mit ein paar einfachen Codezeilen können Sie den gesamten Prozess abschließen. Der Entwickler kann auch den Effekt mit verfügbaren Eigenschaften innerhalb der Flex Builder-Bibliothek anpassen.

Anweisungen

Die Linkschaltfläche erstellen

1 Öffnen Sie Ihre wichtigste Flex-Anwendung zu, und wechseln Sie zur Codeansicht. Platzieren Sie den Start- und Endtag für die Linkschaltfläche in Ihrer Flex-Anwendung:

< Mx:LinkButton >< / Mx:LinkButton >

2 Legen Sie den Stil Ihrer Link-Taste und fügen Sie den entsprechenden Text. Platzieren Sie die Schaltfläche Verknüpfungseigenschaften im offenen Tag des Link-Taste.

< Mx:LinkButton Bezeichnung = "Meine Link-Button" Farbe "0000FF" = >< / Mx:LinkButton >

Der obige Code erstellt eine Verknüpfungsschaltfläche mit blauem Text, der liest "Meine Link-Button."

3 Importieren Sie die Warnung der ActionScript-Klasse. Fügen Sie die Importanweisung nach der Eröffnung Anwendung Tag und vor Ihrer Link-Taste:

< Fx:Script >Import mx.controls.Alert;< / Fx:Script >

Der obige Code kann Flex weiß, dass Sie innerhalb der Anwendungsdatei ActionScript Einbindung sind. Es gibt Ihnen auch Zugriffe auf die Funktionalität innerhalb der Alert-Klasse.

4 Führen Sie die Anwendung. Standardmäßig wird eine Verknüpfungsschaltfläche den Halo-Effekt produzieren, sobald der Benutzer über den Hyperlinktext bewegt. Überprüfen Sie, ob Sie ein Button-Steuerelement arbeiten Verknüpfung mit einem Halo-Effekt haben.

Erstellen eines Funke Link Button Designs

5 Erstellen Sie die Haut für Ihre Flex Zündkerzen-Link-Taste. Flex verwendet mehrere Arten von Komponenten. Einzigartige Stile können auf Spark-Link-Buttons angewendet werden. Öffnen Sie eine neue Funke Skin-Datei oder eine vorhandene Spark Skin-Datei. Wenn Sie neu bei Spark-Komponenten sind, finden Sie eine Dateivorlage Spark Haut durch Ihre Funke-Ordner "Programme" öffnen.

6 Ersetzen Sie Funken Haut Starttag, durch die folgende Codezeile:

< S:SparkSkin Xmlns:fx = "http://ns.adobe.com/mxml/2009 & Quot; Xmlns:s = "library://ns.adobe.com/flex/spark" Xmlns:mx = "library://ns.adobe.com/flex/halo" >

Fügen Sie den folgenden Metadta Informaiton unterhalb des Opeing-Tags.

< Fx:Metadata >

[HostComponent("spark.components.Button")]

< / Fx:Metadata >

7 Fügen Sie Code, der den Stil Ihrer Verknüpfung Knopf Halo definieren.

< S:states >

<mx:State name="up"/> <mx:State name="down"/> <mx:State name="over"/> <mx:State name="disabled"/> </s:states>

Der obige Code benennt die verschiedenen Verknüpfung Schaltflächenzustände, so dass Sie darauf zugreifen und Formatvorlage später.

<s:Rect left="0" right="0" top="0" bottom="0"> </s:Rect>

Dieser Code erstellt einen Rechteck-Halo und definiert seine Platzierung im Verhältnis zu dem Link.

< S:Rect Links = "0" "0" oben rechts = = "0" unten = "0" fallenden = "über" RadiusX = "15" radiusY = "15" >

<s:stroke> <mx:SolidColorStroke weight="3" color="0x6600FF"/> </s:stroke>

< S:fill >

<mx:SolidColor color="0x6600FF"/> </s:fill> </s:Rect>

Die Stroke-Eigenschaft oben wird ein 3-Pixel-Gewicht Strich um ein lila Rechteck erstellt. Dadurch wird den Halo-Stil.

8 Fügen Sie den Code für den Spark-Button:

< S:Button Id = "SparkBtn" skinClass="theFolderNameWhereYourSkinIsSaved.TheNameofTheSkinFile" Bezeichnung = "TheBtnTitle" / >

Der obige Code erstellt eine Spark-Schaltfläche mit dem Stil, den Sie gerade erstellt mit der Bezeichnung "TheBtnTitle."

Tipps & Warnungen

• Flex-XML und ActionScript sind Groß-/Kleinschreibung beachtet. Wenn Ihre Anwendung nicht richtig funktioniert, überprüfen Sie Großschreibung.