Screenshots and new iPhone size compatibility

Solar2D iOS
#61

Hi again,

Sorry for the confusion, but I must retract my previous statement. For iOS8, these images must be stated in “build.settings”. I’m going to update the guide on this and it should be live shortly.

Brent

#62

So, what is the conclusion regarding the icon? I just saw that the docs was updated for us to have 2 icons with the same size (120x120). Is that the way to go?

#63

Hi Renato,

Yes, I suggest duplicating and renaming the 120x120 icon and including both.

#64

Ok! Thanks.

#65

In most cases, they are going to be the same Icon so it doesn’t matter much.

#66

Brent,

based on your reply to @tanu.kush, @newbieLUA post and Apple’s docs, I understand that we need to add the following to our build.settings regarding the iPhone 6/6+ Launch images, am I correct?

settings = { iphone = { plist = { UILaunchImages = { { -- iPhone 6 ["UILaunchImageMinimumOSVersion"] = "8.0", ["UILaunchImageName"] = "Default", ["UILaunchImageOrientation"] = "Portrait", ["UILaunchImageSize"] = "{750, 1334}" }, { -- iPhone 6 Plus ["UILaunchImageMinimumOSVersion"] = "8.0", ["UILaunchImageName"] = "Default", ["UILaunchImageOrientation"] = "Portrait", ["UILaunchImageSize"] = "{1242, 2208}" }, } } } }
#67

Hi Renato,

The guide is now updated. It’s much more than what you list, actually. A lot of things are changing with iOS8, but if we didn’t like change, we wouldn’t be mobile developers. :wink:

http://docs.coronalabs.com/guide/distribution/buildSettings/index.html#launchimage

#68

Thanks Brent.

The Apple docs says that we don’t need to specify the suffix on the UILaunchImageName:

UILaunchImageName (required):   (…)  The name you specify for this key should not include a filename extension, nor should it include modifiers such as @2x, -568h, ~iphone, or ~ipad.

Do you confirm that for Corona we need to specify the suffix -568h,… ?

Also, do we need to specify the iPhone 4/5 Launch files (Default-568h)  there? (Because we didn’t need them before…) 

#69

I suspect that since you have to provide the name for the images now in the info.plist that the name itself has become irrelevant.  In other words you could have Fred@2x.png  and as long as its 640 x 1136 and you specify “Fred” in the table listed, you don’t have to name it exactly xxx.  Look at this block of code:

                { -- iPhone 5/5S                     ["UILaunchImageMinimumOSVersion"] = "7.0",                     ["UILaunchImageName"] = "Fred",                     ["UILaunchImageOrientation"] = "Portrait",                     ["UILaunchImageSize"] = "{320, 568}"                 },

You are specifying the point size of the image in the UILaunchImageSize field.  Apple is going to look at the device it’s one (iPhone 5) and it knows it needs to find the record with a size of 320x568.  It will then take the UILaunchImageName and slap an @2x.png on the end and look to see if that file exists.  If it does, you get a launch image, if it does not,  you don’t.

Since iOS 6 (when the iPhone 5 came out) required the Default-568h@2x.png file to trigger tall mode, and I don’t know if that’s still the case with iOS 7 (though it seems to be from people who have left it out), it makes sense to keep a file with that name around.  I don’t know yet how iOS 8 handles the tall mode.  Hopefully it’s gone away since the 3.5" phone isn’t supported on it.  But because our apps can still run on iOS 6, you should still keep a Default-568h@2x.png file in your folder.

Since you still need to do that, we are going to recommend you be consistent with your naming of your Launcher images and stay with Default-NNNh@2x.png and when you specify it in your build.setting’s UILaunchImages table, specify the file name and leave the @2x.png off.

This is known to work.

While Apple gives developers the freedom to do things, its much easier to just copy and paste our code that we know works and follow the convention.  When you do your own thing, it makes it much tougher for other people in the community to help solve problems when you run into them.   If you follow the conventions we lay out, when we say “Post your build.settings”, then we can spot problems easier.

#70

Keeping the iPhone 5 as an example.

