多分辨適配正確的設置方式 交流一下

Creator 2.x
#1

  • Creator 版本： 2.4.3

  • 目标平台： WEB iOS / Android

請問目前大家在排版上 多分辨適配的設置上怎麼達成?
譬如說 玩家資訊面板上的頭像, 等級, 餘額, 經驗值…等
不管在甚麼尺寸的螢幕上能依比列顯示間距 互相不會覆蓋?

若是照官方的適配寬高方式來處理
以高為主了 寬就不受控制 反過來亦同理

那麼怎麼解決不受控制的那一端呢?

看起來不外乎就是給他一個固定的分辨率 也就是市場上最大的公因尺寸
像是在錄像中的安全區域 在這個區域中的 怎麼切都無所謂
往後的尺寸比之過大,就是留白多; 比之過小就是會切到元件了

另外就是使用Widget模組來做父子階層間的間距
我感覺他在使用上, 就如同postion的absolute 屬性一樣
可以在父階節點中任意改變自身位置與大小 聽起來更偏向自適配
但缺點為設置繁雜 變動節點或是設置父階大小時 裡面的子節點都可能變動
特別像是子階裡面若是有帶數值的組件(progressbar) 就會影響正確性

那麼除此之外 大家都怎麼做到相關的版面編排?

目前正在看Layout的可能性

也有看到官方寫到fex的屬性
https://docs.cocos.com/creator/2.1/manual/zh/extension/layout-ui-element.html
看起來比較合理 但講得不清不楚 是指發布之後的手動調整? 呵呵

#2

可以看看麒麟子的棋牌适配方案，论坛里好像删帖了，csdn应该有

#3

感謝 有去看過了 好方便啊 頭髮白掉了

#4

非要卡死的话 按照比例锁死位置 根据屏幕适配改变大小 不过可能会变形很离谱 慎用

#5

@1226085293 推薦的麒麟子使用監聽後 resize cc.view.getFrameSize() 是真的可行 所見即所得

#6

完美适配，定宽定高要弄成动态的

比如设计分辨率是：750 * 1334
当前设备分辨率：高 / 宽 > 1334 / 750 这种情况定宽，反之才定高

然后子节点位置按百分比适配（下面这种要考虑锚点位置）
比如适配一个按钮位置：按钮的设计x * 设备宽 / 750，按钮的设计y * 设备高 / 1334

然后是背景适配，最简单的就是取宽高比最大的值来缩放
this.background.scale = Math.max(设备宽 / 750, 设备高 / 1334)

3赞
#7

这种东西 你还是要看需求的 万一让你从ipad适配到iphonex那 哈哈

#8

对的 ，我也用这个尺寸与方法

#9

麒麟子的适配方案就是从iPAD适配到iPHONEX

1赞
#10

感謝 這思路真的好用 謝謝分享

#11

哎呀 我們是不是釣出本尊拉 XD