CocosCreator 螢幕適配

2021-10-21 18:30:51 字數 1347 閱讀 2753

首先說下設計解析度和螢幕解析度

設計解析度

cocos官方說是內容生產者在製作場景時使用的解析度藍本,其實就是開發者搭介面,美術大大產出ui效果圖的解析度。這個解析度是根據裝置來設定的。

螢幕解析度

遊戲在裝置上執行時的十幾螢幕顯示解析度

如何確定設計解析度

** 常用的手機解析度**

華為mate9 1080x1920 16:9 (1.77)

華為mate40 pro 2772 x 1344 (2.06)

小公尺11 3200×1440 (2.22)

iphone11 1792x828 (2.16)

iphone12 2532 x 1170 (2.16)

iphone12 pro 2532 x 1170 (2.16)

iphone12 pro max 2778×1284 (2.16)

** 常用的設計解析度**

解析度 canvas高寬(美術效果圖) 遊戲背景圖高寬

16:9 640x1140 640x1430

16:9 720x1280 720x1600

2:1 640x1280 640x1430

2:1 720x1440 720x1600

一般手機最高2.22:1,背景的長度需要能達到這個高度,不然會出現黑框。

橫版遊戲,一般採用16:9的設計解析度,匹配iphone5~iphone8以及幾乎全部安卓手機

適配方案

1. fit height

設計解析度寬高比大於螢幕解析度,適配高度避免黑邊(兩邊可能出現黑邊)

2. fit width

設計解析度寬高比小於螢幕解析度,適配寬度避免黑邊(上下可能出現黑邊)

3. show all

同時勾選fit height和fit width,高寬都是100%顯示(不會裁剪,上下左右都可能有黑框)

4. no border

同時不勾選fit height和fit width,此時無論螢幕寬高比多少都不會產生黑邊。也就是說,當設計解析度寬高比大於螢幕解析度時,會適配高度;設計解析度寬高比小於螢幕解析度時,會適配寬度。

iphonex適配

按照官方文件橫屏fix height 設計解析度 1280* 720,背景圖 1600720

豎屏的話fix width 設計解析度7201280,背景圖 720* 1600

同時用widget節點對遊戲中貼邊的ui節點進行對齊,就可以完美適配了

web app變革之rem(手機螢幕實現全適配)

以往web移動適配,常規寫法是 media only screen media only screen and min device width 320px media only screen and min device width 320px and webkit min device pixe...

cocos creator 十二 問題

1 socket為什麼不能使用 2 cocos類之攝像機使用問題 1 在使用socket為什麼不能使用 if cc.sys.isnative opts this sio window.io connect this.ip opts this sio.on connect function data ...

cocos creator模組簡介

專案 專案設定 選擇將在構建發布時要打包進引擎的模組 模組如下 core 必選 canvas 必選,畫布 sprite 必選,精靈 label 文字控制項 mask 遮罩控制項 ccspritedistortion 扭曲效果元件,用於改變 型別sprite的渲染,只有當sprite元件已經新增後,才...