java - LWJGL:将 "curve"应用于景观

Question

我有兴趣创建类似于游戏《动物森友会》的着色器效果(不要因为使用这个示例而射击我)。当您沿着地形向前和向后移动时，世界会“弯曲”，给人一种在圆形表面上的感觉。问题是，我想将这种效果应用于 2D 横向卷轴游戏。

想象一下像泰拉瑞亚这样的游戏，屏幕的两端(左侧和右侧)稍微向下弯曲，以产生曲率的错觉。

我试图找到一篇文章来解释如何实现这样的效果，但我没有太多有用的方向指示。我知道这不是最有组织或提出得最好的问题，但任何帮助将不胜感激。

Answer 1

虽然我不喜欢回答自己的问题，但我想我已经找到了一种实现这种效果的方法并愿意分享。通过设置基本的顶点着色器，我能够根据顶点距屏幕中心(在本例中为原点)的距离来操纵顶点沿 y 轴的位置。我最初使用线性绝对值方程来看看它是如何工作的，我得到了这样的结果: 这显然是一个奇怪的效果，但它非常接近我想要实现的效果。我想我还会尝试通过将顶点距原点的距离的绝对值除以某个标量来平衡效果。我从 32 开始，结果更合理:

正如您所看到的，地形只有轻微的弯曲。

这一切都很好，但它还不是一条“曲线”。它只是一个颠倒的“V”形，经过一点挤压。因此，从这里开始，通过使用抛物线并以相同的方式将其展平，可以轻松地应用一条漂亮的曲线。结果是这样的: 结果是一条非常漂亮的曲线，我可以将其修改为我想要的任何强度。我还尝试应用三阶方程图，但它给人更多的尝试 3D 感觉。我想我可以应用圆图，这样当我在具有指定半径的行星上时，我就可以准确地获得正确的曲线，但我现在很满意。

代码只有几行长。以下是顶点着色器的 GLSL 代码:

#version 150

varying vec4 vertColor; //Just to send the color data to the fragment shader

uniform float tx; //Passed by the Java program to ensure the terrain curvature 
                  //is sinked by with player's movement, this value is usually 
                  //in the "lookThroughCamera" method where you handle the game 
                  //world's translation when the player moves

void main(void) {
    float v0 = gl_Vertex[1] - pow((gl_Vertex[0] + tx) / 64, 2); //this will be the new y-value for the vertex. 
                                                                   //It takes the original y-value and subtracts 
                                                                   //the absolute value of the x-value plus the offset 
                                                                   //on the x-axis of the player divided by 64 all to 
                                                                   //the power of 2. The division by 64 levels the 
                                                                   //curve out enough so it looks acceptable

    vec4 pos = vec4(gl_Vertex[0], v0, gl_Vertex[2], gl_Vertex[3]); //create the new position with the changed y-value
    gl_Position = gl_ModelViewProjectionMatrix * pos; //multiply it by your projection and modelview matrices
    vertColor = gl_Color.argb; //more color stuff that has nothing to do with the rest
}

编辑:这种方法确实有一个严重的问题。所有垂直线都将保持垂直，因为它们没有沿 x 轴正确移动。下图显示了这一点: 这看起来非常不自然，我还没有找到合适的解决方案。