flex基础(2)

原创 2007年10月04日 16:39:00

创建应用程序

在这个简单的购物车中,我们显示一个咖啡品牌的列表(类似于HTML的select)。使用数据绑定功能在下面显示当前选择的品牌的说明,还有一个添加到购物车的按钮,当按钮被按下后,该品牌的咖啡便会被添加到购物列表中。

图1. 教程创建的Flex应用程序

这个教程的目的是为了学习使用:

Application (应用程序)类
Panel (面板)容器
Script (脚本)元素
Array (数组)元素
Object (对象)元素
Label (标签)元素
Text (文本框)元素
Button (按钮)控件
ComboBox (下拉列表)控件
List (列表)控件
一个ActionScript函数


创建Application(应用程序)对象

任何一个Flex程序都是以XML声明开始和Application标记的。Application标签包含一个MX类库命名空间的声明:xmlns:mx="http://www.macromedia.com/2003/mxml" 。引用该类库的所有标签必须以mx作为前缀。

1. 创建一个新文件 ,然后保存为 firstapp.mxml,位于flex_tutorials目录下
2. 在文件的开始处,插入XML声明:
<?xml version="1.0"?>
3. 在XML声明后,添加带命名空间的Application标签:
<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml">
</mx:Application>

应用程序布局:添加一个面板

通常你可以将Flex应用程序中可见的组件放置于容器中,容器提供了绑定文本、控件、图像和其他媒体类型的元素。在这里,你可以使用称为“面板”(Panel)的容器,它可以提供大部分应用程序需要的全部外壳。你还可以使用面板的title(标题)属性,修改面板上方自动包含着的标题榄的文字。

4. 在Application标签内部,添加一个Panel标签,title属性为"my First Flex App"

<mx:Panel title="My First Flex App">
</mx:Panel>

添加一个显示标题的Label元素

Label元素可以用来显示单行文本。它有一些属性,这里用到的是text(文本)属性,定义Label显示的内容。

5. 在Panel标签内,插入一个带有文本属性的Label标签,如下:<mx:Label text="Coffee Blends"/>

6. 保存文件,预览一下程序

 

Flex基础培训-2-数据与事件

  • 2014年04月25日 21:48
  • 3.85MB
  • 下载

Flex之旅:第一部分:flex必备基础知识积累(2)---自定义事件以及事件数据传递

自定义事件以及事件数据传递 为什么要自定义事件? 一个页面,肯定是有许许多多的components组成的;为了方便管理和复用,我们要按照逻辑划分,把一个页面划分成多个小的页面。页面a和页...
  • miqi770
  • miqi770
  • 2015年03月06日 18:01
  • 757

Flex学习笔记[2] - Flex 编程基础

Flex 编程基础 面向对象的编程 在上面 Hello World 的例子中我们可以看出,就像在 HTML 中嵌入 JavaScript 那样,我们可以在 mxml 里面嵌入 Action...

原创:新手布局福音!微信小程序使用flex的一些基础样式属性

来源:新手布局福音!微信小程序使用flex的一些基础样式属性 作者:Nazi Flex布局相对于以前我们经常所用到的布局方式要好的很多,在做微信小程序的时候要既能符合微信小程序的文档开发要求,又能...
  • AAASai_
  • AAASai_
  • 2016年12月06日 15:48
  • 4840

移动Web开发基础-flex弹性布局(兼容写法)

前言前面我们已经分享过一篇 移动Web开发基础-百分比+flex布局方案 只是大概讲了下这种布局适配方案的思路,后面我们也通过分享 移动Web开发基础-比例盒子 让大家对百分比布局中比较常用的等比缩放...

Flex4学习笔记(一)--基础控件的使用

1.一个最简单的例子,按钮点击事件 ? 1 2 3 4 5 6 7 8 9 10 11 12 ...

一些flex技术开发的基础入门知识

学习flex技术开发有别于学习其他的软件或者是操作系统知识内容,因为flex开发本身是既涉及到了flex技术的一些专业知识内容,但是同时又和相关的一些软件操作有一定的关联。而要想使得自己在完成flex...

移动Web开发基础-百分比+flex布局方案

前言移动端适配是一个非常繁琐的问题,当然,只要掌握了一些基础的布局方式之后,适配问题也不再是大问题。其实也没有非常死板的适配方案,一般实际开发过程中也是根据项目实际情况采取不同的适配方案或者混合使用几...

在Android程序上以AIR为基础创建你的第一个 Flex

Adobe Flash Builder 4 简体中文正式版 Windows版点击下载:http://g.csdn.net/5134151Adobe Flash Builder 4 简体中文正式版 Ma...
  • lihe111
  • lihe111
  • 2011年01月10日 18:11
  • 1030

AS3 Flex基础知识100条

【改变输出swf的尺度,背景颜色或帧频】 在”Navigator”窗框里右键你的项目>选中”Properties”>选中”ActionScript Compiler”>在”Additional c...
  • sjz168
  • sjz168
  • 2011年07月29日 16:17
  • 1028
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:flex基础(2)
举报原因:
原因补充:

(最多只允许输入30个字)