flex:创建您的第一个应用程序HelloWorld

MXML 文件是普通的 XML 文件, 所以可以选择多种开发环境。 简单的文件编辑器、专用的 XML 编辑器或者支持文本编辑的集成开发环境 (IDE) 均可用于 MXML 代码编写。 Flex 提供专用的 IDE, 称为 Adobe® Flex™ Builder™ 2, 您可以使用它来开发应用程序。

MXML 文件的第一行是 XML 声明。 此行必须成为每个 MXML 文件的第一行。

下一行是 <mx:Application> 标签, 它定义始终是 Flex 应用程序的根标签的 Application 容器。

<mx:Panel> 标签定义包含一个标题栏、一个标题、一条状态消息、一个边框和其子级的一个内容区域的 Panel 容器。 其 title 属性被设置为 "My Application"。

<mx:Label> 标签代表一个 Label 控件, 一个用于显示文本的非常简单的用户界面组件。 其 text 属性被设置为 "Hello, World!"。

<mx:Label> 标签的 fontWeight 和 fontSize 属性改变使用的字体的样式。 还可以使用 CSS 来设置组件的样式。 有关详细信息, 请参阅 Flex 2 开发人员指南*中的“使用层叠样式表 (CSS)”。

注意: 可以通过使用命令行编译器 mxmlc 或 Flex Builder 2 编译 Flex 应用程序。有关使用 mxmlc 编译应用程序的说明, 请参阅使用 MXML 和 ActionScript 进行编码教程。

示例

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

 

<mx:Application

    xmlns:mx="http://www.adobe.com/2006/mxml"

    viewSourceURL="src/HelloWorld/index.html"

    horizontalAlign="center" verticalAlign="middle"

    width="300" height="160"

> 

    <mx:Panel

        paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10"

        title="My Application" 

    >

 

        <mx:Label text="Hello World!" fontWeight="bold" fontSize="24"/>

    </mx:Panel>

</mx:Application>

结果

若要查看全部源代码, 请右键单击 Flex 应用程序并从上下文菜单中选择“查看源代码”。

D:/flex学习/HelloWorld/ HelloWorld.mxml