Collapse
Your task is to create a diagonal line at a perfect 45-degree angle that dynamically adjusts for the screen’s aspect ratio. This ensures that the line remains at the correct angle, regardless of the screen dimensions. In the previous problem, the diagonal line was defined directly using UV coordinates. However, this approach did not account for variations in the screen's width and height, which could distort the angle.
To solve this problem, you will need to calculate the screen’s aspect ratio using the
u_resolution
uniform. The aspect ratio is the ratio of the screen's width to its height. With this value, you can scale
the
x-coordinate of the UV coordinates, effectively compensating for the aspect ratio. This adjustment ensures
that the line remains at a consistent 45-degree angle across all screen sizes.
After modifying the UV coordinates, use the smoothstep
function to create a smooth gradient
along
the diagonal. The gradient should blend from black to white across a small range, with the transition
centered
on the diagonal line. The result will be a visually smooth and perfectly aligned 45-degree gradient line.
When implemented correctly, the output will display a diagonal line running from the bottom-left to the top-right of the screen, with a smooth transition from black to white, regardless of the screen dimensions or aspect ratio.
Fetching Status...