webGame全屏处置

webGame全屏处理
webgame中常用的全屏界面和1000*600切换

首先打flash builder 新建一个as3工程，起名RPGTest。
然后在RPGTest.as文件写如下代码
package
{
        import flash.display.Sprite;
        import flash.display.StageAlign;
        import flash.display.StageDisplayState;
        import flash.display.StageScaleMode;
        import flash.events.Event;
        import flash.events.MouseEvent;
        import flash.external.ExternalInterface;
       
        import org.aswing.ASColor;
        import org.aswing.AsWingManager;
        import org.aswing.JButton;
        import org.aswing.JPanel;
        import org.aswing.SolidBackground;

        [SWF(backgroundColor="#FFFFFF",frameRate="24")]
        public class RPGTest extends Sprite
        {
                private var btn:JButton;
                private var flag:Boolean=true;
                public function RPGTest()
                {
                        stage.scaleMode=StageScaleMode.NO_SCALE;
                        stage.align=StageAlign.TOP_LEFT;
                        stage.displayState=StageDisplayState.NORMAL; //
                        this.addEventListener(Event.ADDED_TO_STAGE, Main);
                }
                private function Main(event:Event):void
                {
                        //解决IE BUG。stageWidth=0的BUG
                        if (stage.stageWidth > 0 && stage.stageHeight > 0)
                        {
                                startUp();
                        }
                        else
                        {
                                this.stage.addEventListener(Event.RESIZE, onResize);
                        }                       
                }
                private function onResize(e:Event):void
                {
                        if (stage.stageWidth > 0 && stage.stageHeight > 0)
                        {
                                stage.removeEventListener(Event.RESIZE, onResize); //删除事件监听
                                startUp();
                        }
                }
                private function startUp():void
                {
                        //添加测试界面
                        AsWingManager.initAsStandard(this);
                        var jpane:JPanel=new JPanel();
                        jpane.setBackgroundDecorator(new SolidBackground(new ASColor(0x000000,0.5)));
                        jpane.setSizeWH(this.stage.stageWidth,this.stage.stageHeight);
                        jpane.setLocationXY(0,0);
                       
                        btn=new JButton("点我");
                        btn.setSizeWH(100,50);
                       
                        btn.setLocationXY(0,0)
                        jpane.append(btn);

                        addChild(jpane);
                        //添加事件触发
                        btn.addEventListener(MouseEvent.CLICK,clickHandler);
                        this.stage.addEventListener(Event.RESIZE, changeWindow);
                }
                /**
                 * 实现全屏和1000*600界面切换
                 * */
                private function clickHandler(eve:Event):void
                {
                        if(flag)
                        {
                                var w:uint = 1000;
                                var h:uint = 600;
                                ExternalInterface.call("setSize",w,h);//和JS通讯
                                flag=false;
                        }
                        else
                        {
                                ExternalInterface.call("setSize","100%","100%");
                                flag=true;
                        }
                }
                /**
                 * 这里写你UI要更改的坐标,比如你的聊天界面，小地图界面，人物左上角的图像界面，这里可以选择派发相应的事件到你要处理的页面
                 * 这样就会实现拉伸浏览器你的布局不会变换
                 * */
                private function changeWindow(e:Event):void
                {
                        btn.setLocationXY(this.stage.stageWidth/2,200);
                }
        }
}

然后打开项目html-template文件夹下的index.template.html写如下JS代码
          <script type="text/javascript">
            function setSize(width, height) {
            document.getElementById("flashdiv").style.width = width;
            document.getElementById("flashdiv").style.height = height;
            document.getElementById("flashdiv").style.margin = "0px auto";
            if (width == "1000") {
                document.getElementById("flashdiv").style.left = "" + (document.body.clientWidth / 2 - width/2) + "px";
            }
            }
        </script>
同时给该页面的叫flashContent的div 外层加一个flashdiv的div.
OK,下面来运行程序。代码需要aswing组件库。