having trouble positioning my widget

Hello there! I searched the topics and couldn’t find a solution to this. Hopefully I am not repeating a previous question here.

I am working on an planner app using the widget API. I have created a beautiful widget which I would like to center on the bottom of my screen as well as have the background span to the left and right of the screen. I found parameters to pass to the table in an x and y variable. In the widget description it says these two variables are the x and y coordinates for the center of the tab bar widget. So, I set them as follows:

local tabBar = widget.newTabBar{
x = display.contentCenterX,
y = display.contentHeight - 25,
width = display.contentWidth,
height = 50
}

The Top variable was set to an integer, but I removed it because I know that it overrides the variables above. For some reason, no matter what number I assign to x and y, the tab bar never changes position in my app. It stays on the bottom of the app except it is positioned to the left about 50 pixels with a clear gap on the right side. Anyone understand why this might be happening?

I attached a sample image below of the preferred result.

Have you tried configuring it with left and top instead to see if that works?

I think it should be

left instead of x
and top instead of y

local tabBar = widget.newTabBar{
left = display.contentCenterX,
top = display.contentHeight - 25,
width = display.contentWidth,
height = 50
}

The man page indicates that top and left act the same way as setting anchorX and anchorY to 0, so one would want:

left = display.contentCenterX - ( display.contentWidth / 2 ),
top = display.contentHeight - 50,

(Assuming height = 50.)

However the reference does state that x,y can be used as an alternative to left, top. I had suggested trying left, top just to see if anything worked.

Yes you are right … usually i use the default for left and top then immediately I set the x and y for tabBar

local tabBar = widget.newTabBar{
left = display.contentCenterX,
top = display.contentHeight - 25,
width = display.contentWidth,
height = 50
}
tabBar.x = display.contentCenterX
tabBar.y = display.contentHeight - 25

Ah- that’s interesting!

@Faith You were setting x, y in the parameters. Maybe try doing in like @kakula does above, set top, left in the parameters and then define tabBar.x and tabBar.y afterwards.