Flex Property Bag Class – Cascading Property Sheets v2.0.1

Santa has brought you a Christmas gift. The Property Bag class.

If you’ve ever had numerous components on your stage that all shared the same styles using CSS really saved you time. One of things CSS does well is apply styles. But what if many of the components shared the same properties? A property on many components is rowHeight. This is not a style but a property. So you cannot use a style sheet to set it. So what if in your app you had ten list components that all had the same properties. For example, width=150 and rowHeight=18. You would have to apply these properties to each component instance. Its a little extra work. But if you only do it once its not so bad. Now what if you were told to change one of those properties across the board. Now all of a sudden you have to change it in 9 different places. It is slowly starting to eat up much of your development time.

Enter the Property Bag class. This class will allow you to set properties in style sheets like you set styles in style sheets. You define a class selector with properties in it and those properties get applied to your component. This has save me loads of time already. View the Demo.

To use it you add the PropertyBag.as class into your project.

In a style sheet class selector in your Application file define your properties.

.myProperties {
	rowHeight:18;
	verticalAlign:"middle";
	verticalScrollPolicy:"off";
	width:200;
	x:20;
}

Note: You can mix in styles but you should use a separate class selector if you have a lot of them.

Apply them to your component in the initialize event.

The first parameter is the event object. This is used to get a reference to the Component instance. The second parameter is the name of the class selector (minus the starting period). View the Demo. Right-click on the demo to view the source code and zip file.

These are not really “cascading” in application but neither are 90% of styles. The name is merely to convey an understanding. I hope you enjoy.

PS This Christmas gift is brought to you courtsey of Michael Schmalle and myself. Be sure to thank him as well. 🙂