[FIXED] My "Polka Dots" aren't round!

Ok, so it seems the aspect ratio of the polka dots (from filter.polkaDots) are being distorted by the aspect ratio of the screen. The only way to make them round is to set the same screen width and height in your config.lua - unfortunately that’s not very practical.

Can this be fixed please? Or call it polkaElipses :-).

Ian

There’s no automatic way of doing this as corona can’t know what your goals are for the screen.

You have a couple of options:

  1. Use a zoom mode such as letterbox that never involves distorting the aspect ratio or

  2. Calculating the changed aspect ratio yourself and altering what you draw onscreen.

The simplest would be letterbox mode.

I assume you want to fill the device screen completely, so just make a much larger background image.

Thanks for the pointers rakoonic.

There is no config.lua, I’m just using the contentWidth/Height to get the actual screen size. Why would that create distortion? What is it doing? It looks to me in the screenshot as if the centres of the circles are equally spaced as you’d expect… it’s just the circles themselves that are squashed. Any ideas are appreciated as I think I may have misunderstood your comments :-|.

I suggest:

(1) Change the size of the object to be square. ie: You don’t have to make the object match the size of the screen. Take the largest size in either direction and apply that to both the width and height of your object.

(2) Play with the polkaDots parameters until each dot has the look you want.

I’ve never tried not having a config.lua, but we have to default to something, so it’s possible that it’s defaulting to zoomStretch or something like that.  Is there a reason you don’t have a config.lua?

Rob

Rob it should default to a 1 to 1 pixel mapping if a width and height aren’t specified, although I must admit I have no clue as to what corona does when no config file exists as I’ve never done it.

Spideri - I missed first time around that you are using a filter to generate the dots. Could you post the code you are using so we can reproduce and play with it?

Here is the code:

display.setDefault( "textureWrapX", "repeat" ) display.setDefault( "textureWrapY", "mirroredRepeat" ) local \_W, \_H = display.contentWidth, display.contentHeight print(\_W, \_H) local snapshot = display.newSnapshot(\_W, \_H) snapshot.x = \_W \* 0.5 snapshot.y = \_H \* 0.5 snapshot.fill.effect = "filter.polkaDots" snapshot.fill.effect.numPixels = 50 snapshot.fill.effect.dotRadius = 1 local rectT = display.newRect(snapshot.group, 0, 0, \_W, \_H) rectT.fill = { type="image", filename="myImage.png" } rectT.fill.scaleX = 0.5 rectT.fill.scaleY = 0.25 rectT.fill.x = 0.5 local function updateGame(e) rectT.fill.rotation = rectT.fill.rotation + 0.03 snapshot:invalidate() end Runtime:addEventListener("enterFrame", updateGame)

There was no particular reason for not using the config.lua file, we were just testing out the effect. However even with the following config.lua, the polkadots are still elipses.

-- config.lua application = { content = { fps = 60, width = 640, height = 960, scale = "letterbox", }, }

@albert90 “Change the size of the object to be square. ie: You don’t have to make the object match the size of the screen. Take the largest size in either direction and apply that to both the width and height of your object.” 

That’s fine if the object is just a plain rect, but what about if it’s an image? Although it’s being distorted by an effect, it still needs to keep it’s resemblance to the original image, which I realise is dependant on the filter settings. A picture of the empire state building would look strange if it was set to be square (it would also look strange being made of polka dots, but that’s another matter).

Play with the polkaDots parameters until each dot has the look you want.

There are 2 parameters as far as I can see: dotRadius and numPixels. Neither of these control the shape of the dots, only the size.

numPixels changes the area which each dot can occupy, and the dotRadius simply gives you a bigger elipse within that area.

Making the snapshot square just by setting the dimensions to (_W, _W)  makes the polka dots round, so it looks like something weird is going on internally within the filter…

@AlanPlantPot: You’re right. I’ve added an “aspectRatio” parameter to the polkaDots filter. Look for it in the next daily build.

