Flex DisplayObject in fullscreen mode

Question

I would like to make a display object fullscreen in my Flex application. I understand it is easy to make the complete Stage fullscreen in flex (example). But I have two charts on my Stage and I would like to make one of the charts full screen on clicking a button (or on double clicking on the chart area) and as per my understanding a ColumnChart is a DisplayObject (API reference).

Is it possible to do so? and if it is possible then please post the code snippet.

Thanks

Answer 1

What I do in cases like this is use the Flex HDividedBox containing two containers of your choice. Then you can make the HDividedBox 100% x 100%; and hide or show the two containers as you choose.

It makes a pretty nice book-with-split-pages emulator. It also makes it easy use the divider bar to drag-resize the relative split between the two, so an image can scale smoothly, for instance.

I use TabNavigators on the left and right sides, making it easy to riffle through page-like tabs on each side.

Answer 2

see: http://www.adobe.com/devnet/flashplayer/articles/full_screen_mode.html just set a fullscreen source rectangle to your component.

Answer 3

You can try something like this ...

private var myLeftColumnChart : ColumnChart;
private var myRightColumnChart : ColumnChart;

private function onButtonClick() : void{
   myRightColumnChart.visible = myRightColumnChart.includeInLayout = false;

   myLeftColumnChart.y = myLeftColumnChart.x = 0;
   myLeftColumnChart.width = Application.application.width;
   myRightColumnChart.height = Application.application.height;
}

Answer 4

You should use the fullScreenSourceRect property on stage and set it to the Rectangle that has the position of the chart that you want to show in full screen.