Dagens FBFC: Libray og Difinition tag


Byg Graphic Libraries med MXML i MMXL

Dagens Gumbo kigger på det nye Libray tag.

Intro

Library tagget i Flex 4 giver mulighed for at bygge grafiske komponenter inde i din MXML fil.
Det er i særdeleshed tiltænkt til brug for at kunne bygge grafiske komponenter med de nye deklarative grafik tags.

Libray tagget består af ingen eller flere Definition tags. Hvert Definition tag definere et komponent i biblioteket.

Det er vigtigt at bemærke at når man deklarere et komponent i Librariet med et Definition tag, instantieres der ikke et komponent.

Library tagget *skal* være det første tag i et givent MXML komponent, eller application.

Eksempel

<?xml version="1.0" encoding="utf-8"?>
<FxApplication xmlns="http://ns.adobe.com/mxml/2009" minWidth="1024" minHeight="768">
 
	<Library>
		<Definition name="MyGraphic">
			<Group>
				<Rect width="200" height="200">
					<stroke>
						<SolidColorStroke color="red"/>
					</stroke>
				</Rect>
			</Group>
		</Definition>
	</Library>
 
 
	<VBox>
		<MyGraphic />
	</VBox>
</FxApplication>

I eksemplet her laver vi en ny grafisk komponent type, vi kalder for MyGraphic.
Videre instantisere vi et instans af vores nye komponent i en VBox.
-> først her instantieres vores komponent.

Hurra-Viden

Teknisk set er der lavet en ny AS3 klasse, ved navn MyGraphic. Det første tag i Difinition tagget, i eksemplet her Group, bliver Super klasse for den genererede AS3 klasse.

Eksempel 2

Der er ikke begrænsning til at det skal være Graphic eller Group komponenter der konstrueres i Library.

<?xml version="1.0" encoding="utf-8"?>
<FxApplication xmlns="http://ns.adobe.com/mxml/2009" minWidth="1024" minHeight="768">
 
	<Library>
		<Definition name="MyGraphic">
			<Group>
				<Rect width="200" height="200">
					<stroke>
						<SolidColorStroke color="red"/>
					</stroke>
				</Rect>
			</Group>
		</Definition>
		<Definition name="MyLogo">
		<VBox>
			<Label text="FlashForum.dk" />
			<Image source="http://flashforum.dk/sites/all/themes/flashforum/images/logo-print.png" />
		</VBox>
		</Definition>
	</Library>
 
	<VBox>
		<MyLogo />
		<MyLogo />
		<MyLogo />
		<MyLogo />
		<MyGraphic />
	</VBox>
</FxApplication>

Running Code

Herunder er den endelige .swf hvor du kan se at vores elementer fra Biblioteket er blevet instantiseret.

Beklager, du har ikke den krævede version af Flash Player. Du kan hente den fra http://www.adobe.com/go/getflash/

Asger Laursen
Developer / Technical Architect
Company: www.webyte.dk | Blog: www.asgerlaursen.com |Twitter: www.twitter.com/Flashger

Om forfatteren
User picture

Asger er til dagligt Technical Architect hos webyte i Århus, hvor han arbejder med Rich Internet Application arkitektur med særlig vægt på Flash Platformen, med Flash Player og AIR runtime på klient siden, og BlazeDS/LCDS på server siden. Asger er Certificeret Flex og AIR expert, Dansk Adobe User Group Manager samt Dansk Adobe Community Expert.