用Flex开发移动应用(2)---- 添加“Hello World”

添加基本的界面元素

打开HelloWorldView.mxml,在</s:View> 前加入以下代码

<s:VGroup width="100%" height="100%" verticalAlign="middle" horizontalAlign="center">       
    <s:Label text="Hello, World!"/>
    <s:Button label="Continue" click="navigator.pushView(MyNewView)" styleName="next"/>   
</s:VGroup>


添加之后代码如图所示。在容器VGroup中,有一个label,文字是“Hello、World”,还有一个按钮,文字是“Contiune”,当按钮按下后,将出现一个新的View。Code to display the 'Hello World!' text on the screen


创建新的View
1、File > New > MXML Component,显示New MXML Component对话框
2、确认Source Folder是“HelloWorld/src”
3、Package输入“views”
4、Name输入“MyNewView”
5、Layout为None
6、Based on选择“spark.components.View”
如下图
Creating the MyNewView view


在新的View中设定UI元素
1、打开MyNewView.xml
2、同样,在</s:View>之前,加入以下代码

<s:VGroup width="100%" height="100%" verticalAlign="middle" horizontalAlign="center">
    <s:Label text="Success!" />
    <s:Button label="Back" click="navigator.popView()" styleName="back" />
</s:VGroup>


以下是最终的代码。在这个View里,有一个label,文本是Success,一个文字为Back的按钮。其代码将导致回到前一个View

Code to display the "Success!" text on the second screen


现在可以进行测试了



 

阅读更多
个人分类: Adobe
上一篇用Flex开发移动应用(1)---- 创建一个新的Mobile工程
下一篇用Flex开发移动应用(3)---- 在桌面和移动设备上测试
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭
关闭