Massive black bar at the top of iPad screens

Hello everyone, I have come across a problem when dealing with iPad screens. There is a large black bar at the top of the screen, and I can’t get rid of it, even if I add more filler to my Tiled map. I don’t want to move the y position of the map up because it will affect how the map looks like on smaller devices like phones.

This is what it looks like for the different iPads:

Any tips would be great, thank you.

Please show us your config.lua file.

config.lua:

application = { content = { width = 640, height = 960, scale = "letterBox", fps = 30, --[[imageSuffix = { ["@2x"] = 2, }, --]] }, --[[-- Push notifications notification = { iphone = { types = { "badge", "sound", "alert", "newsstand" } } }, --]] }

I know you have SSK2
 
You’re probably not aware of this, but it detects what I call ‘unused’ space, both horizontally and vertically.
 
Assuming your level is in a group, off the cuff I think the fix would be something like this:

if(unusedHeight ~= 0) then -- or is unusedWidth I may be goofed up here?? group.y = group.y - unusedHeight/2 end

PS - The whole unused* name is a bit of misnomer, but it is legacy for SSK so I didn’t change it.  Basically either unusedWidth or unusedHeight will be non-zero for a letterbox scaling case where the aspect ratio does not match the content resolution aspect ratio.  This results in those ‘black’ bars that new users often encounter.  

For example, if the unusedHeight is 80, the there is a 40 pixel tall bar at the top and bottom of the screen.

In your case, you’re over-drawing the bottom area, but your top of  screen is offset.

Wow, thanks, I’ll give it a shot!

Oh wow, thanks it worked perfectly, and it does not affect the smaller phones! This is perfect.

Also, SSK2 comes to the rescue with another quick fix.

You could do this too:

group.x = left group.y = top

This would force align your level group with the upper-left corner of the screen.

Tip: You might want to push your controls down by unusedHeight/2 when you adjust.

That is assuming they are in the same group.

Please show us your config.lua file.

config.lua:

application = { content = { width = 640, height = 960, scale = "letterBox", fps = 30, --[[imageSuffix = { ["@2x"] = 2, }, --]] }, --[[-- Push notifications notification = { iphone = { types = { "badge", "sound", "alert", "newsstand" } } }, --]] }

I know you have SSK2
 
You’re probably not aware of this, but it detects what I call ‘unused’ space, both horizontally and vertically.
 
Assuming your level is in a group, off the cuff I think the fix would be something like this:

if(unusedHeight ~= 0) then -- or is unusedWidth I may be goofed up here?? group.y = group.y - unusedHeight/2 end

PS - The whole unused* name is a bit of misnomer, but it is legacy for SSK so I didn’t change it.  Basically either unusedWidth or unusedHeight will be non-zero for a letterbox scaling case where the aspect ratio does not match the content resolution aspect ratio.  This results in those ‘black’ bars that new users often encounter.  

For example, if the unusedHeight is 80, the there is a 40 pixel tall bar at the top and bottom of the screen.

In your case, you’re over-drawing the bottom area, but your top of  screen is offset.

Wow, thanks, I’ll give it a shot!

Oh wow, thanks it worked perfectly, and it does not affect the smaller phones! This is perfect.

Also, SSK2 comes to the rescue with another quick fix.

You could do this too:

group.x = left group.y = top

This would force align your level group with the upper-left corner of the screen.

Tip: You might want to push your controls down by unusedHeight/2 when you adjust.

That is assuming they are in the same group.