java - 在 libgdx 中绘制渐变的子集

Question

我知道这个问题之前已经被访问过(比如 here )，但我想知道如何执行以下操作。在我的游戏中，我有一个滚动背景。例如，蓝色的天空底部呈浅蓝色，越高则颜色越深。使用建议的解决方案实际上不可能实现这一点:

shapeRenderer.filledRect(x, y, width, height, 
                         lightBlue, lightBlue, darkBlue, darkBlue);

因为您只能给出真正要显示的颜色。我想要一个顶部深蓝色和底部浅蓝色的渐变绘画，延伸超过例如 500 个像素。虽然我只绘制了其中的 200 个像素。这样，当背景滚动时，颜色仍然会变暗。有人知道如何使用 libgdx 做到这一点吗？

Answer 1

您想要的是在较大(例如 500 像素)渐变上看到较小(例如 200 像素)的窗口。为此，您只需要根据窗口在整体渐变中的位置计算四个角颜色的颜色，然后绘制它。 (所以不要考虑绘制整个背景，而是考虑如何绘制您需要的部分。)

由于您只是在两种颜色(0 到 500 之间)之间平滑移动，因此您正在根据窗口的位置在颜色之间进行“线性插值”(即直线估计)。 Libgdx 通过 lerp() methods on Color 支持此功能.

假设窗口沿着 Y 轴移动，类似这样的东西应该给出你想要的:

Color baseColor = lightBlue;
Color topColor = darkBlue;

int skyHeight = 500;
int windowHeight = 200;
int windowLocation = ...; // something betweeen 0 and skyHeight - windowHeight;
Color windowBottomColor = baseColor.copy().lerp(topColor, windowLocation / skyHeight);
Color windowTopColor = baseColor.copy().lerp(topColor, (windowLocation + windowHeight) / skyHeight);

现在windowBottomColor和windowTopColor应该适合调用filledRect:

shapeRenderer.filledRect(x, y, width, height, 
                         windowBottomColor, windowBottomColor, windowTopColor, windowTopColor);

请注意，“copy()”调用会为每次调用创建一个新的 Color 对象，因此您可能需要对其进行优化以避免分配。

免责声明:我还没有尝试过这段代码，所以它可能有一些愚蠢的错误，但希望它能给你正确的想法。