[SOLVED] Need help with my vertex shader code

[XHH]

I'm trying to do a 2d perspective transformation using a vertex shader. Similar to the image below:


I'm currently using this shader code to try and achieve this effect:

Code: Select all

extern vec2 texSize;

number lerp(number a, number b, number t) { return a * (1.0 - t) + b * t; }
#ifdef VERTEX
vec4 position(mat4 transform_projection, vec4 vertex_position) {
	vertex_position.x += lerp(-50, 50, vertex_position.y / texSize.y);
	return transform_projection * vertex_position;
}
#endif

where texSize is {game_width, game_height}. When I draw a playing card in the middle of the screen it appears like this:

vertshaderresults.png (7.44 KiB) Viewed 5003 times

I'm very new to vertex shaders so I'm not sure what I'm doing wrong here. I'm trying to make the card look like a trapezoid shape as if it was a card sitting on a table. If someone can help me with this shader code or direct me to some kind of examples/tutorial for vertex shaders I would greatly appreciate it.

[raidho36]

You need to use the Z coordinate and perspective projection.

[XHH]

Thanks. After learning some stuff about matrix multiplication I'm now trying this:

Code: Select all

extern vec2 texSize;
extern float angle;

#ifdef VERTEX
vec4 position(mat4 transform_projection, vec4 vertex_position) {
		transform_projection *= mat4(
			1, 0, 0, 0,
			0, cos(angle), -sin(angle), 0,
			0, sin(angle), cos(angle), 0,
			1, 1, 1, 1
		);
		float z = 1 / (texSize.y - vertex_position.y);
		transform_projection *= mat4(
			z, 0, 0, 0,
			0, z, 0, 0,
			0, 0, 1, 0,
			1, 1, 1, 1
		);
		return transform_projection * vertex_position;
}
#endif

Angle is in radians. Nothing appears on the screen though, even with angle set to 0. Not sure what I'm doing wrong in my math.

Update: Here's another attempt:

Code: Select all

float z = 1 / (vertex_position.y / texSize.y);
transform_projection *= mat4(
	z, 0, 0, 0,
	0, z, 0, 0,
	0, 0, 1, 0,
	1, 1, 1, 1
);
return transform_projection * vertex_position;

Is vertex_position normalized?

[XHH]

SOLVED: I figured out a hacky way to do this with pixel shader. I didn't realize texture_coords was normalized while texSize was not. So I didn't really even need to use texSize. It's a shame the vertex shader didn't work how I thought it would though. Would be nice if there were code examples on how to use it. Here's my new pixel effect code and the result:

Code: Select all

float size = 2.0;
texture_coords.x *= lerp(size,1,texture_coords.y);
texture_coords.x -= lerp(1/size,0,texture_coords.y);
pixel = Texel(texture, texture_coords);
return pixel * color;

Screenshot_20200212_131034.png (1.94 KiB) Viewed 4926 times