Jump to content

[TOPIC: topicViewTemplate]
[GLOBAL: userSmallPhoto]
Photo

How to activate "Optimized for iPhone 6 / iPhone 6 Plus"
Started by ingemar Oct 10 2014 08:15 PM

92 replies to this topic
[TOPIC CONTROLS]
Page 2 of 4 1 2 3 4
This topic has been archived. This means that you cannot reply to this topic.
[/TOPIC CONTROLS]
[modOptionsDropdown]
[/modOptionsDropdown]
[reputationFilter]
[TOPIC: post.html]
#26

newbieLUA

[GLOBAL: userInfoPane.html]
newbieLUA
  • Enthusiast

  • 48 posts
  • Corona SDK

@davemikesell , did you check your General Project Settings to ensure you are indeed using the edited LaunchScreen as you build+compile the XCode project?

 

If you did something (ie. coloring) to the LaunchScreen in Interface Builder, and ended up with a black screen, I believe it may not be pulling the correct set... 



[TOPIC: post.html]
#27

Studycat

[GLOBAL: userInfoPane.html]
Studycat
  • Enthusiast

  • 94 posts
  • Corona SDK

I can't get the images to appear. I include them in the Corona project next to main.lua, named as they are in Interface Builder.

 

All I see is the background colour.

 

Secondly, can you just include a @2x and omit the other sizes? 



[TOPIC: post.html]
#28

newbieLUA

[GLOBAL: userInfoPane.html]
newbieLUA
  • Enthusiast

  • 48 posts
  • Corona SDK

@Studycat, I'm not sure what would happen if you omit the stand 1x (and @3x) resolution... 

 

But to check if the naming pointers are set correctly, you can "Open As..." , "Source Code" in XCode and view the raw xml inside the .xib file.

 

Just make sure the name attribute in the <image> tags are correct without any prefixes and any file extensions.

 

ie:

<image name="MyLogo" width="379" height="142"/>

"MyLogo" should be pointing to the root project/app folder with a file name (to be selected by device at runtime) MyLogo.png or MyLogo@2x.png or MyLogo@3x.png



[TOPIC: post.html]
#29

newbieLUA

[GLOBAL: userInfoPane.html]
newbieLUA
  • Enthusiast

  • 48 posts
  • Corona SDK

Just wanted to share that this method of manually adding the .nib file works ! 

 

My app has finally hit the App Store and it got tagged for the iPhone 6/6+ optimizations.

 

I'll be posting my app's info on the other board so I won't be spamming here too much.

Attached Files



[TOPIC: post.html]
#30

toga

[GLOBAL: userInfoPane.html]
toga
  • Contributor

  • 103 posts
  • Corona SDK

Hi newbieLua,

and you built your app with the latest public release?



[TOPIC: post.html]
#31

newbieLUA

[GLOBAL: userInfoPane.html]
newbieLUA
  • Enthusiast

  • 48 posts
  • Corona SDK

@toga, yes my game is published with the basic build 2393a . 

 

I'm only on a Basic subscription, so public-builds are the only resources I have access to.



[TOPIC: post.html]
#32

Studycat

[GLOBAL: userInfoPane.html]
Studycat
  • Enthusiast

  • 94 posts
  • Corona SDK

@newbieLUA

 

Thanks, got it working. 

 

I omitted the @1x and @3x and it worked fine on iPad Retina/non-Retina and iPhone6. 

 

I pointed LaunchScreen.nib at my iPad sized Default-Landscape.png to avoid needing to include another big image in the app. This means iOS6/7 use the same image as the iOS8 LaunchScreen.nib.

 

I Aspect-Filled the image on all devices using the video that you linked to previously: https://www.youtube.com/watch?v=p5wD8dvSDbM#t=104



[TOPIC: post.html]
#33

avlepel

[GLOBAL: userInfoPane.html]
avlepel
  • Contributor

  • 135 posts
  • Corona SDK

