适配问题 真心求教

最简单的 弄个大的背景图 超出的地方填充黑边

1赞

弄个长屏的背景就解决了,cc.winSize已经是转换过的屏幕尺寸了
设计分辨率直接在canvas属性面板设置,一般横屏幕选fit Height,竖屏选fit Width
代码里不需要管啥VisibleSize,DesignResolutionSize, 只用cc.winSize就足够了

@ 设计分辨率是1334 750 现在用的是苹果x的分辨率2436*1125
选择fit Height, cc.winSize获取到的就是1624x750, 你把背景图的width赋值cc.winSize.width就铺满了

PS:最佳方案, 就是换个长点的背景图.

1赞

确实是这样 最开始我把 fit Height fit Width 都勾选了 没有变化 我傻逼了。

背景可以做长点 下面的游戏内容不可能也做长点撒 所以我要获取屏幕宽度来进行缩放 感谢你的回复 我已经解决了

参考大佬麒麟子的贡献,我就是用他的,目前仅WebGL的部份无法实现,无网址列的全屏,其他基本上都有很好的比例效果
https://forum.cocos.com/t/cocos-creator-ui/77410

@285216077 刚刚想到,这样做其实有点多此一举:sweat_smile:,只需第5步即可(可以写个组件来处理)。完整demo (587.8 KB)

AutoExactFit.ts(组件只需要拖进场景就行)

const { ccclass, property } = cc._decorator;

@ccclass
export default class AutoExactFit extends cc.Component {

start() {
    let currentSize = cc.view.getCanvasSize();
    let designSize = cc.view.getDesignResolutionSize();
    let scale = this.convertScale(designSize.width, designSize.height, currentSize.width, currentSize.height);
    cc.Canvas.instance.node.scaleX = scale.scaleW;
    cc.Canvas.instance.node.scaleY = scale.scaleH;
    console.log(scale);
}

convertScale(dW: number, dH: number, cW: number, cH: number): { scaleW: number, scaleH: number } {
    let a = dW / dH;
    let b = cW / cH;
    let scaleW = 1;
    let scaleH = 1;
    if (a < b) { // 宽度比设计分辨率大,缩放W
        scaleW = b / a;
    } else { // 高度比设计分辨率大,缩放H
        scaleH = a / b;
    }
    return { scaleW: scaleW, scaleH: scaleH };
}

// update (dt) {}
}