注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

IOS & JAVA KEY

(iMilo)

 
 
 

日志

 
 
关于我

All the splendor in the world is not worth a good friend!! Hello my friend!!

网易考拉推荐

Flex4数据绑定  

2010-04-28 21:11:14|  分类: Flex4 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

1、  建立一个Flex project名称为demo

2、  打开src下的默认包中的demo.mxml文件首先切换到Design视图下:

     ①     在Components窗口下的Layout找到Form添加到设计视图中;

     ②     在Components窗口下的Layout找到FormHeading添加到①的Form中,其中label属性为Person Information;

     ③     在Components窗口下的Controls找到TextInput添加三个岛①Form中,其中label属性分别为First Name:、Last Name:、Email:

3、  下面进行数据绑定操作;

4、  将demo.mxml切换到source视图下,为步骤2中的③的三个TextInput的<s:TextInput>添加属性分别为 id=”firstName”,id=”lastName”,text=”{firstName}.{lastName}@teana.com”这样就完成了数据绑定

5、  在package Explorer下找到demo.mxml文件,右击选择Run AsàWeb Application,即可看到效果,即:在FirstName、LastName 中输入文本,自动生成Email

设计界面如下:

 Flex4数据绑定 - TEANA - JAVA KEY

代码如下:

<?xml version="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

                  xmlns:s="library://ns.adobe.com/flex/spark"

                  xmlns:mx="library://ns.adobe.com/flex/mx"

                  minWidth="1024" minHeight="768"

                  backgroundColor="#72F512" backgroundAlpha="1.0"

                  preloaderChromeColor="#CCCCCC">

<s:layout>

        <s:BasicLayout/>

</s:layout>

<fx:Declarations>

        <!-- Place non-visual elements (e.g., services, value objects) here -->

</fx:Declarations>

<mx:Form horizontalCenter="-300" verticalCenter="-142">

        <mx:FormHeading label="Person Information" color="#F50E0E" textAlign="left"/>

        <mx:FormItem label="First Name:">

               <s:TextInput id="firstName" />

        </mx:FormItem>

        <mx:FormItem label="Last Name:">

               <s:TextInput id="lastName" />

        </mx:FormItem>

        <mx:FormItem label="Email:">

               <s:TextInput text="{firstName.text}.{lastName.text}@teana.cn"/>

        </mx:FormItem>

</mx:Form>

</s:Application>

最终运行效果如下:

 Flex4数据绑定 - TEANA - JAVA KEY

说明:在<s:TextInput>上设置id 然后用{id}绑定

  评论这张
 
阅读(1347)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017