Set it to “object.width / object.height” and your dots will be round again.

Ok great, I’ll give that a try once it’s ready.

There’s no automatic way of doing this as corona can’t know what your goals are for the screen.

You have a couple of options:

  1. Use a zoom mode such as letterbox that never involves distorting the aspect ratio or

  2. Calculating the changed aspect ratio yourself and altering what you draw onscreen.

The simplest would be letterbox mode.

I assume you want to fill the device screen completely, so just make a much larger background image.

Thanks for the pointers rakoonic.

There is no config.lua, I’m just using the contentWidth/Height to get the actual screen size. Why would that create distortion? What is it doing? It looks to me in the screenshot as if the centres of the circles are equally spaced as you’d expect… it’s just the circles themselves that are squashed. Any ideas are appreciated as I think I may have misunderstood your comments :-|.

I suggest:

(1) Change the size of the object to be square. ie: You don’t have to make the object match the size of the screen. Take the largest size in either direction and apply that to both the width and height of your object.

(2) Play with the polkaDots parameters until each dot has the look you want.

I’ve never tried not having a config.lua, but we have to default to something, so it’s possible that it’s defaulting to zoomStretch or something like that.  Is there a reason you don’t have a config.lua?

Rob

Rob it should default to a 1 to 1 pixel mapping if a width and height aren’t specified, although I must admit I have no clue as to what corona does when no config file exists as I’ve never done it.

Spideri - I missed first time around that you are using a filter to generate the dots. Could you post the code you are using so we can reproduce and play with it?

Here is the code:

display.setDefault( "textureWrapX", "repeat" ) display.setDefault( "textureWrapY", "mirroredRepeat" ) local \_W, \_H = display.contentWidth, display.contentHeight print(\_W, \_H) local snapshot = display.newSnapshot(\_W, \_H) snapshot.x = \_W \* 0.5 snapshot.y = \_H \* 0.5 snapshot.fill.effect = "filter.polkaDots" snapshot.fill.effect.numPixels = 50 snapshot.fill.effect.dotRadius = 1 local rectT = display.newRect(snapshot.group, 0, 0, \_W, \_H) rectT.fill = { type="image", filename="myImage.png" } rectT.fill.scaleX = 0.5 rectT.fill.scaleY = 0.25 rectT.fill.x = 0.5 local function updateGame(e) rectT.fill.rotation = rectT.fill.rotation + 0.03 snapshot:invalidate() end Runtime:addEventListener("enterFrame", updateGame)

There was no particular reason for not using the config.lua file, we were just testing out the effect. However even with the following config.lua, the polkadots are still elipses.

-- config.lua application = { content = { fps = 60, width = 640, height = 960, scale = "letterbox", }, }

@albert90 “Change the size of the object to be square. ie: You don’t have to make the object match the size of the screen. Take the largest size in either direction and apply that to both the width and height of your object.” 

That’s fine if the object is just a plain rect, but what about if it’s an image? Although it’s being distorted by an effect, it still needs to keep it’s resemblance to the original image, which I realise is dependant on the filter settings. A picture of the empire state building would look strange if it was set to be square (it would also look strange being made of polka dots, but that’s another matter).

Play with the polkaDots parameters until each dot has the look you want.

There are 2 parameters as far as I can see: dotRadius and numPixels. Neither of these control the shape of the dots, only the size.

numPixels changes the area which each dot can occupy, and the dotRadius simply gives you a bigger elipse within that area.

Making the snapshot square just by setting the dimensions to (_W, _W)  makes the polka dots round, so it looks like something weird is going on internally within the filter…

@AlanPlantPot: You’re right. I’ve added an “aspectRatio” parameter to the polkaDots filter. Look for it in the next daily build.

Set it to “object.width / object.height” and your dots will be round again.

Ok great, I’ll give that a try once it’s ready.