Help! different display behaviors on simulator and device (letterbox mode)

Getting Started Newbie Questions
#1

Hello,

I have an app for android and iOS.

On android everything is fine (I developed on Windows).

I use landscapeRight orientation.

Now I try to build for iOS.

On the simulator, all devices show correct, perfect full content area, no black areas.

But it has unexpected black areas on left and right sides on real iPhone 5.

Then I tried iPhone4 and iPad, both show full content area without black areas.

So I am confused, the screen on real iPhone 5 displays like iPhone 4 but with black areas on left and right side. And its display.screenOriginY seems wrong so my UI on the right area is moved a little(see the attachments: screenshot on simulator and device).

I don’t bother to use to many config, I just set width = 540, height = 960, optimized for 16:9/androids.

But the ratio is much more closer to iPhone5 than iPhone4.

What bothers me is I don’t have a mac, I only use it when I build.

So I can not try some more test now.

But it is not supposed to act differently like that.

my content  width = 540, height = 960,

And I have a larger background image (even fits for pads.)

It should not have any black areas. And it only on iPhone5 devices.

my config.lua:

application =
{
    content = {
        width = 540,
        height = 960,
        scale = “letterbox”,
        fps = 30,
    },

}

build.setting:

settings = {
    
    orientation =
    {
        default = “landscapeRight”,
        supported = { “landscapeRight”, }
 
    },

iphone =
    {
        plist =
        {
            UIStatusBarHidden = true,
            CFBundleIconFiles =
            {
                “icon/Icon.png”,
                “icon/Icon@2x.png”,
                “icon/Icon-60.png”,
                “icon/Icon-60@2x.png”,
                “icon/Icon-72.png”,
                “icon/Icon-72@2x.png”,
                “icon/Icon-76.png”,
                “icon/Icon-76@2x.png”,
                “icon/Icon-Small.png”,
                “icon/Icon-Small@2x.png”,
                “icon/Icon-Small-40.png”,
                “icon/Icon-Small-40@2x.png”,
                “icon/Icon-Small-50.png”,
                “icon/Icon-Small-50@2x.png”,
            },
        },
    },

    android =
    {
        versionCode = “1.0”,
        
        – Android permissions
        androidPermissions =
        {
        },
    }

}

On windows simulator, if I select show as iPhone5, the following output shows:

print(display.pixelWidth, display.pixelHeight)

  640   1136
print(display.contentWidth, display.contentHeight)

  960   540
print(display.viewableContentWidth, display.viewableContentHeight)

  960   540
print(“Scale Factor=”… display.pixelHeight / display.actualContentWidth)

  1.18333
print(“Scale Factor=”… display.pixelWidth / display.actualContentHeight)

  1.18333

print(“screenOriginX=”… display.screenOriginX)

  -0

print(“screenOriginY=”… display.screenOriginY)

  -0

But on devices, it act differently and has black areas on both sides.

I don’t know how to correct this.

Any suggestion is appreciated.

#2

You need a splash screen file called Default-568h@2x.png in the main project directory.

http://coronalabs.com/blog/2012/09/19/faq-wednesday-iphone-5-and-ios-6/

#3

Thanks Nick!

I was just searching the identical page! :slight_smile:

But I still have a question.

Do I have to set “imageSuffix = { [”@2x"] =1.5, }"  in my config.lua?
Or just add “Default-568h@2x.png” in the main project directory and it works (without imageSuffix)?

And all my iOS icons are in a “icon” folder in plist, I still put Default-568h@2x.png in the main project directory?

Sorry for being dumb, I don’t have a Mac to test it.

#4

I believe you don’t have to set that in config.lua, and the file does have to be called exactly that and be in the main directory (with the suffix) whether you are using @2x files in your project or not.

It’s basically just a fudge that apple did when the iPhone 5 first arrived.

#5

I just remote upload a new build.

It works perfectly on devices.

Thank you so much! :slight_smile:

#6

You need a splash screen file called Default-568h@2x.png in the main project directory.

http://coronalabs.com/blog/2012/09/19/faq-wednesday-iphone-5-and-ios-6/

#7

Thanks Nick!

I was just searching the identical page! :slight_smile:

But I still have a question.

Do I have to set “imageSuffix = { [”@2x"] =1.5, }"  in my config.lua?
Or just add “Default-568h@2x.png” in the main project directory and it works (without imageSuffix)?

And all my iOS icons are in a “icon” folder in plist, I still put Default-568h@2x.png in the main project directory?

Sorry for being dumb, I don’t have a Mac to test it.

#8

I believe you don’t have to set that in config.lua, and the file does have to be called exactly that and be in the main directory (with the suffix) whether you are using @2x files in your project or not.

It’s basically just a fudge that apple did when the iPhone 5 first arrived.

#9

I just remote upload a new build.

It works perfectly on devices.

Thank you so much! :slight_smile: