UI自适应 Unity

最近学习遇到了一个UI自适应的问题
如下图:
1335*750
在这里插入图片描述
当切换到free aspect下
在这里插入图片描述

经验条因为没有设置两边对齐就会出现间隙问题

这几个小格子我是用的grid layout Group 来调整的,所以在自适应的时候,随着屏幕变化,只需要更改这个组件下的cellSize即可。
首先看第一张图
在这里插入图片描述
因为除经验条外其他的宽度都是固定大小的可以在其UI的rect transform组件下计算出其总宽度,然后再加上这十个经验条的总宽度就==屏幕的总宽度。然后就是小学生解方程就可以得出每个经验条的cellSize宽度大小。

  • 注意这里的画布的UI Scale Mode模式是Scale With Screen 因为这样UI的缩放才会随着屏幕的变化而变化。也正是这样才引出我这个问题的出现

下面来看代码的实现

private void ScreenAdaptation()
    {
        //exp Screen Adaptation
        // 获取GridLayoutGroup组件
        GridLayoutGroup grid =
        expPrgTrans.GetComponent<GridLayoutGroup>();
        //计算出屏幕相对于原始屏幕的缩放比
        float globalRate = 1.0F * 
        Constants.ScreenStandardHeight / Screen.height;
        //计算出真正的屏幕宽度
        float screenWidth = Screen.width * globalRate;
        //然后计算CellSize大小
        float cellSizeWidth = (screenWidth - 181) / 10;
        //最后赋值
        grid.cellSize = new Vector2(cellSizeWidth, 7);
    }
  • (screenWidth - 181) / 10 (181是我已经计算好的除经验条外的宽度)

到此结束,因为我对自适应这个也是小白,可能说的会有错误,欢迎指出


版权声明:本文为a_leaf_原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。