New button screen positioning bug - affects buttons with images

If you run the code below (substitute the image for btn1 with something you have) you will see that the same x = display.contentWidth / 2, in the widget creation does not end with the same result (see attached screenshot).

If you comment out that 

x = display.contentWidth / 2,

and uncomment the 

btn1.x = display.contentWidth / 2

You will find that your button with image now is placed nicely in the centre of the screen. So this is something you can workaround but still will drive you mad until you figure out what’s going on. 

Case # 29959 filed for this.

local widget = require( "widget" ) btn1 = widget.newButton{ id = "btn1", top = 50, x = display.contentWidth / 2, -- \<-- This is not working overFile = "images/clear.png", defaultFile = "images/clear.png", width = 50, height = 50, } btn1.anchorX, btn1.anchorY = 0.5, 0 -- btn1.x = display.contentWidth / 2 btn2 = widget.newButton{ id = "btn2", top = 200, x = display.contentWidth / 2, width = display.contentWidth - 20, height = 50, fontSize = 40, label = "Test button with no Image", } btn2.anchorX, btn2.anchorY = 0.5, 0

I’ve used “button.png” for my image…

I’ve also used x,y in the button definition, instead of top,x.

What I think is happening is that the button creation function does not use either x,y value if only one of them exists. The code below works:

local btn1 = widget.newButton{ id = "btn1", -- top = 50, x = display.contentWidth / 2, -- \<-- This is not working y=150, overFile = "button.png", defaultFile = "button.png", width = 50, height = 50, } btn1.anchorX, btn1.anchorY = 0.5, 0 -- btn1.x = display.contentWidth / 2

Got it. So rule of thumb, don’t mix top/left with x/y in the button creation. Thanks

Just heard from CL staff indicating that this is indeed a usage issue and documentation will be updated to reflect the need to pass to the constructor either top and left coordinates, or x and y coordinates. I’m marking this as closed in my spreadsheet. 

Hi Kerem, This applies to all widgets - either both x and y, or top and left. Better implementation of widgets would be to throw a warning in the console, as probably many users get thrown off.

I’ve used “button.png” for my image…

I’ve also used x,y in the button definition, instead of top,x.

What I think is happening is that the button creation function does not use either x,y value if only one of them exists. The code below works:

local btn1 = widget.newButton{ id = "btn1", -- top = 50, x = display.contentWidth / 2, -- \<-- This is not working y=150, overFile = "button.png", defaultFile = "button.png", width = 50, height = 50, } btn1.anchorX, btn1.anchorY = 0.5, 0 -- btn1.x = display.contentWidth / 2

Got it. So rule of thumb, don’t mix top/left with x/y in the button creation. Thanks

Just heard from CL staff indicating that this is indeed a usage issue and documentation will be updated to reflect the need to pass to the constructor either top and left coordinates, or x and y coordinates. I’m marking this as closed in my spreadsheet. 

Hi Kerem, This applies to all widgets - either both x and y, or top and left. Better implementation of widgets would be to throw a warning in the console, as probably many users get thrown off.