View Stack + TabBar 校验

最新推荐文章于 2025-06-06 18:00:00 发布

最新推荐文章于 2025-06-06 18:00:00 发布 · 77 阅读

文章标签：

#ViewStack #TabBar #校验

Flex 专栏收录该内容

61 篇文章

订阅专栏

本文介绍了一种使用Flex的视图堆栈(viewStack)和标签栏(tabBar)进行导航的方法，并添加了导航前的验证逻辑。若验证未通过，则会阻止导航并停留在当前视图堆栈。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

程序中用到view Stack + tabBar导航的导航的应该不好，如果想校验viewStack的内容然后再导航的下一个，如果没有校验通过就留在当前的viewStack。

<?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" 
			   minWidth="955" minHeight="600">
	<fx:Script>
		<![CDATA[
			import mx.controls.Alert;
			import mx.events.CollectionEvent;
			import mx.events.CollectionEventKind;
			
			import spark.events.IndexChangeEvent;
			
			protected function viewMenu_changeHandler(event:IndexChangeEvent):void
			{
				if(!((viewStack.getChildAt(event.oldIndex) as Canvas).getChildAt(0) as CheckBox).selected)
				{
					viewStack.selectedIndex = event.oldIndex;
					tabBar.selectedIndex = event.oldIndex;
					tabBar.dataProvider.dispatchEvent(new CollectionEvent(CollectionEvent.COLLECTION_CHANGE,false,false,CollectionEventKind.REFRESH));
					tabBar.mx_internal::setSelectedIndex(event.oldIndex,true);
					tabBar.mx_internal::_selectedIndex = event.oldIndex;
					Alert.show("It doesn't pass");
				}
			}
			
		]]>
	</fx:Script>
	<s:layout>
		<s:VerticalLayout/>
	</s:layout>
	<s:TabBar id="tabBar" x="10" y="40" dataProvider="{viewStack}" change="viewMenu_changeHandler(event)"/>
	<mx:ViewStack id="viewStack" borderStyle="solid" width="100%" height="100%">
		<mx:Canvas id="search" backgroundColor="#FFFFCC" label="Search" width="100%" height="100%">
			<s:CheckBox label="pass"/>
		</mx:Canvas>
		<mx:Canvas id="custInfo" backgroundColor="#CCFFFF" label="Customer Info" width="100%" height="100%">
			<s:CheckBox label="pass"/>
		</mx:Canvas>
		<mx:Canvas id="accountInfo" backgroundColor="#FFCCFF" label="Account Info" width="100%" height="100%">
			<s:CheckBox label="pass"/>
		</mx:Canvas>
	</mx:ViewStack>            
</s:Application>