I followed Robs tutorial and it was no problem to change the view to my liking and to generate the .nib file:

 
But the images I used ("iOS8-splash.png", "iOS8-splash@2x.png", "iOS8-splash@3x.png") never showed on the device.
 
But the .nib was working, I could see this by changing the background color for the View in the Interface Builder - change it to blue, compile the .nib, put it into the project folder, test the app on the device => before the app starts the screen goes blue, so the process works.
 
I then followed the suggestions of "newbieLUA" and edited the .xib file, I put the name of my splash image into 
 
        <image name="iOS8-splash" width="256" height="256"/>
 
and into additionally I put it into the following imageView, otherwise it didn't work for me:
 
                <imageView userInteractionEnabled="NO" contentMode="center" horizontalHuggingPriority="251" verticalHuggingPriority="251" misplaced="YES" image="iOS8-splash" translatesAutoresizingMaskIntoConstraints="NO" id="Yb4-7j-7ma">
 
and I then compiled it to a .nib and it worked, the image showed up as a splash screen on my iOS 8 devices, tested with iPad Air and iPhone 6.
 
Best,
Andreas


[TOPIC: post.html]
#34

newbieLUA

[GLOBAL: userInfoPane.html]
newbieLUA
  • Enthusiast

  • 48 posts
  • Corona SDK

@avlepel,

Are you using "@2" , "@3" or "@2x" , "@3x"

The "x" in the file name matters and that could be the reason the images can't be shown on retina devices.

Hope this helps!

[TOPIC: post.html]
#35

Dave Haynes

[GLOBAL: userInfoPane.html]
Dave Haynes
  • Contributor

  • 233 posts
  • Corona SDK

Thanks so much for providing the BlackScreen.  That'll work for me.  My apps usually load so quickly that I don't even notice the black launch image.  I never thought it might make someone cringe. :-)  I'll have to keep that in mind.

 

Dave



[TOPIC: post.html]
#36

hgbrian

[GLOBAL: userInfoPane.html]
hgbrian
  • Contributor

  • 103 posts
  • Corona SDK

Like others on this thread, I could not get the tutorial to work. Basically, the nib just could not find the images in Images.xcasset and I had no idea how to fix it. 

 

It took a couple of hours but I ended up manually replacing "Image" with "Default-Landscape" in the .xib file (as newbieLUA suggests) and I also added some constraints to center the image on iPhone and iPad (as in the linked tutorial video.)

 

Since the following nib just uses the Default-Landscape (and I think Default-Landscape@2x) files in your base directory, if you have a landscape game you might just be able to copy the following nib file into your base directory, add one line to your build.settings, and get credit for being iPhone 6 compatible.

 

If you want to try the nib, here it is:

https://www.dropbox.com/s/yzpztnqjhn8iceg/LaunchScreen.nib?dl=0

and here's the xib I used (it's a text file so you can look at the contents)

https://www.dropbox.com/s/ufomkwzfew38idq/LaunchScreen_edit.xib?dl=0



[TOPIC: post.html]
#37

jonjonsson

[GLOBAL: userInfoPane.html]
jonjonsson
  • Corona Geek

  • 1,051 posts
  • Corona SDK

Like others on this thread, I could not get the tutorial to work. Basically, the nib just could not find the images in Images.xcasset and I had no idea how to fix it. 

 

It took a couple of hours but I ended up manually replacing "Image" with "Default-Landscape" in the .xib file (as newbieLUA suggests) and I also added some constraints to center the image on iPhone and iPad (as in the linked tutorial video.)

 

Since the following nib just uses the Default-Landscape (and I think Default-Landscape@2x) files in your base directory, if you have a landscape game you might just be able to copy the following nib file into your base directory, add one line to your build.settings, and get credit for being iPhone 6 compatible.

 

If you want to try the nib, here it is:

https://www.dropbox.com/s/yzpztnqjhn8iceg/LaunchScreen.nib?dl=0

and here's the xib I used (it's a text file so you can look at the contents)

https://www.dropbox.com/s/ufomkwzfew38idq/LaunchScreen_edit.xib?dl=0

 

