Following on from my previous post concerning dyncamically resizing AIR windows with user resize (based on Daniel Wabyick’s example here), I wanted to cover a further modification I made; that of having the window resize dynamically, but the content stay the same.
To be more specific, I wanted a content area to remain a fixed size when the window resized dynamically, but maintain a percentage width of the area when the window was resized by the user. (If that makes no sense, download the example after the jump.)
There are two main additions made to the previous example to achieve this. Firstly was to fix the width of the non-resizing area at the start of the resize effect. This was done by adding effectStart="{mainHBox.width=mainHBox.width}" to the Resize effect.
The second part is to return the area to a percent width when the user resizes the window, so the gripperDownHandler method becomes:
private function gripperDownHandler():void
{
//adds an extra bit of safety incase the mouseUp occures outside the gripper
stage.addEventListener( MouseEvent.MOUSE_UP, gripperUpHandler );
chrome.setStyle("top", 10);
chrome.setStyle("bottom", 10);
chrome.setStyle("left", 10);
chrome.setStyle("right", 10);
chrome.setStyle("resizeEffect", null);
mainHBox.percentWidth =
(mainHBox.width / (chrome.width - (mainContent.getStyle("paddingLeft") +
mainContent.getStyle("paddingRight") + mainContent.borderMetrics.left +
mainContent.borderMetrics.right))) *100;
nativeWindow.startResize();
} The resizeHandler code has also undergone a slight tweak. It now bases the reduction target size for the chrome on the width of mainHbox. This prevents rounding errors, which could create scrollbars or slowly enlarging margins on continued resizes.