cocos2d-JS 实现 横 竖 屏 显示提示图片(rotate.png)效果 !!!!!

全局添加旋转屏幕帧听 :
window.addEventListener('orientationchange', function(event){
    //获取当前场景
    var currentScene = cc.director.getRunningScene();
    //如果当前场景不存在  return
    if(currentScene == null) return;
    //如果是竖屏   就创建 LayerColor 和 一个提示图片 rotate 
    if ( window.orientation == 180 || window.orientation==0 ) {
        //alert("竖屏");
        var rotateImg = new cc.Sprite("res/rotate.png");
        rotateImg.x = cc.winSize.width/2;
        rotateImg.y = cc.winSize.height/2;
        var _LayerColor =  new cc.LayerColor(cc.winSize.height,cc.winSize.width);
        _LayerColor.addChild(rotateImg);
        _LayerColor.setVisible(true);
        //创建时候 添加tag值 便于之后寻找对应对象 (tag = 300)
        currentScene.addChild(_LayerColor,9999,300);
    }
    //如果横屏就移除
    if( window.orientation == 90 || window.orientation == -90 ) {
        //alert("横屏");
        //通过tag值 寻找对应对象
        var first = currentScene.getChildByTag(250);
        if(first != null){
            first.removeFromParent()
        }
        //通过tag值 寻找对应对象
        var second = currentScene.getChildByTag(300);
        if(second != null){
            second.removeFromParent()
        }
    }
});

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

初始化游戏场景时调用 : (因为全局帧听需要选择才会起作用，所以第一次需要手动添加一次提示旋转图)

this._checkOrientation()
1

第一次初始化判断是不是竖屏 创建一个 LayerColor 和 所需提示旋转图片

    _checkOrientation: function(){
        if (window.orientation == 180 || window.orientation == 0) {
            //alert("竖屏");
            var _rotateImg = new cc.Sprite("res/rotate.png");
            _rotateImg.x = cc.winSize.width/2;
            _rotateImg.y = cc.winSize.height/2;
            var _LayerColor =  new cc.LayerColor(cc.winSize.height,cc.winSize.width);
            _LayerColor.addChild(_rotateImg);
            _LayerColor.setVisible(true);
            var currentScene = cc.director.getRunningScene()
            currentScene.addChild(_LayerColor,9999,250)
            //cc.director.pause()
        }

        //if( window.orientation == 90 || window.orientation == -90 ) {
        //    alert("横屏");
        //}
    },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18