使用背景
為了在ui中使用特效層,專案canvas採用了screen space-camera型別
ui的scale mode 選擇的是scale with screen size 的expand,畫布大小填的是1334, 750
在該選擇下,會自動根據解析度適配寬度/高度。
自動適配的規則是:
螢幕實際寬高比值的 < 畫布大小的寬高比值 採用以寬度縮放
螢幕實際寬高比值的 > 畫布大小的寬高比值 採用以高度縮放
screen.width/screen.height < 1334/750
實際問題
1.血條或者頭頂的ui,跳字的位置會有偏差,根據3d座標轉2d座標的介面得到的座標(camera.main.worldtoscreenpoint)已經不適用了,需要做縮放。
縮放的解決方式:
以寬縮放,需要以寬的縮放比例去縮放高
ratio = 1334/screen.width
x = screen2d.x * ratio - screen.width/2 // 以寬度的比例求出x值(減去螢幕大小的一半是因為錨點在中心)
y = (screen2d.y - screen.height/2) * ratio // 直接以寬的比例求出y值
以高縮放,需要以高的縮放比例去縮放高
ratio = 750/screen.height
x = (screen2d.x - screen.width/2) * ratio // 直接以高的比例求出x值
y = screen2d.y * ratio - screen.height/2 // 以高度的比例求出y值(減去螢幕大小的一半是因為錨點在中心)
ui使用該座標即可完美的適配
2.當遇到ipad這種寬高度比低的會以寬度適配,導致上下留白。
解決方式讓ui做高些,現在還沒做一些其他嘗試。先臨時處理
3.劉海屏
待解決
rn適配手機螢幕
適配手機螢幕,寬 高 字型 use strict import react from react import from react native var uiwidth 375 var uiheight 667 這裡的值,是設計稿中的高度iphone6 var pixel 1 pixelratio...
手機端螢幕適配
2.常見的移動端適配方法 適配方案有很多種,常見的方法有以下幾種 3.rem適配原理 rem是相對長度單位,可以做到一樣的取值,在不同尺寸的螢幕上的大小按比例縮放。rem的定義 rem font size of the root element 是相對於根元素 即html元素 font size計算...
Unity開發中劉海屏手機的螢幕適配
unity ugui在劉海屏手機的螢幕適配主要是針對iphonex的適配。解決方法是每乙個介面的最上層都是乙個橫縱stretch自動拉伸的,當檢測到當前是iphonex時,開啟介面 自動設定left top right bottom 為44.通過解析度來判斷當前手機是不是iphonex。自適應iph...