Flex学习笔记_04 MXML语言简介(转)
2009年12月25日
转自:Flex学习笔记_04 MXML语言简介关键字: flex[b]1. MXML语法[/b]
MXML语言是专门用于Flex程序中,描述界面表现的一中XML标记语言。我们可以用它来管理程序的整体布局,控制组件的样式和外观,也可以构建非可视化的对象,比如XML数据、与服务器端通信的WebService、组件的数据源等。
[b] 1.1 命名规范[/b]
MXML区分大小写,且文件名和变量标示名都区分大小写。
MXML文件以mxml作为扩展名,文件名要遵循AS中变量的命名规则。
所有的MXML都被视为用户自定义的组件,相当于对象,可以使用代码动态创建。
变量名必须以字母或下划线开始,且只能包含字母、数字和下划线。
不能命名为[b]application [/b],[b]application [/b]是主程序文件的默认标记,不可再使用。
程序不能使用“mx”做为目录名,mx 是官方组件库的命名空间。
[b]2.2 MXML 文件结构[/b]
MXML为标准的XML文件。
我们以一个MXML文件来说明:
Xml代码
Flex之旅'; } ]]> 第一行声明XML文件采用的语法版本version 和编码格式encoding(默认为utf-8)。
mx:Application:在每个Flex项目中,可能有多个MXML文件,mx:Application为根节点标示程序入口的运行文件。
xmlns:mx=http://www.adobe.com/2006/mxml :将mx定义为XML的命名空间,对应路径为http://www.adobe.com/2006/mxml ,Flex的配置文件中将这个路径定义为一个全局资源标识符,并对应了一个列出mx命名空间下的所有标签的文件。flex-config.xml中配置了命名空间。该文件可在Flex Builder2的安装路径下的Flex SDK 2\frameworks目录中找到。并找到如下代码。
Xml代码
manifest of components for use as MXML --> http://www.adobe.com/2006/mxml mxml-manifest.xml 从上面的配置发现,http://www.adobe.com/2006/mxml 这个URI和mxml-manifest.xml文件对应,找到该文件,里面列出了所有标签和与标签相关联的类文件路径。
Xml代码
.................... ....................
中的id代表标签名,class表示类文件路径。
xmlns:comp="comps.*" 定义一个命名空间,因为使用了通配符“*”,comps目录下的所有MXML和AS类(不包括子目录的文件)都被包括在comp命名空间下。如comps下有Login.mxml,则在程序中可这样调用:
Application 还有一个属性layout ,定义了该节点下元素的布局方式,也就是程序的总体布局方式。absolute 表示绝对定位,所有子元素将按照各自的x、y坐标来定位。
[b]2. 使用组件[/b]
定义一个按钮组件
如果组件中未包含其他子元素可这样写:
组件分类:
布局类: 包括所有的容器组件,如:HBox、Panel等,Spacer、HRule、VRule不是容器,但是主要用于布局。
导航类: 菜单条、按钮条等各种导航功能的组件。
交互类: 内容展示、数据交互相关组件,如:按钮、下拉框、图片、视频等。
IDE中的组件面板列出了所有的可视化组件, 可直接拖入编辑区使用。
通过IDE的代码提示输入Flex的一个特色,程序中所有的MXML和AS类文件,都被当作用户自定义的组件。
我们来建一个MXML组件:
New->MXML Component
在弹出的窗口输入组件的文件名Filename,并选择扩展哪一种组件Based on,我们这里选择Image对象。然后Finish。
然后点击Image组件,在属性面板的Source属性设置图片的路径。
Xml代码
然后在程序中就可以使用该自定义的组件,将其从用户面板拖入到编辑区,图片显示正常。
Xml代码
Flex之旅'; } } ]]>
就是我们拖入的自定义组件,程序自动添加了ns1命名空间。我们改变自定义组件的位置放到view文件夹,代码变成:
[b]
[/b]
2009年12月25日
转自:Flex学习笔记_04 MXML语言简介关键字: flex[b]1. MXML语法[/b]
MXML语言是专门用于Flex程序中,描述界面表现的一中XML标记语言。我们可以用它来管理程序的整体布局,控制组件的样式和外观,也可以构建非可视化的对象,比如XML数据、与服务器端通信的WebService、组件的数据源等。
[b] 1.1 命名规范[/b]
MXML区分大小写,且文件名和变量标示名都区分大小写。
MXML文件以mxml作为扩展名,文件名要遵循AS中变量的命名规则。
所有的MXML都被视为用户自定义的组件,相当于对象,可以使用代码动态创建。
变量名必须以字母或下划线开始,且只能包含字母、数字和下划线。
不能命名为[b]application [/b],[b]application [/b]是主程序文件的默认标记,不可再使用。
程序不能使用“mx”做为目录名,mx 是官方组件库的命名空间。
[b]2.2 MXML 文件结构[/b]
MXML为标准的XML文件。
我们以一个MXML文件来说明:
Xml代码
Flex之旅'; } ]]> 第一行声明XML文件采用的语法版本version 和编码格式encoding(默认为utf-8)。
mx:Application:在每个Flex项目中,可能有多个MXML文件,mx:Application为根节点标示程序入口的运行文件。
xmlns:mx=http://www.adobe.com/2006/mxml :将mx定义为XML的命名空间,对应路径为http://www.adobe.com/2006/mxml ,Flex的配置文件中将这个路径定义为一个全局资源标识符,并对应了一个列出mx命名空间下的所有标签的文件。flex-config.xml中配置了命名空间。该文件可在Flex Builder2的安装路径下的Flex SDK 2\frameworks目录中找到。并找到如下代码。
Xml代码
manifest of components for use as MXML --> http://www.adobe.com/2006/mxml mxml-manifest.xml 从上面的配置发现,http://www.adobe.com/2006/mxml 这个URI和mxml-manifest.xml文件对应,找到该文件,里面列出了所有标签和与标签相关联的类文件路径。
Xml代码
.................... ....................
中的id代表标签名,class表示类文件路径。
xmlns:comp="comps.*" 定义一个命名空间,因为使用了通配符“*”,comps目录下的所有MXML和AS类(不包括子目录的文件)都被包括在comp命名空间下。如comps下有Login.mxml,则在程序中可这样调用:
Application 还有一个属性layout ,定义了该节点下元素的布局方式,也就是程序的总体布局方式。absolute 表示绝对定位,所有子元素将按照各自的x、y坐标来定位。
[b]2. 使用组件[/b]
定义一个按钮组件
如果组件中未包含其他子元素可这样写:
组件分类:
布局类: 包括所有的容器组件,如:HBox、Panel等,Spacer、HRule、VRule不是容器,但是主要用于布局。
导航类: 菜单条、按钮条等各种导航功能的组件。
交互类: 内容展示、数据交互相关组件,如:按钮、下拉框、图片、视频等。
IDE中的组件面板列出了所有的可视化组件, 可直接拖入编辑区使用。
通过IDE的代码提示输入Flex的一个特色,程序中所有的MXML和AS类文件,都被当作用户自定义的组件。
我们来建一个MXML组件:
New->MXML Component
在弹出的窗口输入组件的文件名Filename,并选择扩展哪一种组件Based on,我们这里选择Image对象。然后Finish。
然后点击Image组件,在属性面板的Source属性设置图片的路径。
Xml代码
然后在程序中就可以使用该自定义的组件,将其从用户面板拖入到编辑区,图片显示正常。
Xml代码
Flex之旅'; } } ]]>
就是我们拖入的自定义组件,程序自动添加了ns1命名空间。我们改变自定义组件的位置放到view文件夹,代码变成:
[b]
[/b]