I think what Renato was asking was the Corona docs state this:

 { --iPhone 5 ["UILaunchImageMinimumOSVersion"] = "7.0", ["UILaunchImageName"] = "Default-568h", ["UILaunchImageOrientation"] = "Portrait", ["UILaunchImageSize"] = "{320, 568}" }

Shouldn’t the “-568h” be left off, and just be “Default”? This is what Apple say in their docs as Renato quoted.

If Apple’s docs are correct, I’d expect all entries in the list to be [“UILaunchImageName”] = “Default”.

The actual files in the root directory on the device should have all the modifiers though…

#71

Possibly, but it works with it.  I’ll do some additional testing tomorrow.

Rob

#72

^ thanks Rob ! Would love to know the official results too…

My ghetto test methods from the other day came back with odd results:

Without “-568h” :

iOS 8 device : OK

iOS 8 Simulator : OK

Without “-667h”:

iOS 8 device : Cannot Test

iOS 8 Simulator : Not OK

With "-667h:

iOS 8 Simulator : OK

Without “-736h”:

iOS 8 device : Cannot Test

iOS 8 Simulator : Not OK (it actually blows up the 320x480 launch image!)

With "-736h:

iOS 8 Simulator : OK

Without “-Portrait”: (iPad)

iOS 8 device: OK

iOS 8 Simulator : OK

#73

@newbieLUA

I can confirm the same results. It seems that Apple’s documentation doesn’t live up to their statements.

Corona Labs’ recommendations do seem to be the best guarantee to make things work at the moment.

HOWEVER.

As soon as the UILaunchImages key is used, landscape only apps still do not display a splash screen (as I’ve reported far above). It only displays a black screen. This isn’t a Corona issue. I suspect this is an issue with Xcode 6 / iOS 8 as it affects all devices running iOS 8 (maybe even iOS 7 if compiled with Xcode 6 / iOS 8 SDK).

I’m still investigating, and I’m in the process of creating a sample project to display the issue.

#74

Thanks Rob. I meant exactly what @ingemar said. I also prefer to follow Corona standards regarding name. I was just asking since the Apple docs was saying differently and the iPhone5 Launch image specification on the plist was never required to active the tall device.

@newbieLUA and @ingemar, thanks for the tests. So it appears that Corona docs is the way to go. I was not able to get a iPhone 6 yet, and my tests on iOS Simulator (using Corona target build to 7.1) didn’t show to be accurate (even without the Default-568h, the tall mode was always enabled, which is not the case on the actual device)

#75

For anyone interested, I’ve started a new topic about the “Black Launch Screen” problem on iOS 8 here:

http://forums.coronalabs.com/topic/51457-black-screen-on-launch-with-ios-8-landscape-apps/

#76

If you use Inkscape, this might help.   Or you could probably plug in your own command line exporter.   Just run ‘lua icon.lua’ in your project directory and it spits out the icons, launch images, and Google featured image, which is now required on Google Play.