Does anyone have this for iPhone vertical (no ipad)? Trying to avoid the process :)



[TOPIC: post.html]
#38

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 26,682 posts
  • Enterprise

We did a tutorial on this.  Hope it helps some.  It gives a base project that centers an image and provides a label.  Change the label, drop in the base, @2x and @3x images, save it.  Make sure those images are in the folder with your main.lua (and it's best to still provide the required Default-*.png images to support iOS 6 and iOS 7 as well), and you should be good to go:

 

http://coronalabs.com/blog/2014/10/21/tutorial-building-multi-screen-launch-images-using-xcode-6/

 

Rob



[TOPIC: post.html]
#39

avlepel

[GLOBAL: userInfoPane.html]
avlepel
  • Contributor

  • 135 posts
  • Corona SDK

@Rob

 

It now works perfectly for me, but you might want to add the step 13b into your tutorial:

 

13b) Open LaunchScreen.xib file with an XML editor like Sublime 2 and change both the [image=""] inside <imageView> and [name=""] inside <image> to the base file name of your splash PNG - e.g. use [image="Default"] and [name="Default"] if you have a portrait project and you have the images "Default.png", "Default@2x.png" and "Default@3x.png" inside your project folder

 

This step is needed because inside the LaunchScreen.xib file there is NO reference to the actual splash screen PNGs you want to use inside your project folder. LaunchScreen.xib uses a reference to "Image", and this is the image set prepared in Xcode and placed by Xcode in the following location: /LaunchImage/Images.xcassets/Image.imageset/

 

But this folder is not inside the Corona project, so the files are not found on startup when the .nib is used.

But when instead of the reference to the image set "Image" you put the base file name into the LaunchScreen.xib as described, all is fine.



[TOPIC: post.html]
#40

avlepel

[GLOBAL: userInfoPane.html]
avlepel
  • Contributor

  • 135 posts
  • Corona SDK

@jonjonsson

 

It would be nice to avoid the process, but if you want to have correctly scaled splash screens using the .nib you have to do it yourself.

 

The reason is that you might have different project settings in the config.lua:

 

I use this:

 

width = 320,

height = 480,
scale = "zoomEven",
 
Because of this I use "Default.png" (320x480), "Default@2x.png" (640x960) and "Default@3x.png" (960x1440) as splash PNGs.
 
And I use "zoomEven" so to correctly mimic the way Corona scales the content for the different devices in the Xcode IB project I do this:
 
* Select "LaunchScreen.xib"
* Select the View, not the image inside, and use Mode: "Scale To Fill"
* Select the image inside the view resize it so it fills the whole view and then select Mode: "Aspect Fill"
* Add the four constraints as show in this perfect 4min-tutorial: https://www.youtube.com/watch?v=p5wD8dvSDbM#t=104
 
Using these settings I got a perfect match between the .nib launch PNGs and my content in my app, the scale is the same.
This is important for me, because as the splash screens I display my loading bar at the beginning, and as soon as I have the Lua control over the screen I load all my artwork while updating the loading bar step by step. So it was really important that the loading bar in the splash screens and the loading bar displayed in my apps are in the same location and are using the same size, and this on all devices.
 
If you use "letterbox" in your config.lua I think you would have to change the scale mode for the image in the .nib to "Aspect Fit".
 
You see, it is best to do the process yourself to adapt it perfectly to your project, but by using the tutorial video and the very nice preview system for all devices inside the IB you will do this in no time. :-)
 
Best,
Andreas


[TOPIC: post.html]
#41

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 26,682 posts
  • Enterprise

Andreas, in the test project I built after downloading the stuff from github, my image keys read:  image="Image" without me editing it.  On the step where you open the "Images.xcassets" did you right-click and add a new Image set?  Unless you rename it, it will be called "Image"  Once you have that, you drag your three images into the boxes.  Go back to the imageView in the story board and click on it.  Then set "Image" as the image that feeds the imageView.

 

If we missed a step in the tutorial, then we need to fix it, but having to edit the XML isn't the step we missed.

 

