屏幕方向

laya.display.Stage 类的 screenMode 属性用于定义屏幕模式，即设置屏幕横屏或者竖屏，或者不改变屏幕。

Property（属性）

screenMode : String

场景布局类型。取值范围： "none" ：不更改屏幕 "horizontal" ：自动横屏 "vertical" ：自动竖屏

针对上面3个值，为了方便引用，Stage 为它们提供了对应的常量：

SCREEN_HORIZONTAL : String = horizontal ，[static] 自动横屏。

SCREEN_NONE : String = none ，[static] 不更改屏幕。

SCREEN_VERTICAL : String = vertical ，[static] 自动竖屏。

screenMode=none

默认值 none 或者不设置 screenMode 属性时，无论屏幕方向如何旋转，游戏的水平方向都不会产生跟随屏幕旋转的变化。

Laya.stage.screenMode = "none";

如上图1-1所示为不设置 screenMode 属性时，与screenMode=none 时的效果。

screenMode=horizontal

screenMode 属性为 horizontal 时，自动横屏，无论屏幕方向如何旋转，游戏的水平方向都会与屏幕最短的边始终保持垂直。

//自动横屏，游戏的水平方向始终与浏览器屏幕较短边保持垂直
Laya.stage.screenMode = "horizontal";

screenMode=vertical

screenMode 属性为 vertical 时，自动竖屏，无论屏幕方向如何旋转，游戏的水平方向都会与屏幕较长的边始终保持垂直。

//自动竖屏，游戏的水平方向始终与浏览器屏幕较长边保持垂直
Laya.stage.screenMode = "vertical";

横竖屏切换代码

//初始化引擎,不支持WebGL时会自动切换至Canvas
Laya.init(0, 0, Laya.WebGL);
Laya.stage.scaleMode = "full";//设置屏幕缩放模式
Laya.stage.bgColor = "#232628";//设置舞台背景色//在舞台左上角显示一个文本，便于效果更加直观，和以前使用的方式是否一致
var hitText = new Laya.Text();
hitText.text = "I'm fine";
hitText.pos(50,20);
hitText.fontSize = 40;
hitText.color = "#fff";
Laya.stage.addChild(hitText);showpicture();
showText();//显示一张图片
function showpicture(){var img = new Laya.Image();//Image 类是用于表示位图图像或绘制图形的显示对象。继承了 Component 的图像组件//centerX：在父容器中，此对象的水平方向中轴线与父容器的水平方向中心线的距离（以像素为单位）img.centerX = 0;//表示水平居中//centerY：在父容器中，此对象的垂直方向中轴线与父容器的垂直方向中心线的距离（以像素为单位）img.centerY = -70;//表示垂直方向在父容器中点向上偏移70像素img.skin = "http://react-china.org/uploads/default/38/c4b96a594bd352e0.png";//图片像素为 620x160// img.skin = "res/react.png";//图片像素为 620x160   //对于手机访问时，因为同源策略的限制，图片必须放在本地,即 bin 目录下Laya.stage.addChild(img);//将组件添加到舞台
}//显示一段文本
var textLabel ;
function showText(){//Label 类用于创建显示对象以显示文本，继承了 Component 的标签组件textLabel = new Laya.Label();textLabel.text = "屏幕方向";//设置标签显示的内容textLabel.color = "gray";//标签文本颜色textLabel.fontSize = 60;//标签文本大小textLabel.centerX = 0;//水平居中textLabel.centerY = 50;//垂直方向上，在父容器中点的位置上向下偏移 50pxLaya.stage.addChild(textLabel);
}//horizontal：自动横屏，游戏的水平方向始终与浏览器屏幕较短边保持垂直
//vertical：自动竖屏，游戏的水平方向始终与浏览器屏幕较长边保持垂直
//none：不更改屏幕
var screenModes = ["none","horizontal","vertical"];
var count = 0;
//为舞台绑定一个单击事件，便于切换屏幕方向
Laya.stage.on(Laya.Event.CLICK,this,stageCLick);
function stageCLick(){Laya.stage.screenMode = screenModes[count];textLabel.text = screenModes[count++];count = count >2 ? 0 : count;
}

效果如下：

手机上效果如下：

LayaAir 官网地址：https://ldc.layabox.com/doc/?nav=zh-js-1-8-2

LayaAir 屏幕适配-横屏与竖屏相关推荐

qt linux 横屏,linux Qt4.8屏幕旋转(横屏、竖屏)
linux下要实现应用程序屏幕可旋转,也就是可切换横屏竖屏,可参考: 方法一:利用 QGraphicsView 实现旋转,参照另一篇文章QGraphicsView旋转(横屏竖屏) 方法二:利用API ...
Android 判断当前屏幕是横屏还是竖屏
记录学习 /** * 返回当前屏幕是否为竖屏. * @param context * @return 当且仅当当前屏幕为竖屏时返回true,否则返回false. */ public sta ...
如何让你的手机屏幕固定横屏和竖屏
1.在 AndroidManifest.xml文件中对节点添加android:screenOrientation属性(landscape是横向,portrait是纵向) android:screenO ...
android虚拟机固定横屏幕竖屏,用VBox虚拟机安装Android 屏幕90度翻转竖屏设置
在虚拟机中安装好Android之后,有一些Android应用(比如UC浏览器.UC桌面)不能安装.但更有一些程序是可以安装,却自动顺时间旋转了90度,操作和看起来非常不爽! 这个情况下,在Androi ...
嵌入式 Qt/Qml 屏幕旋转（横屏，竖屏）问题的解决
嵌入式 Linux 的一个小屏幕,正常是竖屏模式,可是我们产品中需要横着使用. Qml 代码已经写好了,在 PC 正常工作.然后移植到嵌入式 Linux,问题来了,屏幕方向不对,显示不正常. 那就去网 ...
android 强制设置横屏判断是横屏还是竖屏
判断activity 是横屏还是竖屏方法 1: //根据设备配置信息 Configuration cf= this.getResources().getConfiguration(); //获取设 ...
电脑快捷键横屏变竖屏,电脑显示器竖屏横屏来回切换怎么设置
对于横屏与竖屏来回切换,很多小伙伴使用可能很不习惯,那如何在横屏与竖屏之间来回快速切换呢?下面是小编为大家介绍电脑显示器竖屏横屏来回切换的设置方法,欢迎大家阅读. 电脑显示器竖屏横屏来回切换的设置方法 ...
短视频生产利器！视频裁剪之横屏转竖屏新技术，出自腾讯多媒体实验室
腾讯多媒体技术专栏伴随手机等智能设备的广泛使用以及短视频平台的兴起,越来越多的"竖屏"视频开始占据人们的视野.目前,许多"竖屏"视频仍是由16:9等宽高比的& ...
JS判断手机浏览器是横屏or竖屏
移动端的浏览器一般都支持window.orientation这个参数,通过这个参数可以判断出手机是处在横屏还是竖屏状态. 从而根据实际需求而执行相应的程序. 通过添加监听事件onorientation ...
竖屏java转横屏_android设置横屏和竖屏的方法
方法一:在AndroidManifest.xml中配置假设不想让软件在横竖屏之间切换,最简单的办法就是在项目的AndroidManifest.xml中找到你所指定的activity中加上androi ...

LayaAir 屏幕适配-横屏与竖屏