Creating widgets fast and easily with SPAS 3.0 - Page 2

Page 2

The default layout for SPAS 3.0 containers is an horizontal flow layout. If you combine the default layout with the autoHeight property set to true, the UIContainer object automatically adapts its height if there is no more enough width for displaying the next object in the display list. By the way, we set the padding, horizontalGap and verticalGap properties to 10 pixels.

private function initialize():void {
	autoHeight = true;
	padding = horizontalGap = verticalGap = 10;
}

Now, what about adding controls? The first control we need is the text input where the user can type the temperature to convert. We declare this object as a private variable to allow it access into the scope of the CelsiusConverter object. Then we create a new instance of the TextInput class with 0 (zero) as default parameter:

private var _input:TextInput;
private function initialize():void {
	autoHeight = true;
	padding = horizontalGap = verticalGap = 10;
	_input = new TextInput("0");
}

The user mustn't type characters other than numeric values, and the number's size cannot exceed 5 characters. So we use the maxChars and restrict properties of the TextInput class to do that. Add the following lines of code below the TextInput instance declaration:

_input.maxChars = 5;
_input.restrict = "0-9";

The next control is a simple label object where the result of the conversion will be displayed. This control must be accessible from the internal scope, like the preceding one. Once we have declared the private variable for this control, we create the corresponding Label instance as detailed below.

private var _result:Label;
private var _input:TextInput;
private function initialize():void {
	autoHeight = true;
	padding = horizontalGap = verticalGap = 10;
	_input = new TextInput("0");
	_input.maxChars = 5;
	_input.restrict = "0-9";
	_result = new Label("fahrenheit");
}