Rob



[TOPIC: post.html]
#42

davemikesell

[GLOBAL: userInfoPane.html]
davemikesell
  • Contributor

  • 540 posts
  • Corona SDK

Rob and all who helped - Thanks for making this idiot proof!   



[TOPIC: post.html]
#43

avlepel

[GLOBAL: userInfoPane.html]
avlepel
  • Contributor

  • 135 posts
  • Corona SDK

Hi Rob,

 

yes, you are right, there definitely is an easier way than to edit the XML.

 

 

The problem in the tutorial is that you use images called "Splash.png", "Splash@2x.png" and "Splash@3x.png" in the example.

 

But this won't work, because in the XML there still would be a reference to the image set called "Image". So the "Splash..."-images will never be displayed.

 

But - for an easy solution - everybody can just use "Image.png", "Image@2x.png" and "Image@3x.png" as splash screens, and all is fine.

 

Or, let me suggest to put in a step 6b:

 

6b. Click on the "Image" item in "Images.xcassets" and rename it to the base name of the splash images you want to use, e.g. rename it to "Default" when you plan to use "Default.png", "Default@2x.png" and "Default@3x.png" as splash screens.

 

And change step 10:

 

10. Click on the Image pull-down and choose Default.

 

After this the reference in the XML goes to "Default" (or whatever you prefer to use) and you don't have to edit the XML file.

 

Best,

Andreas



[TOPIC: post.html]
#44

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 26,682 posts
  • Enterprise