local inkscape = "/Applications/Inkscape.app/Contents/Resources/bin/inkscape" local MODEL\_DIR = "../models/" local icons = { -- iOS { suffix = "", w = 57, h = 57 }, { suffix = "@2x", w = 114, h = 114 }, { suffix = "-60", w = 60, h = 60 }, { suffix = "-60@2x", w = 120, h = 120 }, { suffix = "-60@3x", w = 180, h = 180 }, { suffix = "-Small-40@3x", w = 120, h = 120 }, { suffix = "-Small@3x", w = 87, h = 87 }, { suffix = "-76", w = 76, h = 76 }, { suffix = "-76@2x", w = 152, h = 152 }, { suffix = "-Small", w = 29, h = 29 }, { suffix = "-Small@2x", w = 58, h = 58 }, { suffix = "-40", w = 40, h = 40 }, { suffix = "-40@2x", w = 80, h = 80 }, { suffix = "-Small-50", w = 50, h = 50 }, { suffix = "-Small-50@2x", w = 100, h = 100 }, { suffix = "-72", w = 72, h = 72 }, { suffix = "-72@2x", w = 114, h = 114 }, -- Android { suffix = "-ldpi", w = 36, h = 36 }, { suffix = "-mdpi", w = 48, h = 48 }, { suffix = "-hdpi", w = 72, h = 72 }, { suffix = "-xhdpi", w = 96, h = 96 }, { suffix = "-xxhdpi", w = 144, h = 144 }, } local LaunchScreenSizes = { { suffix = "", w = 320, h = 480 }, { suffix = "@2x", w = 640, h = 960 }, { suffix = "-568h@2x", w = 640, h = 1136 }, { suffix = "-667h@2x", w = 750, h = 1334 }, { suffix = "-736h@3x", w = 1242, h = 2208 }, { suffix = "-Landscape-736h@3x", w = 2208, h = 1242 }, { suffix = "-Portrait", w = 768, h = 1004 }, { suffix = "-Portrait@2x", w = 1536, h = 2008 }, { suffix = "-Landscape", w = 1024, h = 768 }, { suffix = "-Landscape@2x", w = 2048, h = 1496 }, } local function exportIcons() local nm = "Icon" local mod\_nm = MODEL\_DIR .. nm .. ".svg" for i=1, #icons do local parms = icons[i] local cmd = inkscape .. " -f " .. mod\_nm .. " -e " .. nm .. parms.suffix .. ".png -w " .. tostring(parms.w) .. " -h " .. tostring(parms.h) print(cmd) os.execute(cmd) end -- Special renders local cmd = inkscape .. " -f " .. mod\_nm .. " -e GooglePlay512x512.png -w 512 -h 512" print(cmd) os.execute(cmd) local cmd = inkscape .. " -f " .. mod\_nm .. " -e itunes1024x1024.png -w 1024 -h 1024" print(cmd) os.execute(cmd) end local function exportLaunchScreens() local nm = "LaunchScreen" local mod\_nm = MODEL\_DIR .. nm .. ".svg" for i=1, #LaunchScreenSizes do local parms = LaunchScreenSizes[i] local cmd = inkscape .. " -f " .. mod\_nm .. " -e Default" .. parms.suffix .. ".png -w " .. tostring(parms.w) .. " -h " .. tostring(parms.h) print(cmd) os.execute(cmd) end end local function exportGoogleFeaturedImage() local nm = "GoogleFeaturedImage" local mod\_nm = MODEL\_DIR .. nm .. ".svg" local cmd = inkscape .. " -f " .. mod\_nm .. " -e " .. nm .. ".png -w 1024 -h 500" print(cmd) os.execute(cmd) end exportIcons() exportLaunchScreens() exportGoogleFeaturedImage()
#77

For people using SVGs, this will be very handy. Thank you, Dave.

A few observations –

  1. The icon suffixes “-40” and “-40@2x” can be renamed as “-Small-40” and “-Small-40@2x” just for the sake of keeping naming convention consistent.

  2. For the launch image suffix “-Portrait”, the value of h (height) needs to be 1024 instead of 1004 (must be a typo).

  3. In the function exportLaunchScreens(), the Inkscape command seems to read the SVG file and spit out the desired image in the specified width and height. Let’s consider that an app supports only portrait orientations. The resultant portrait images would be fine, but the landscape images would have the artwork at a perpendicular angle with respect to a landscape orientation. This should be fine since the app supports only portrait orientations. But what if the app supported all orientations? Also, what about landscape-only apps? The portrait images for iPhone 3, 4 & 5 are the ones used by iOS as launch images on those devices and hence the orientation of the artwork would be wrong.

One solution is to maintain both portrait and landscape versions of the launch image SVG file and create two corresponding portrait and landscape LUA functions. Another possibility (if Inkscape allows it) is rotation of the landscape (or portrait, depending on the way the SVG file is created) images after creation.

#78

For iOS 6 the iPad launch images were either 1024 x 748 or 768 x 1004.  Starting with iOS 7 they standardized them to 1024 x 768/768 x 1024.

#79

Crap, I missed that and just uploaded a binary.

:frowning:

#80

It won’t matter much.

Rob