`

ApplicationControlBar组件及creationComplete

    博客分类:
  • FLEX
阅读更多

1.flex加载完成后,可以调用方法,包括httpservice或urlloader等

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
	creationComplete="catRPC.send()">
	<mx:Script>
		<![CDATA[
			import mx.rpc.events.ResultEvent;

			private function resultHandler(event:ResultEvent):void{
				//dosomething
			}

		]]>
	</mx:Script>

	<mx:HTTPService id="catRPC"
		url="http://www.flexgrocer.com/category.xml"
		result="resultHandler(event)"/>
</mx:Application>

 2.ApplicationControlBar组件的dock属性有true或false两个值,为true的时候是停靠模式,在application的上方不会随滚动条上下移动。ApplicationControlBar里可以包含Button,CombBox,MenuBar.通常将applicationControlBar放在容器的顶部。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
	xmlns:v="views.dashboard.*"
	layout="horizontal"
	creationComplete="catRPC.send()">
	<mx:Script>
		<![CDATA[
			import mx.collections.ArrayCollection;
			import mx.rpc.events.ResultEvent;

			[Bindable]
			private var categories:ArrayCollection=new ArrayCollection();

			private function catHandler(event:ResultEvent):void{
				categories = event.result.catalog.category;
				var catObj:Object = new Object();
				catObj.name = "All";
				catObj.categoryID = 0;
				categories.addItemAt(catObj, 0);
				catCombo.selectedIndex = 0;
			}

		]]>
	</mx:Script>

	<mx:HTTPService id="catRPC"
		url="http://www.flexgrocer.com/category.xml"
		result="catHandler(event)"/>

	<mx:ApplicationControlBar dock="true">
		<mx:LinkButton label="All"
			click="this.currentState=''"/>
		<mx:LinkButton label="Sales"
			click="this.currentState='fullSales'"/>
		<mx:LinkButton label="Categories"
			click="this.currentState='fullType'"/>
		<mx:LinkButton label="Comparison"
			click="this.currentState='fullComp'"/>
		<mx:Spacer width="100%"/>
		<mx:Label text="Start Date"/>
		<mx:DateField id="startDate"/>
		
		<mx:Label text="End Date"/>
		<mx:DateField id="endDate"/>

		<mx:ComboBox id="catCombo"
			dataProvider = "{categories}"
			labelField = "name"/>
		
		<mx:RadioButtonGroup id="grossOrNetGroup"/>
		
		<mx:RadioButton id="gross"
			groupName="grossOrNetGroup"
			label="Gross Sales"
			data="GROSS"
			selected="true"/>
		<mx:RadioButton id="net"
			groupName="grossOrNetGroup"
			label="Net Sales"
			data="NET"/>
	</mx:ApplicationControlBar>

	<mx:states>
		<mx:State name="fullSales">
			<mx:SetProperty target="{rightCharts}"
				name="width" value="0"/>
			<mx:SetProperty target="{rightCharts}"
				name="height" value="0"/>
		</mx:State>

		<mx:State name="fullType">
			<mx:SetProperty target="{sales}"
				name="width"
				value="0"/>
			<mx:SetProperty target="{sales}"
				name="height"
				value="0"/>
			<mx:SetProperty target="{comp}"
				name="width"
				value="0"/>
			<mx:SetProperty target="{comp}"
				name="height"
				value="0"/>
		</mx:State>
		<mx:State name="fullComp">
			<mx:SetProperty target="{sales}"
				name="width"
				value="0"/>
			<mx:SetProperty target="{sales}"
				name="height"
				value="0"/>
			<mx:SetProperty target="{type}"
				name="width"
				value="0"/>
			<mx:SetProperty target="{type}"
				name="height"
				value="0"/>
		</mx:State>
	</mx:states>

	<v:ChartPod id="sales"
	width="100%" height="100%"
	title="Sales Chart">
	</v:ChartPod>
	<mx:VBox id="rightCharts"
		width="100%" height="100%" >
		<v:ChartPod id="type"
			width="100%" height="100%"
			title="Category Chart">
		</v:ChartPod>
		<v:ChartPod id="comp"
			width="100%" height="100%"
			title="Comparison Chart">
		</v:ChartPod>
	</mx:VBox>
</mx:Application>

 程序中state的

<mx:SetProperty target="{rightCharts}" name="height" value="0"/>

是设置状态的属性,target是设置的目标,name是目标的属性,value是此属性的值,此行将rightCharts的height和width都设置为0,则界面中就相当于隐藏掉了rightCharts组件。

分享到:
评论

相关推荐

    Flex UI组件使用全集

    - **ApplicationControlBar**: 应用程序控制栏,如标题栏等。 - **Box**: 布局容器,可以是水平或垂直方向。 - **Canvas**: 用于自定义绘制的容器。 - **ControlBar**: 控制栏组件,用于放置工具栏等控件。 - **...

    Flex 3 组件实例与应用(2009版)

    - **FormPrintView/FormPrintHeader/FormPrintFooter** - 表单打印视图及相关组件。 #### 五、验证器与格式化器 ##### 1. **Validators** - **CreditCardValidator** - 信用卡号验证器。 - **CurrencyValidator**...

    《Flex 3 组件实例与应用(2009版)》(PDF)

    《Flex 3 组件实例与应用(2009版)》是一本深入解析Adobe Flex 3框架下组件使用与实践的专业书籍。本书由Dason精心整理于2009年2月,全面覆盖了Flex 3中的各种控件、容器、数据可视化组件以及效果、视图状态和过渡...

    flex3动态创建[参考].pdf

    - `creationComplete` 事件在组件完成创建后触发,常用于初始化操作。 - `change` 事件在组件值改变时触发,如ComboBox或CheckBox的选中状态变化。 - `dataProvider` 属性用于连接组件(如ComboBox)和数据源。 ...

    flex quick starts 中文版(翻译by dreamer)

    - **ApplicationControlBar**:通常位于Application容器的顶部边缘,包含提供全局导航和程序命令的组件。 - **ControlBar**:放置于Panel或TitleWindow容器的底部边缘,用于容纳控制按钮等元素。 - **Spacer**:虽然...

    Flex3界面布局中文教程

    5. **ApplicationControlBar容器** 类似于ControlBar,但主要用于Flex应用程序的主界面,提供全局的控制功能。 6. **DividedBox, HDividedBox 和 VDividedBox布局** 这些布局容器用于创建分隔的区域,可以水平...

    Flex3界面布局中文教程--一路风尘制作

    例如,使用Vbox布局时,所有子组件将沿垂直轴排列,每个组件下方会自动留出空间供下一个组件使用。这使得界面设计过程更加简洁高效,特别是在创建多列布局或导航菜单时。 #### ControlBarlayout容器与...

    FLEX主要容器关系图

    在探讨"FLEX主要容器关系图"这一主题时,我们深入解析Flex框架中各种容器组件的层次结构与相互关联,这对于理解和应用Flex布局至关重要。Flex,作为Adobe推出的一款用于开发跨平台应用程序的开源框架,其核心优势...

    Flex 创建一个自定义风格的HRule或VRule

    在给定的代码段中,我们创建了一个带有控制条(ApplicationControlBar)的Flex应用程序,其中包括用于调整strokeWidth、strokeColor和shadowColor的滑块(HSlider)和颜色选择器(ColorPicker)。这样,用户可以通过...

    Flex Gumbo中通过baseColor样式 设置FxHScrollBar背景颜色

    此外,我们还需要使用ApplicationControlBar和Form来构建用户界面,并添加一个ColorPicker控件,允许用户选择颜色。 ColorPicker控件允许用户通过图形界面选择颜色。其中,selectedColor属性表示ColorPicker当前...

    Flex Gumbo 通过textJustify样式设置TextBox文字对齐的例子

    在代码中,&lt;ApplicationControlBar&gt;是一个用来存放控制组件的区域,其中包含了表单(Form)和表单项(FormItem)。每个表单项中都包含有一个标签(label)和一个具体的控件,如ComboBox和HSlider。ComboBox用于让...

    Flex Gumbo 通过smooth属性设置BitmapGraphic对象平滑度的例子

    2. ApplicationControlBar元素:这个容器用来放置界面控制元素,如CheckBox和HSlider滑块。 3. CheckBox元素:它是一个复选框控件,用于切换BitmapGraphic对象的smooth属性。当CheckBox被选中时,smooth属性设置为...

    Flex3 界面布局教程

    ApplicationControlBar 是一种特殊的 ControlBar,通常位于应用程序的顶部或底部,用于显示标题和其他应用程序级别的控件。 - **特点** - 提供了一个统一的地方来放置应用程序级别的控件。 - 通常包含如退出、...

Global site tag (gtag.js) - Google Analytics