I tested this as is on my iPhone and iPad.  I didn't have to do anything.  I think the .nib file gets compiled with everything filled out correctly.  Yes, I used "Splash.png" because I was using the black launch screen and just chucked those images in there because it's what I had.  I specifically did not use the Default*.png images as the idea is that you would design your own launch screen and move away from the static images (which of course still need to be there for older OS's).  You of course should be able to use the Default.* images if you want.

 

Rob



[TOPIC: post.html]
#45

avlepel

[GLOBAL: userInfoPane.html]
avlepel
  • Contributor

  • 135 posts
  • Corona SDK

Hi Rob,

 

hm, it seems I just cannot get the problem across, maybe the language barrier, I'm German after all. :-)

 

I just try to use different arguments:

 

1. Why it seemed to work for you

 

I think it worked for you when you wrote the tutorial, but when you tested it I guess you still had the "UILaunchImages" in your build.settings - you only removed this one day later after some comments to the tutorial.

 

And because of the "UILaunchImages" where you referenced "Splash.png", "Splash@2x.png" and "Splash@3x.png" these images were shown on your devices. But the information to display these splash screens were NOT taken from the .nib file, because in there no reference to these files is set.

 

 

2. Developer feedback

 

I'm not the only one in this threat encountering this, look at the postings from newbieLUA, Studycat, hgbrian...

 

 

3. Cold logic

 

Assumptions:

 

* You want to use "Splash.png", "Splash@2x.png" and "Splash@3x.png" as your splash screens

* You do NOT set "UILaunchImages" in your build.settings - so there is NO reference in build.settings to these files in your project

* The only things you'll finally copy into your app project folder are the mentioned splash screens and the LaunchScreen.nib file

 

So, cold logic dictates that in the LaunchScreen.nib file there HAS to be a reference to the splash screens "Splash.png" etc. inside, otherwise iOS 8 can not know that these images should be used. Agreed? 

 

The LaunchScreen.nib file is compiled using ibtool --compile LaunchScreen.nib LaunchScreen.xib - this will do nothing else but take the LaunchScreen.xib file and convert it to a file that can be loaded at runtime, NOTHING IS ADDED, only the format is changed.

 

Deduction:

 

If you need to have a reference to the splash screens "Splash.png" etc. this reference HAS to be in the LaunchScreen.xib file.

 

 

Now have a look at the tutorial and create a LaunchScreen.xib file just as it is described there, and concentrate especially on these steps:

 

 

  1. Create three images which will be centered on the screen of various devices. You’ll need a 1×, 2×, and 3× version — these images don’t need to match specific sizes, but they will be shrunk or stretched to fit the UIImageView while maintaining the original aspect ratio.
  2. In the central pane, look for the AppIcon entry, right-click it, and choose New Image Set.
  3. From the Finder, drag the file for your 1× splash image to the  slot, your 2× splash image file to the  slot and your 3× splash image file to the  slot.

 

 

By doing this you create a new image set called "Image" and use it in the following steps.

 

Now look at the LaunchScreen.xib file that is created at the end, e.g. open it in "Sublime 2":

 

There are only two references to the "Image" image set inside, but there is absolutely NO reference to the "Splash" images in the XML. Interface Builder did not care to write the names of the files "Splash.png", "Splash@2x.png" and "Splash@3x.png" you dragged into the project into the LaunchScreen.xib file.

 

 

So in the end you do NOT have a reference to your splash screen files in the LaunchScreen.xib file, and in the compiled LaunchScreen.nib file therefore there won't be a reference inside, too, and the result is that iOS 8 will not know that the splash images based on "Splash.png" should be displayed.

 

But the solution is easy as I pointed out a two postings above:

 

Just rename the image set "Image" in IB to "Splash" and the use "Splash" in step 10 of the tutorial.

After this you have the reference "Splash" in the LaunchScreen.xib file and everything will work, the files "Splash.png", "Splash@2x.png" and "Splash@3x.png" will be displayed on launch.

 

I hope this gives a clearer picture,

best,

Andreas



[TOPIC: post.html]
#46

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 26,682 posts
  • Enterprise

I'll try and reproduce this tomorrow.  I know for certain that I did not have a UILaunchImages in the build.settings.   The images are in the images.xcassets folder in another JSON like file.  Since the images.xcassets file is known about by Xcode, I'm thinking it somehow gets into the nib file when it's compiled.

 

I don't have time today to dig back into this but hopefully I can work on this again tomorrow and try and figure out why you and the others are seeing something different than I am.

 

Rob



[TOPIC: post.html]
#47

avlepel

[GLOBAL: userInfoPane.html]
avlepel
  • Contributor

  • 135 posts
  • Corona SDK

Hi Rob,

 

I tried to decompile the .nib file at look at the entries, but the "NibUnlocker.app" was not able to open the .nib. That's a pity, this would have shed some light on the issue.

 

But I found that the .nib file is compiled from the .xib file regardless of its place in the folder or project hierarchy, and there is no reference in the .xib file to the xcode project the .xib belongs to. So I think it is not possible for the "ibtool" to find the images placed in the "Images.xcassets" folder, and that the "ibtool" does not follow any (if there would be any) references to other project files to then e.g. get paths to images.

 

Thanks for looking into it,

best,

Andreas



[TOPIC: post.html]
#48

thegdog

[GLOBAL: userInfoPane.html]
thegdog
  • Contributor

  • 564 posts
  • Corona SDK

Question... if instead of using the Universal images in the ImageSet, I create separate images for the iPhone, Retina 4, and iPad and remove the Universal images, will it still activate the "Optimized for iPhone 6 / iPhone 6 Plus" setting in the App Store?



[TOPIC: post.html]
#49

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 26,682 posts
  • Enterprise

I did another test tonight and I think I see the problem.  I created my images and named them BooBoo.png, BooBoo@2x.png, and BooBoo@3x.png... obviously not names one would normally use.   When I created the image set in Xcode, I left it named "Image", which is it's default.  I built the Hello World app so that it was something that never had any of this in it.  I updated the build.settings and ran it.

 

No Images.

 

I renamed each image from BooBoo*.png to Image*.png and rebuilt the app.  I got images.   So whatever you name your images, you must also name your image set to and this will work.  I'll add that step.

 

Rob



[TOPIC: post.html]
#50

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 26,682 posts
  • Enterprise

The tutorial is updated. 

 

Rob




[topic_controls]
Page 2 of 4 1 2 3 4
 
[/topic_controls]