Adobe AIR Flex : 动态改变 VGroup 的宽度
Adobe AIR Flex : Dynamically change the width of VGroup
我们有一个 Adobe AIR 桌面应用程序。在 window 中有一个带有一些按钮的顶栏。中央按钮总是在屏幕的水平中心打开一个下拉弹出窗口。以前没有滚动条,顶部栏和弹出窗口始终水平对齐。但是现在我们引入了水平和垂直滚动条,因此当 window 调整大小时,顶部栏不在活动 window 的中心,因此它没有与弹出窗口对齐。
请检查图片。顶栏 -
弹窗-
如果 window 在水平边最大化,则顶栏和弹出窗口对齐。
现在mxml代码-
public function showMainMenu():void
{
log.debug("Menu button clicked.");
if(animatingMenu)
{
log.debug("Suppressing showing of menu. Animation already in progress.");
return;
}
animatingMenu = true;
menuButton.visible = true;
mainMenu.visible = true;
PopUpManager.addPopUp(mainMenu, FlexGlobals.topLevelApplication as DisplayObject, true);
PopUpManager.centerPopUp(mainMenu);
mainMenu.y = -mainMenu.height + menuButton.height;
mainMenu.refresh();
showMenuEffect.play();
menuButton.visible = false;
}
<fx:Declarations>
<menu:MainMenu id="mainMenu"/>
<s:Move id="showMenuEffect" target="{mainMenu}" yFrom="{-mainMenu.height+menuButton.height}" yTo="-5" effectEnd="menuShowed(event)" duration="1200"/>
<s:Move id="hideMenuEffect" target="{mainMenu}" yFrom="-5" yTo="{-mainMenu.height+menuButton.height}" effectEnd="menuHided(event)" duration="600"/>
</fx:Declarations>
<s:HGroup width="100%">
<s:VGroup horizontalAlign="center" width="100%" paddingLeft="{this.width / 2 - menuButton.width / 2}">
<s:Button id="menuButton" automationName="menuButtonShow" click="showMainMenu()" styleName="mainMenuButton" height="40" width="200"/>
</s:VGroup>
<s:HGroup horizontalAlign="right" width="100%" paddingRight="48" paddingTop="10">
<desktop:LocaleSelector id="localeSelector"/>
<desktop:ButtonCorner id="buttonCorner"/>
</s:HGroup>
<s:VGroup paddingRight="24" paddingTop="25" horizontalAlign="right">
<s:Button id="closeScreenButton" visible="false" styleName="closeScreenButton" width="29" height="35"/>
</s:VGroup>
</s:HGroup>
应该改变什么?如何将顶部栏始终置于屏幕中央。我应该创建 css 文件来处理这种情况吗?
这是默认行为。当你显示一个弹出窗口时,你告诉它在 .y 和 .x 中的位置。当您滚动或调整大小时,您实际上更改了 window 的“中心”,但您从未通知它它已更改。
我会尝试为 window 调整大小和 onChange
重新居中弹出窗口添加一个侦听器。
示例代码(未经测试但应该有效):
var widthWatch:ChangeWatcher = ChangeWatcher.watch(this, 'widht', resizeHandler);
private var resizeExecuting:Boolean = false;
//this should run as soon as your app does (in most cases I do that in creationComplete or initialize())
private function onCreationComplete(event:Event):void
{
widthWatch = ChangeWatcher.watch(this,'width',onSizeChange);
}
//this checks if the resize stopped before actually moving the popup. Alternatively you can move your popup.center code here
private function onSizeChange(event:Event):void
{
if(!resizeExecuting)
callLater(handleResize);
resizeExecuting = true;
}
private function handleResize():void
{
PopUpManager.centerPopUp(mainMenu);
resizeExecuting = false;
}
我们有一个 Adobe AIR 桌面应用程序。在 window 中有一个带有一些按钮的顶栏。中央按钮总是在屏幕的水平中心打开一个下拉弹出窗口。以前没有滚动条,顶部栏和弹出窗口始终水平对齐。但是现在我们引入了水平和垂直滚动条,因此当 window 调整大小时,顶部栏不在活动 window 的中心,因此它没有与弹出窗口对齐。
请检查图片。顶栏 -
弹窗-
如果 window 在水平边最大化,则顶栏和弹出窗口对齐。
现在mxml代码-
public function showMainMenu():void
{
log.debug("Menu button clicked.");
if(animatingMenu)
{
log.debug("Suppressing showing of menu. Animation already in progress.");
return;
}
animatingMenu = true;
menuButton.visible = true;
mainMenu.visible = true;
PopUpManager.addPopUp(mainMenu, FlexGlobals.topLevelApplication as DisplayObject, true);
PopUpManager.centerPopUp(mainMenu);
mainMenu.y = -mainMenu.height + menuButton.height;
mainMenu.refresh();
showMenuEffect.play();
menuButton.visible = false;
}
<fx:Declarations>
<menu:MainMenu id="mainMenu"/>
<s:Move id="showMenuEffect" target="{mainMenu}" yFrom="{-mainMenu.height+menuButton.height}" yTo="-5" effectEnd="menuShowed(event)" duration="1200"/>
<s:Move id="hideMenuEffect" target="{mainMenu}" yFrom="-5" yTo="{-mainMenu.height+menuButton.height}" effectEnd="menuHided(event)" duration="600"/>
</fx:Declarations>
<s:HGroup width="100%">
<s:VGroup horizontalAlign="center" width="100%" paddingLeft="{this.width / 2 - menuButton.width / 2}">
<s:Button id="menuButton" automationName="menuButtonShow" click="showMainMenu()" styleName="mainMenuButton" height="40" width="200"/>
</s:VGroup>
<s:HGroup horizontalAlign="right" width="100%" paddingRight="48" paddingTop="10">
<desktop:LocaleSelector id="localeSelector"/>
<desktop:ButtonCorner id="buttonCorner"/>
</s:HGroup>
<s:VGroup paddingRight="24" paddingTop="25" horizontalAlign="right">
<s:Button id="closeScreenButton" visible="false" styleName="closeScreenButton" width="29" height="35"/>
</s:VGroup>
</s:HGroup>
应该改变什么?如何将顶部栏始终置于屏幕中央。我应该创建 css 文件来处理这种情况吗?
这是默认行为。当你显示一个弹出窗口时,你告诉它在 .y 和 .x 中的位置。当您滚动或调整大小时,您实际上更改了 window 的“中心”,但您从未通知它它已更改。
我会尝试为 window 调整大小和 onChange
重新居中弹出窗口添加一个侦听器。
示例代码(未经测试但应该有效):
var widthWatch:ChangeWatcher = ChangeWatcher.watch(this, 'widht', resizeHandler);
private var resizeExecuting:Boolean = false;
//this should run as soon as your app does (in most cases I do that in creationComplete or initialize())
private function onCreationComplete(event:Event):void
{
widthWatch = ChangeWatcher.watch(this,'width',onSizeChange);
}
//this checks if the resize stopped before actually moving the popup. Alternatively you can move your popup.center code here
private function onSizeChange(event:Event):void
{
if(!resizeExecuting)
callLater(handleResize);
resizeExecuting = true;
}
private function handleResize():void
{
PopUpManager.centerPopUp(mainMenu);
resizeExecuting = false;
}