解决两张背景图轮换过程中出现缝隙的问题-优快云博客

本文探讨了横版游戏中使用多张图片轮番显示作为动态背景时可能出现的缝隙问题，并提供了通过调整缓冲图片位置的方法来解决这一问题。同时，也指出了在实现过程中需要注意的节点显示问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

　　横版游戏中有用到多张图片轮番显示作为动态背景。但我在实际项目中，发现图片在滚动时有可能出现缝隙，影响了游戏体验。经过分析，这是因为重置缓冲图片时产生了时间差。

　　轮番显示的原理就是一张图片滚动，另外一张作为缓冲，滚动出屏幕的图片继而替补成为缓冲，这样周而复始地轮换下去。

举一个例子：

void TestSprite::onEnter()
{
	CCLayer::onEnter();

	CCActionInterval *move1 = CCMoveBy::create(5, ccp(-480, 0));
	CCCallFunc *moveagain = CCCallFunc::create(this, callfunc_selector(TestSprite::callback));
	CCActionInterval *move2 = CCMoveBy::create(10, ccp(-960, 0));

	CCSequence *seq = CCSequence::create(move1, moveagain, NULL);

	m_bg1->runAction(seq);
	m_bg2->runAction(move2);
}

void TestSprite::callback()
{
	m_bg1->setPositionX(480);
	CCActionInterval *move = CCMoveBy::create(10, ccp(-960, 0));
	m_bg1->runAction(move);
}

　　m_bg1和m_bg2引用两个白色不透明的CCLayerColor，大小和屏幕一致，它们一开始向左移动屏幕宽度的距离。由于是同时启动，因此一开始是不会出现缝隙的。但是在m_bg1移出屏幕后，回到了屏幕右边作为缓冲进入屏幕，之后就出现了缝隙。这是为什么呢？

　　原来在m_bg1“置为缓冲”的过程中，m_bg2还在马不停蹄的移动着。这个缝隙就是m_bg1置为缓冲的那段时间双方拉开的距离，虽然很小，但是也很显眼。

　　从m_bg1开始调用callback函数到调用完毕所花去的时间，看样子是不可避免的消耗掉了。

解决办法：

　　因此，想要不出现缝隙，我想到的办法就是m_bg1置为缓冲的时候，其位置稍微往前一点，和m_bg2重合一点点，这样就把缝隙“补”上了。但既然已经往前移动了一点，总的移动距离又不能变，就不能再使用相对位移动作MoveBy了，只好用MoveTo来指定一个绝对的位置。见代码：

m_bg1->setPositionX(480 - 5);
CCActionInterval *move = CCMoveTo::create(10, ccp(-480, 0));
m_bg1->runAction(move);

　　这样缝隙就不见了。

新的问题：

　　但是这里又有一个小问题，那就是两个层之间出现了重叠。而项目中经常会在层上加入其它节点，那么如果节点出现在重叠区域，将会出现显示问题（也将被覆盖掉一部分）。因此在实际开发中，要注意避免节点出现在这样的区域。

转载于:https://www.cnblogs.com/demon90s/p/4400960.html