Flex 学习之路之十五导航的使用 Accordion、NavigatorContent

最新推荐文章于 2025-10-21 16:06:03 发布

原创最新推荐文章于 2025-10-21 16:06:03 发布 · 423 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#Accordion #NavigatorContent

flex 专栏收录该内容

23 篇文章

订阅专栏

本文介绍了一个使用Adobe Flex构建的应用示例，重点展示了如何利用Accordian和NavigatorContent组件来实现面板切换和内容导航。每个面板包含了垂直布局、标签和按钮，通过简单的XML配置实现了丰富的交互效果。

<?xml version="1.0" encoding="utf-8"?>
<!-- containers\spark\SparkNavContent.mxml -->
<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">
	<mx:Accordion>
		<s:NavigatorContent label="Pane 1"
							width="100" height="100">
			<s:layout>
				<s:VerticalLayout paddingTop="10" paddingLeft="5"/>
			</s:layout>
			<s:Label text="Text for Pane 1"/>
			<s:Button label="Button 1"/>
		</s:NavigatorContent>
		<s:NavigatorContent label="Pane 2"
							width="100" height="100">
			<s:layout>
				<s:VerticalLayout paddingTop="10" paddingLeft="5"/>
			</s:layout>
			<s:Label text="Text for Pane 2"/>
			<s:Button label="Button 2"/>
		</s:NavigatorContent>
		<s:NavigatorContent label="Pane 3"
							width="100" height="100">
			<s:layout>
				<s:VerticalLayout paddingTop="10" paddingLeft="5"/>
			</s:layout>
			<s:Label text="Text for Pane 3"/>
			<s:Button label="Button 3"/>
		</s:NavigatorContent>
	</mx:Accordion>
</s:Application>