Jump to content

[TOPIC: topicViewTemplate]
[GLOBAL: userSmallPhoto]

Shader resolution-independent/aspect ratio
Started by emanuelfrost Feb 24 2016 11:29 PM

1 reply to this topic
glsl resolution aspect coronatexelsize coronacontentscale uniforms
This topic has been archived. This means that you cannot reply to this topic.
[TOPIC: post.html]


[GLOBAL: userInfoPane.html]
  • Observer

  • 1 posts
  • Corona SDK

Problem background

(Described in a tutorial here: https://github.com/mattdesl/lwjgl-basics/wiki/ShaderLesson3)



Heres is a circle displayed with a fragment shader.




Because of x,y coordinates with the range 0-1, the circle becomes an oval when the display object isnt a square.


In this case when width > height you can multiply the texCoord.x with some aspect ratio value (resolution.x/resolution.y) to get a round circle as a result:







In corona we have the provided uniforms CoronaContentScale and CoronaTexelSize. Initially I thought those uniforms could be used to calculate the aspect and or resolution but I just cant get it right.


Right now I ended up sending this information with the vertex userdata occupying 1/4 values since the uniform userdata is a forthcoming feature.


Please help me understand and solve this problem. Thank you

[TOPIC: post.html]


[GLOBAL: userInfoPane.html]
  • Contributor

  • 848 posts
  • Corona SDK

CoronaTexelSize, as its name suggests, will tell you only about the current texture (or the first one, in the case of composite effects), which is probably a small all-white rectangle for stock display objects like circles.


If you're just getting started with this, one way to go about it would be hard-wire any constants into the shader, so for instance:

local Constants = ([[
  P_UV float scale = %f;

]]):format(display.contentWidth / display.contentHeight)

kernel.fragment = Constants .. [[
  // REST OF YOUR SHADER HERE, use 'scale' somehow

If you don't need much resolution you could also sneak that scale factor through a color channel (setFillColor() and then use CoronaColorScale() to recover it), though obviously you'd have to take more care if you still want some color!


A few other solutions are possible, but are probably a bit too involved at this stage.