• 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事件,或者初始时只调用一次,从而对异形屏进行判断适配。这部分需要结合具体业务逻辑去处理,也不赘述了。

  • 相关阅读:
    2020软件工程最后一次作业 it
    javaArrayList it
    js二进制数据转图片 it
    002addTwoNumbers it
    1.1选择select it
    js保存图片至本地 it
    npm ERR! code E404 it
    2020软件工程第三次作业 it
    2020软件工程第二次作业 it
    react打包后找不到静态文件 it
  • 原文地址:https://www.cnblogs.com/ixenos/p/14636493.html
Copyright © 2020-2023  润新知