
Techniques for separating ActionScript from MXML
55
<mx:Button label="Convert"
click="celsius.text=(farenheit.text-32)/1.8;"
/>
<mx:Label text="Temperature in Celsius:"/>
<mx:Label id="celsius" width="120" fontSize="48"/>
</mx:HBox>
</mx:Panel>
</mx:Application>
One MXML document (function call in MXML tag event)
The logic for the function is inside an
<mx:Script>
block in the MXML document, and is called
from the MXML tag’s
click
event, as the following code shows:
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml">
<mx:Script>
<![CDATA[
function calculate() {
celsius.text=(farenheit.text-32)/1.8;
}
]]>
</mx:Script>
<mx:Panel title="My Application" marginTop="10" marginBottom="10"
marginLeft="10" marginRight="10" >
<mx:HBox>
<mx:Label text="Temperature in Farenheit:"/>
<mx:TextInput id="farenheit" width="120"/>
<mx:Button label="Convert"
click="calculate();"
/>
<mx:Label text="Temperature in Celsius:"/>
<mx:Label id="celsius" width="120" fontSize="48"/>
</mx:HBox>
</mx:Panel>
</mx:Application>
One MXML document and one ActionScript file
The function call is in an MXML tag event, and the function is defined in a separate ActionScript
file, as the following code shows:
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml">
<!-- Specify the ActionScript file containing the function. -->
<mx:Script source="sample3script.as"/>
<mx:Panel title="My Application" marginTop="10" marginBottom="10"
marginLeft="10" marginRight="10" >
<mx:HBox>
<mx:Label text="Temperature in Farenheit:"/>
<mx:TextInput id="farenheit" width="120"/>
<mx:Button label="Convert"
click="calculate();"
/>
<mx:Label text="Temperature in Celsius:"/>
<mx:Label id="celsius" width="120" fontSize="48"/>
Summary of Contents for FLEX-GETTING STARTED WITH FLEX
Page 1: ...Getting Started with Flex...
Page 4: ...4 Contents...
Page 22: ...22 Chapter 1 Introducing Flex...