Laya的适配模式选择

文章目录SCALE_FIXED_AUTOSCALE_SHOWALLSCALE_FULLSCALE_FIXED_HEIGHTSCALE_FIXED_WIDTHSCALE_NOSCALESCALE_EXACTFITSCALE_NOBORDERdemoSCALE_FIXED_AUTONO.1会透拉伸能解决官网解释应用保持设计比例不变全屏显示全部内容(类似showall但showall非全屏会有黑边)根据屏幕长宽比自动选择使用SCALE_FIXED_WIDTH或SCALE_FIXED_HEIGHSCALE_SHOWALLNO.2左右上下可能留空白完全设计宽高比例游戏官方应用显示全部内容按照最小比率缩放等比缩放不变形一边可能会留空白stage的宽高等于设计宽高。SCALE_FULLNo.3 不太考虑改变屏幕比例后需要刷新才跟着变界面可能会透要避免需要bgImg和界面拉伸能适配官方应用保持设计宽高不变不缩放不变形stage的宽高等于屏幕宽高。SCALE_FIXED_HEIGHT不太推荐会透官方应用保持设计高度不变宽度根据屏幕比缩放stage的高度等于设计宽度宽度根据屏幕比率大小而变化SCALE_FIXED_WIDTH不推荐会透会糊官方应用保持设计宽度不变高度根据屏幕比缩放stage的宽度等于设计高度高度根据屏幕比率大小而变化SCALE_NOSCALE不推荐可能看不全官方应用保持设计宽高不变不缩放不变形stage的宽高等于设计宽高。SCALE_EXACTFIT不推荐铺满会变形官方应用根据屏幕大小铺满全屏非等比缩放会变形stage的宽高等于设计宽高。SCALE_NOBORDER不推荐可能单边显示不全官方应用按照最大比率缩放显示宽或高方向会显示一部分等比缩放不变形stage的宽高等于设计宽高。democonstinfoLaya.Browser;if(Laya.Browser.onPC){// PC 端不强制横竖屏按完整显示处理并居中对齐Laya.stage.scaleModeLaya.Stage.SCALE_SHOWALL;Laya.stage.screenModeLaya.Stage.SCREEN_NONE;Laya.stage.alignVLaya.Stage.ALIGN_MIDDLE;Laya.stage.alignHLaya.Stage.ALIGN_CENTER;}elseif(info!nullNumber(info.width)/Number(info.height)1.42){// 1.42 表示“屏幕越宽值越大超过 1.42 就归类为宽屏布局”。// 移动端宽高比达到项目设定阈值时按“横向宽屏”方案处理// 这里的 1.42 不是通用标准比例而是项目用于区分宽屏/非宽屏的经验阈值Laya.stage.scaleModeLaya.Stage.SCALE_SHOWALL;Laya.stage.screenModeLaya.Stage.SCREEN_HORIZONTAL;Laya.stage.alignVLaya.Stage.ALIGN_MIDDLE;Laya.stage.alignHLaya.Stage.ALIGN_CENTER;}else{//(info ! null Number(info.width) / Number(info.height) 1.42){// 竖屏固定宽度 x// 移动端宽高比低于阈值时按竖屏方案处理Laya.stage.scaleModeLaya.Stage.SCALE_FIXED_AUTO;Laya.stage.screenModeLaya.Stage.SCREEN_VERTICAL;Laya.stage.alignVLaya.Stage.ALIGN_BOTTOM;Laya.stage.alignHLaya.Stage.ALIGN_CENTER;}//【顶】constinfoLaya.Browser;if(Laya.Browser.onPC){Laya.stage.scaleModeLaya.Stage.SCALE_SHOWALL;Laya.stage.screenModeLaya.Stage.SCREEN_NONE;Laya.stage.alignVLaya.Stage.ALIGN_BOTTOM;// 画布垂直居下对齐Laya.stage.alignHLaya.Stage.ALIGN_CENTER;}else{//1280/720≈1.77 ||| 16/91.77if(info!nullNumber(info.height)/Number(info.width)1.77){//此为长屏设备固定宽度Laya.stage.scaleModeLaya.Stage.SCALE_FIXED_WIDTH;}elseif(info!nullNumber(info.height)/Number(info.width)1.77){// 非长屏设备自动适配Laya.stage.scaleModeLaya.Stage.SCALE_FIXED_AUTO;}Laya.stage.screenModeLaya.Stage.SCREEN_VERTICAL;Laya.stage.alignVLaya.Stage.ALIGN_BOTTOM;Laya.stage.alignHLaya.Stage.ALIGN_CENTER;}// 自定义方式 full/** * 创建游戏场景保持比例不变形无黑边 * param designWidth 设计宽度 * param designHeight 设计高度 */functioncreateGameScene(designWidth:number,designHeight:number):void{// 获取实际屏幕尺寸constscreenWidthLaya.stage.width;constscreenHeightLaya.stage.height;// 计算设计比例和屏幕比例constdesignRatiodesignWidth/designHeight;// 720/12800.5625constscreenRatioscreenWidth/screenHeight;// 计算游戏内容容器的实际尺寸保持设计比例letgameWidth:number;letgameHeight:number;if(screenRatiodesignRatio){//宽高比// 屏幕更宽以高度为准gameHeightscreenHeight;gameWidthgameHeight*designRatio;}else{// 屏幕更高以宽度为准gameWidthscreenWidth;gameHeightgameWidth/designRatio;}// 创建游戏内容容器保持设计比例不变形constgameContainernewLaya.Sprite();gameContainer.size(gameWidth,gameHeight);// 居中显示 - 可以考虑居下左右居中显示gameContainer.pos((screenWidth-gameWidth)/2,(screenHeight-gameHeight)/2);Laya.stage.addChild(gameContainer);// 创建背景填充层填充可能的黑边区域constbgFillnewLaya.Sprite();bgFill.graphics.drawRect(0,0,screenWidth,screenHeight,#232628);Laya.stage.addChildAt(bgFill,0);// 放在最底层// 创建一个居中显示的文本consttextLabelnewLaya.Text();textLabel.textLayaAir 游戏启动成功;textLabel.fontSize32;textLabel.color#ffffff;textLabel.boldtrue;gameContainer.addChild(textLabel);// 监听屏幕尺寸变化动态调整Laya.stage.on(Laya.Event.RESIZE,null,(){constnewScreenWidthLaya.stage.width;constnewScreenHeightLaya.stage.height;constnewScreenRationewScreenWidth/newScreenHeight;letnewGameWidth:number;letnewGameHeight:number;if(newScreenRatiodesignRatio){newGameHeightnewScreenHeight;newGameWidthnewGameHeight*designRatio;}else{newGameWidthnewScreenWidth;newGameHeightnewGameWidth/designRatio;}gameContainer.size(newGameWidth,newGameHeight);gameContainer.pos((newScreenWidth-newGameWidth)/2,(newScreenHeight-newGameHeight)/2);bgFill.size(newScreenWidth,newScreenHeight);});// 可以在这里继续添加你的游戏逻辑// 例如加载资源、创建UI、初始化游戏管理器等}