滚动背景图像,不能隐藏接缝,C++ raylib
scrolling background image, can't hide seams, c++ raylib
我正在尝试让滚动背景在背景图像小于程序 window 的情况下工作。为此,我创建了一个 for 循环来移动两组相同的复制图像。
奇怪的是,这两组图像一直在分开,而不是在一起,天衣无缝。
这是使用 C++ 和 raylib,但在四处搜索后我不确定这是一个特定于 raylib 的问题。
这是一个例子,说明它们如何渐行渐远而不是保持无缝:
代码如下:
#include "raylib.h"
int main()
{
//preamble
const int windowW{600};
const int windowH{380};
float dt{0}; // for use with delta time between frames
SetTargetFPS(60);
InitWindow(windowW, windowH, "walk");
//backgrounds
Texture2D bg = LoadTexture("textures/far-buildings.png"); // 256 X 192
const float bgScale{0.5};
const int bgQty{2};
float bgX{0.0};
float bgX2{(bg.width * bgScale * bgQty)};
while (!WindowShouldClose())
{
//start drawing
BeginDrawing();
ClearBackground(WHITE);
dt = GetFrameTime();
bgX -= 250 * dt;
bgX2 -= 250 * dt;
if (bgX < -(bg.width * bgScale) * bgQty)
{
bgX = (bg.width * bgScale) * bgQty;
}
if (bgX2 < -(bg.width * bgScale) * bgQty)
{
bgX2 = (bg.width * bgScale) * bgQty;
}
for (int i = 0; i < bgQty; i++)
{
Vector2 bgPos{bgX + ((bg.width * bgScale) * i), 0.0};
Vector2 bgPos2{bgX2 + ((bg.width * bgScale) * i), 0.0};
DrawTextureEx(bg, bgPos, 0.0, bgScale, WHITE);
DrawTextureEx(bg, bgPos2, 0.0, bgScale, WHITE);
}
DrawText(FormatText("dt: %f", dt), 3, windowH - 10, 10, GOLD);
EndDrawing();
}
UnloadTexture(bg);
CloseWindow();
}
这是背景图片:
您使代码过于复杂。要获得重复,只需制作一个比源图像大的源矩形(UV 坐标),OpenGL 就会重复它。将源矩形设置为与屏幕大小相同,并在滚动时仅偏移源矩形原点。
这是一个简单的例子。
https://github.com/JeffM2501/TestFrame/discussions/12
我正在尝试让滚动背景在背景图像小于程序 window 的情况下工作。为此,我创建了一个 for 循环来移动两组相同的复制图像。
奇怪的是,这两组图像一直在分开,而不是在一起,天衣无缝。
这是使用 C++ 和 raylib,但在四处搜索后我不确定这是一个特定于 raylib 的问题。
这是一个例子,说明它们如何渐行渐远而不是保持无缝:
代码如下:
#include "raylib.h"
int main()
{
//preamble
const int windowW{600};
const int windowH{380};
float dt{0}; // for use with delta time between frames
SetTargetFPS(60);
InitWindow(windowW, windowH, "walk");
//backgrounds
Texture2D bg = LoadTexture("textures/far-buildings.png"); // 256 X 192
const float bgScale{0.5};
const int bgQty{2};
float bgX{0.0};
float bgX2{(bg.width * bgScale * bgQty)};
while (!WindowShouldClose())
{
//start drawing
BeginDrawing();
ClearBackground(WHITE);
dt = GetFrameTime();
bgX -= 250 * dt;
bgX2 -= 250 * dt;
if (bgX < -(bg.width * bgScale) * bgQty)
{
bgX = (bg.width * bgScale) * bgQty;
}
if (bgX2 < -(bg.width * bgScale) * bgQty)
{
bgX2 = (bg.width * bgScale) * bgQty;
}
for (int i = 0; i < bgQty; i++)
{
Vector2 bgPos{bgX + ((bg.width * bgScale) * i), 0.0};
Vector2 bgPos2{bgX2 + ((bg.width * bgScale) * i), 0.0};
DrawTextureEx(bg, bgPos, 0.0, bgScale, WHITE);
DrawTextureEx(bg, bgPos2, 0.0, bgScale, WHITE);
}
DrawText(FormatText("dt: %f", dt), 3, windowH - 10, 10, GOLD);
EndDrawing();
}
UnloadTexture(bg);
CloseWindow();
}
这是背景图片:
您使代码过于复杂。要获得重复,只需制作一个比源图像大的源矩形(UV 坐标),OpenGL 就会重复它。将源矩形设置为与屏幕大小相同,并在滚动时仅偏移源矩形原点。
这是一个简单的例子。 https://github.com/JeffM2501/TestFrame/discussions/12