背景循环滚动有黑边或者闪烁

  • Creator 版本:3.8.5

  • 目标平台:测试平台Chrome
    (十分重要,别简单的就说“原生”或者“网页”)–>

  • 重现方式:滚动时偶尔会出现

  • 首个报错:控制台没报错

项目设置 720 * 1280 适配高度
两种背景图 720 * 1280
适配设计分辨率或者不同手机型号会出现闪烁线条或者两图之间有空隙
尝试过 ± 2/3 但也会出现
估计时update的y不是整数,当速度快的时候明显
望各位大哥给给解决方案~ 谢谢

import { _decorator, Component, Node, Size, UITransform, view } from ‘cc’;

const { ccclass, property } = _decorator;

@ccclass(‘bg_controller’)

export class bg_controller extends Component {

public speed:number = 200;

public sw:number = 0

public sh:number = 0

start() {

    // const screen = view.getVisibleSize()

    // this.sw = screen.width

    // this.sh = screen.height

    // for(let nodes of this.node.children){

    //     let bgUITransform = nodes.getComponent(UITransform)

    //     // bgUITransform.setContentSize(new Size(bgUITransform.contentSize.x, this.sh))

    //     nodes.setScale(nodes.scale.x, this.sh/bgUITransform.height)

    // }

 

}

update(deltaTime: number) {

    const bgNodes = this.node.children

    bgNodes.forEach((bgNode)=>{

        bgNode.setPosition(bgNode.position.x, bgNode.position.y + this.speed*deltaTime)

        if(bgNode.position.y >= 1278){

            bgNode.setPosition(bgNode.position.x, -1280)

        }

    })

}

}

你这只在update中修改了y,x是不变的,按理说左右不会有黑边的啊,在没有滚动的时候左右有黑边的吗?还是滚动的时候才慢慢增加?还是在切换分辨率的时候产生?是不是没有加Widget组件?Y轴问题,我怀疑是这个原因:你在update函数中分别更新了两个图片的y坐标,开始的时候两张图片的无缝相连的,随着时间的推移,因为小数点的原因,两张图片相对的偏移就会越来越大,以至于出现黑边,速度越快,偏移越大。解决方法是:只更新一张图片的y轴,另一张根据相对第一张的位置加。例如:开始的时候第一张的图片Y是100,第二图Y是300。那么你update中根据速度求得图一的y1,第二张就是y1+200。不要分别去求,要始终保持相对。

抄cocos打飞机项目里的背景滚动代码就好了

其实就是Y的小数点问题,只要控制好速度,就不会出现这问题~ 谢谢