在MXML文件中实现ActionScript逻辑的几种方法:
最简单的方法,在一个MXML文件中通过组件的事件直接书写简单的逻辑控制,但是并不推荐。
<mx:Application xmlns:mx='http://www.macromedia.com/2003/mxml'>
<mx:Panel title='My Application' >
<mx:HBox>
<mx:Label text='Temperature in Farenheit:'/>
<mx:TextInput id='farenheit' width='120'/>
<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>
第二种,在MXML文件中定义函数调用,比较适合简单的应用,如
<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' >
<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>
第三种,把MXML文件和脚本文件分开,便于项目管理
<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' >
<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>
sample.as文件代码如下:
function calculate() {
celsius.text=(farenheit.text-32)/1.8;
}
第四种,使用MXML组件方式,更好的封装实现。下面的例子定义了一个tempConverter组件
<mx:Application xmlns:mx='http://www.macromedia.com/2003/mxml'
initialize='converter.setupListener()'>
<local:TempConverter id='converter' xmlns:local='*'/>
<mx:Panel title='My Application' >
<mx:HBox>
<mx:Label text='Temperature in Farenheit:' />
<mx:TextInput id='farenheit' width='120' />
<mx:Button id='myButton' label='Convert' />
<mx:Label text='Temperature in Celsius:' />
<mx:Label id='celsius' width='120' fontSize='24' />
</mx:HBox>
</mx:Panel>
</mx:Application>
TempConverter.as文件代码如下:
class TempConverter implements mx.core.MXMLObject{
public var view;
function initialized(doc : Object, id : String) : Void {
view = doc;
}
function setupListener() : Void {
view.myButton.addEventListener('click', this);
}
function click(event) {
view.celsius.text=(view.farenheit.text-32)/1.8;
}
}
posted on 2006-04-29 13:40
blog搬家了--[www.ialway.com/blog] 阅读(297)
评论(0) 编辑 收藏 所属分类:
Flex