悲剧的Menu和ViewStack 结合
项目中遇到一个小问题,但是就是这个小问题,却困扰我很久很久很久…………
当时的情况是这样的:在项目中用到了Menu,用popupButton弹出来一些都是正常的,但是当你放大缩小浏览器敞口后,诡异的现象出现了,本来menu中靠右对齐的字体居然居中了!但是我在外面用demo测试,却发现时正常的!
找了很久很久,最后发现原来是这个Menu是用在了ViewStack中了(viewStack保持100%),而且是动态添加进去的,这样就导致了这样的状况。亲们啊,你们能想到跟这个牛马不相及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" initialize="application1_initializeHandler(event)"><fx:Script><![CDATA[import flexlib.controls.ScrollableArrowMenu;import mx.controls.Menu;import mx.controls.PopUpButton;import mx.core.UIComponent;import mx.events.FlexEvent;private var menu:Menu;protected function application1_initializeHandler(event:FlexEvent):void{var mdp:Array = [{label:"menu1111111111111"},{label:"menu2"},{label:"menu3"}];menu = ScrollableArrowMenu.createMenu(this,mdp,true);}protected function popHandler(event:MouseEvent):void{if((event.target as PopUpButton).popUp != menu){(event.target as PopUpButton).popUp = menu;}(event.target as PopUpButton).open();}protected function addclickHandler(event:MouseEvent):void{var pop:PopUpButton = new PopUpButton();pop.label = "popTest";pop.addEventListener(MouseEvent.CLICK,popHandler);var uicom:NavigatorContent = new NavigatorContent();uicom.addElement(pop);viewStack.addChild(uicom);}]]></fx:Script><fx:Declarations><!-- Place non-visual elements (e.g., services, value objects) here --></fx:Declarations><s:layout><s:VerticalLayout gap="5"/></s:layout><s:Button label="Add Component" click="addclickHandler(event)"/><s:TabBar dataProvider="{viewStack}"/><mx:ViewStack id="viewStack" width="100%"><s:NavigatorContent label="nav1"><s:Label text="NavigatorContent 1"/></s:NavigatorContent></mx:ViewStack><s:VGroup id="group" width="100%"><mx:PopUpButton label="popup" click="popHandler(event)"/></s:VGroup></s:Application>?
具体原因是神马愿意我是实在找不出来,不过我找到了解决方法。就是在new PopUpButton时,不要赋值popUp,然后每次打开时都重新生成menu并赋值。
?
代码如下:
?
<?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" initialize="application1_initializeHandler(event)"><fx:Script><![CDATA[import flexlib.controls.ScrollableArrowMenu;import mx.controls.Menu;import mx.controls.PopUpButton;import mx.core.UIComponent;import mx.events.FlexEvent;private var menu:Menu;private var mdp:Array;protected function application1_initializeHandler(event:FlexEvent):void{mdp = [{label:"menu1111111111111"},{label:"menu2"},{label:"menu3"}];menu = ScrollableArrowMenu.createMenu(this,mdp,true);}protected function popHandler(event:MouseEvent):void{menu = ScrollableArrowMenu.createMenu(this,mdp,true);(event.target as PopUpButton).popUp = menu;(event.target as PopUpButton).open();}protected function addclickHandler(event:MouseEvent):void{var pop:PopUpButton = new PopUpButton();pop.label = "popTest";pop.addEventListener(MouseEvent.CLICK,popHandler);var uicom:NavigatorContent = new NavigatorContent();uicom.addElement(pop);viewStack.addChild(uicom);}]]></fx:Script><fx:Declarations><!-- Place non-visual elements (e.g., services, value objects) here --></fx:Declarations><s:layout><s:VerticalLayout gap="5"/></s:layout><s:Button label="Add Component" click="addclickHandler(event)"/><s:TabBar dataProvider="{viewStack}"/><mx:ViewStack id="viewStack" width="100%"><s:NavigatorContent label="nav1"><s:Label text="NavigatorContent 1"/></s:NavigatorContent></mx:ViewStack><s:VGroup id="group" width="100%"><mx:PopUpButton label="popup" click="popHandler(event)"/></s:VGroup></s:Application>?
?
?