Laya 屏幕适配

Laya 屏幕适配

@author ixenos 2021年4月9日

1.屏幕适配的主要痛点在于:如何让设计尺寸和屏幕尺寸融洽,比如说消除黑边,异形屏适配,还有固定居上居下居左居右居中等等的问题

2.这里直接给出一个刚出炉的code snippet,对竖屏页面进行适配

 1 Laya.stage.scaleMode = Stage.SCALE_FIXED_WIDTH;//竖屏,设置适配宽度
 2 Laya.stage.alignH = Stage.ALIGN_CENTER;//水平居中
 3 Laya.stage.alignV = Stage.ALIGN_MIDDLE;//垂直居中
 4 Laya.stage.screenMode = Stage.SCREEN_VERTICAL;//自动竖屏
 5 Laya.stage.on(Event.RESIZE, this, onResize);//监听resize
 6 
 7 ...
 8 
 9 private function onResize():void{
10    if(_index){
11       _index.size(Laya.stage.width,Laya.stage.height);
12    }
13 }

  1)这里将index作为整个游戏的根节点,主要用于resize时动态设置宽高

  2)其他容器在加入index时,需要使用布局属性 left,right, top,bottom, centerX,centerY等,因为重设size(width,height)的时候,会触发重新布局相关的代码。 

3.横屏同理,就不赘述了。

4.对于异形屏的适配,需要额外定义一个异形屏留空的常量尺寸(对应刘海头,左右摄像头等的位置),然后再定义一个触发异形适配的阈值,每个页面都监控resize事件,或者初始时只调用一次,从而对异形屏进行判断适配。这部分需要结合具体业务逻辑去处理,也不赘述了。

原文地址:https://www.cnblogs.com/ixenos/p/14636493.html