`
marcoojoey
  • 浏览: 9648 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

flex day 10 halo组件

阅读更多

<mx:LinkBar>需要一个dataprovider

<mx:ViewStack>由一组彼此上下堆叠的子容器组成,其中一次只可以显示一个子容器。选择另一个子容器后,它将显示在原来子容器的位置处,所以看起来好像此子容器替换了原来的子容器。但是,原来的子容器仍然存在,只不过它现在处于不可见状态。

<mx:TabNavigator>类似于带选项卡的viewstack 容器。

<mx:Accordion> 同样属于一个导航容器。

1.viewstack、tabnavigator、accordion 这些容器一次只能显示其中的一个子组件。区别在于子组件之间的导航方式,所以才称为“导航”容器。

2.linkbar的dataprovider经常使用viewstack。

3.且Halo导航容器只能包含Halo的容器子组件(想VBox、HBox、Canvas)

<?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"
			   width="100%" height="100%" initialize="init()">
	<fx:Declarations>
		<!-- 将非可视元素(例如服务、值对象)放在此处 -->
	</fx:Declarations>
	<s:layout>
		<s:VerticalLayout paddingLeft="10" paddingTop="10"
						  paddingRight="10" paddingBottom="10"/>
	</s:layout>
	<mx:Panel width="100%" height="100%" title="I See Your Halo...">
		<mx:LinkBar dataProvider="{vs}" width="100%"/>
		<mx:ViewStack id="vs" width="100%" height="100%">
			<mx:TabNavigator width="100%" height="100%" paddingLeft="5"
							 label="Tab Navigator">
				<mx:VBox label="One" width="100%" height="100%">
					<mx:Label text="Here's a Button:"/>
					<mx:Button label="A Halo Button"/>
				</mx:VBox>
				<mx:VBox label="Two" width="100%" height="100%">
					<mx:Label text="Shameless self-promotion:"/>
					<mx:Image 
						source="http://www.manning.com/armstrong/armstrong_cover150.jpg"/>
				</mx:VBox>
				<mx:VBox label="Three" width="100%" height="100%">
					<mx:Label text="Stuff inside Three"/>
				</mx:VBox>
			</mx:TabNavigator>
			<mx:Accordion width="100%" height="100%" label="Accordion">
				<mx:VBox label="Four" width="100%" height="100%">
					<mx:Label text="Stuff inside Four"/>
				</mx:VBox>
				<mx:VBox label="Five" width="100%" height="100%">
					<mx:Label text="Stuff inside Five"/>
				</mx:VBox>
				<mx:VBox label="Six" width="100%" height="100%">
					<mx:Label text="Stuff inside Six"/>
				</mx:VBox>
			</mx:Accordion>
		</mx:ViewStack>
	</mx:Panel>
</s:Application>

 

0
0
分享到:
评论

相关推荐

    Flex4自定义组件开发.pdf

    Flex4采用了全新的Spark组件架构,与之前的Flex3(Halo组件架构)相比有了很大的改进。Spark架构采用了更为现代的设计模式,如MVC(Model-View-Controller)模式,这使得组件更加模块化、易于维护,并提高了整体性能...

    一周学会Flex4.0练习程序 Day1

    3. **Spark 组件架构**:Flex 4.0 引入了全新的 Spark 组件集,相比 Flex 3 的 Halo 组件,Spark 提供了更灵活的样式和动画支持,使得开发者可以创建更具表现力的用户界面。 4. **皮肤和样式**:在 Flex 4.0 中,你...

    flex全书籍 flex全书籍

    例如,Flex组件库包含了许多预定义的UI组件,如按钮、列表、面板等,可以快速构建用户界面。 3. **Spark与 Halo 组件**:Flex 4引入了Spark组件模型,与早期的Halo组件模型并存。Spark组件设计更现代,支持更丰富的...

    Flex万年历记事本_flex源码

    2. **Spark和 Halo 组件**:Flex提供了两种组件库,Spark和Halo。Spark组件是Flex 4引入的新一代组件,设计更加灵活且性能优秀。万年历记事本可能使用了Spark组件来创建现代、美观的界面。 3. **Flex Builder/Flash...

    Flex3与flex4的区别

    不过,Flex4仍然保留了Flex3的Halo主题,可以通过设置编译参数来恢复Flex3的外观。 ### 总结 Flex4与Flex3之间的主要区别在于其引入的新组件和外观架构——Spark,以及在布局管理、状态使用、效果实现等方面的改进...

    Flex 4的十大变化

    2. **Spark组件架构**:Spark组件模型是Flex 4的核心之一,它替代了Flex 3的Halo组件模型。Spark架构实现了松耦合,使组件的核心逻辑、皮肤和布局可以独立处理。这种设计增强了组件的可定制性和可扩展性,同时保持与...

    flex4实现的简单相册实例

    3. **Spark组件**:Flex4引入了全新的Spark组件架构,相比Flex3的 Halo组件,Spark组件提供了更高级的外观和性能。在相册应用中,可能使用了`Image`组件来展示图片,`List`或`DataGrid`组件来显示图片列表。 4. **...

    flex4 学习资料

    3. **Spark组件库**:Flex4引入的新组件集,相比Flex3的 Halo 组件,Spark组件具有更好的可定制性和性能,且更符合设计模式。 4. **skins和styles**:Flex4中的皮肤(skins)和样式(styles)系统允许开发者自定义...

    flex的ppt(flex和java的整合及flex组件的应用共31章)

    在本课件中,"flex的ppt"涵盖了31个章节,旨在全面介绍Flex与Java的整合以及Flex组件的应用。让我们逐一探讨这些知识点。 首先,Flex和Java的整合是现代Web应用开发中的一个重要领域。Flex提供了丰富的用户界面,而...

    flex4中文API帮助文档

    首先,Flex4 API引入了全新的Spark组件架构,相较于Flex3的 Halo 组件,Spark组件更加灵活且性能更优。Spark组件包括一系列基础组件,如Button、Label、Container等,以及更复杂的组件如ListView、Accordion等。这些...

    经过修改的flex商城

    2. **Flex 4及Spark组件**: Flex 4引入了Spark组件集,这是一个全新的组件架构,与之前的 Halo组件相比,提供了更好的可定制性和性能。Spark组件支持更复杂的皮肤ning和动画效果,使开发者可以创建更美观、响应更快...

    flex开发技术文档

    2. **Flex组件库** - Flex包含一个强大的预定义组件集,如按钮、列表、表格和图表等,这些组件可以快速构建用户界面。 - **Spark和 Halo组件**:Spark组件提供更现代的外观和更好的性能,而Halo组件则兼容较旧的...

    flex4.5.1.chm flex4API文档

    与之前的 Halo 组件相比,Spark组件更加现代且易于样式化。 5. **skins和styles**:Flex 4.5.1中的皮肤和样式系统允许开发者自定义组件的外观和行为,使得UI设计更加灵活。 6. ** States 和 Transitions**:Flex 4...

    Flex 4 高级编程 Flex 4 高级编程

    1. **Spark组件架构**:Flex 4引入了全新的Spark组件集,相较于先前的 Halo 组件,Spark组件更加灵活、可定制化,并且支持皮肤和样式分离,这极大地提升了UI设计的自由度和效率。 2. **图形和动画**:Flex 4 引入了...

    flex学习资料

    3. **Flex组件库**:Flex提供了一整套丰富的预定义组件,如按钮、文本框、面板等,用于快速构建UI。学习如何使用和自定义这些组件,可以极大地提高开发效率。 4. **数据绑定**:Flex中的数据绑定允许UI元素与应用...

    flex4权威指南教程+全代码 flex flex

    与Flex 3的 Halo组件相比,Flex 4引入了全新的Spark组件体系。Spark组件更加灵活,支持皮肤化和组件分离,使界面设计更富表现力。每个Spark组件都包含视觉元素和行为,可以独立定制。 3. **皮肤和外观**: Flex 4...

    Flex4.0API中文手册完整版

    3. **Flex组件**:手册详细介绍了Spark和Halo组件集,包括Button、Label、TextInput等基本组件,以及Canvas、Accordion、TabNavigator等容器组件。理解这些组件的用法和交互模式对于构建用户界面至关重要。 4. **...

    flex教程_chm

    API(Application Programming Interface)文档详细列出了Flex框架提供的所有类、方法、属性和事件,这对于理解Flex组件的工作原理、创建自定义组件以及优化代码性能至关重要。通过这个API文档,开发者可以迅速查找...

    flex4.0快速入门

    3. **Spark组件集**:Flex 4.0引入了全新的Spark组件集,相比旧版的 Halo 组件,Spark组件更注重可定制性和性能优化。Spark组件的设计理念是分离视觉表现和行为,允许开发者深度自定义组件外观和行为。 4. **...

Global site tag (gtag.js) - Google Analytics