C++ 使用openGL着色器倾斜图像

C++ 使用openGL着色器倾斜图像,c++,opengl,glsl,sfml,C++,Opengl,Glsl,Sfml,为了减轻艺术家的工作量,我正在为图像制作一个裸体骨骼动画系统。我已经概念化了所有部件的工作原理。但要让它以我想要的方式动画化,我需要能够实时扭曲图像。(如果我不能做到这一点,我仍然知道如何使其工作,但如果我可以倾斜图像以添加透视效果,它会更漂亮) 我使用的是SFML,它不支持图像倾斜。有人告诉我需要在图像上使用OpenGL着色器,但我得到的所有建议都是“学习GLSL”。所以我想也许有人能帮我一点忙 有人知道我应该从哪里开始吗?或者怎么做 基本上,我希望能够对图像进行去雾处理,以获得透视效果(如下

为了减轻艺术家的工作量,我正在为图像制作一个裸体骨骼动画系统。我已经概念化了所有部件的工作原理。但要让它以我想要的方式动画化,我需要能够实时扭曲图像。(如果我不能做到这一点,我仍然知道如何使其工作,但如果我可以倾斜图像以添加透视效果,它会更漂亮)

我使用的是SFML,它不支持图像倾斜。有人告诉我需要在图像上使用OpenGL着色器,但我得到的所有建议都是“学习GLSL”。所以我想也许有人能帮我一点忙

有人知道我应该从哪里开始吗?或者怎么做

基本上,我希望能够对图像进行去雾处理,以获得透视效果(如下面的模型所示)


左侧的图像在顶部和底部倾斜。右侧的图像在左侧和右侧倾斜。

下面的着色器(未优化)是如何在GLSL中倾斜纹理的示例。理想情况下,您可能希望在常规程序中实际预计算变换矩阵,并将其作为统一传递,这样就不会在着色器的每个移动中重新计算变换。如果仍要在着色器中计算变换,请将倾斜因子作为一致性传入。否则,每次要更改倾斜因子时,都必须打开着色器并对其进行编辑

这也适用于屏幕对齐的四边形

Vert

attribute vec3 aVertexPosition;

varying vec2 texCoord;

void main(void){
   // Set regular texture coords
   texCoord = ((vec2(aVertexPosition.xy) + 1.0) / 2.0);

   // How much we want to skew each axis by
   float xSkew = 0.0;
   float ySkew = 0.0;

   // Create a transform that will skew our texture coords
   mat3 trans = mat3(
      1.0       , tan(xSkew), 0.0,
      tan(ySkew), 1.0,        0.0,
      0.0       , 0.0,        1.0
   );

   // Apply the transform to our tex coords
   texCoord = (trans * (vec3(texCoord.xy, 0.0))).xy;

   // Set vertex position
   gl_Position = (vec4(aVertexPosition, 1.0));
}
Frag

precision highp float;

uniform sampler2D sceneTexture;

varying vec2 texCoord;

void main(void){
   gl_FragColor = texture2D(sceneTexture, texCoord);
}

这比我想象的要简单得多。SFML有一个vertexArray类,它允许在不需要使用openGL的情况下绘制自定义四边形

我最终使用的代码如下(对于遇到此问题的任何其他人):

要绘制它,您可以在通常告诉窗口绘制内容的地方调用以下代码

window.draw(lines,&texture);

如果要扭曲图像,只需更改角的位置。效果很好。有了这些信息,您应该能够创建一个自定义的可绘制类。您需要编写一些代码(设置位置、旋转、倾斜等),但您只需要更改角点的位置并进行绘制。

我不熟悉SFML。然而,这取决于你倾斜的是什么,这可能非常容易。如果需要渲染整个场景,然后进行倾斜,则必须学习如何渲染到纹理。如果您只需要一些已扭曲的库存纹理,那么只需根据其他人在此处提出的问题调整着色器中的纹理矩阵即可。对于学习着色器,您应该研究如何在此处编写它们:您不需要着色器来扭曲图像。渲染到纹理,然后对其进行定位enough@BSFML无法在三维空间中定位。所以我不知道该怎么做。SFML只是创建了一个窗口。你需要在家里做opengl@B你有什么推荐的教程吗?(是的,我也在用谷歌搜索它,但我假设你比我更了解openGL,所以你会更清楚该去哪里寻找)
window.draw(lines,&texture);