Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Use storyboards & default split screens support - required from July 2020 #770

Closed
mobidev111 opened this issue Jan 21, 2020 · 16 comments · Fixed by #790
Closed

Use storyboards & default split screens support - required from July 2020 #770

mobidev111 opened this issue Jan 21, 2020 · 16 comments · Fixed by #790

Comments

@mobidev111
Copy link

Feature Request

Motivation Behind Feature

Apple requires adaptive user interface features from April 2020:

"starting April 2020, apps submitted to the App Store must use an Xcode storyboard to provide the app’s launch screen and must have an interface that supports any display size"

https://developer.apple.com/news/?id=01132020b

Feature Description

  • add default storyboard

  • add default config for splitscreen

  • remove legacy icon & legacy launch image logic, see
@spinninghamster
Copy link

Maybe this helps:
https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-splashscreen/

I use a single image like this:

<splash src="resources/ios/screens/Default@2x~universal~anyany.png" />

@breautek
Copy link
Contributor

Storyboards is already supported in the latest version of the splashscreen plugin. It's up to you as an app developer to switch over to storyboards in your app(s). In my apps, I do exactly what @spinninghamster does.

But I do agree that the default should be switch to storyboards, so for that reason I'll leave this ticket open.

@EinfachHans
Copy link

Would be nice, if the LaunchImages are not created, if not mentioned in config.xml (See here).

Also setting the Background Color for the Storyboards View would be nice, to allow the Launch Screen appears with a black Screen in Dark Mode.

@dpogue dpogue mentioned this issue Feb 18, 2020
Merged
4 tasks
@brodycj
Copy link
Contributor

brodycj commented Feb 18, 2020

FYI work seems to be in progress in PR #790. I just added PR #790 to the 6.0.0 milestone. Please feel free to follow up with us here, PR #790, Slack, or on the mailing list (follow links in the footer of cordova.io or cordova.apache.org for the contact info).

@timbru31
Copy link
Member

Deadline has been extended by Apple (see https://developer.apple.com/news/?id=03262020b) to June 30, 2020.

@timbru31 timbru31 changed the title Use storyboards & default split screens support - required from April 2020 Use storyboards & default split screens support - required from July 2020 Apr 14, 2020
@irene-pc
Copy link

irene-pc commented May 5, 2020

Hi!

I am going crazy with this request. I think I understand it well but I am not sure and I think you can help me.

It says that splashscreen must be provided as XCode storyboard. This is my actual configuration in config.xml for iOS:

        <icon height="57" src="resources/ios/icon/icon.png" width="57" />
        <icon height="114" src="resources/ios/icon/icon@2x.png" width="114" />
        <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
        <icon height="80" src="resources/ios/icon/icon-40@2x.png" width="80" />
        <icon height="120" src="resources/ios/icon/icon-40@3x.png" width="120" />
        <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
        <icon height="100" src="resources/ios/icon/icon-50@2x.png" width="100" />
        <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
        <icon height="120" src="resources/ios/icon/icon-60@2x.png" width="120" />
        <icon height="180" src="resources/ios/icon/icon-60@3x.png" width="180" />
        <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
        <icon height="144" src="resources/ios/icon/icon-72@2x.png" width="144" />
        <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
        <icon height="152" src="resources/ios/icon/icon-76@2x.png" width="152" />
        <icon height="167" src="resources/ios/icon/icon-83.5@2x.png" width="167" />
        <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
        <icon height="58" src="resources/ios/icon/icon-small@2x.png" width="58" />
        <icon height="87" src="resources/ios/icon/icon-small@3x.png" width="87" />
        <icon height="1024" src="resources/ios/icon/icon-1024.png" width="1024" />
        <splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
        <splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
        <splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
        <splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
        <splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
        <splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
        <splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
        <splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
        <splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
        <splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
        <splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
        <splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
        <splash height="2732" src="resources/ios/splash/Default@2x~universal~anyany.png" width="2732" />

If I understand the request and cordova-plugin-splashscreen well, my config.xml to fulfill Apple request must be:

        <icon height="57" src="resources/ios/icon/icon.png" width="57" />
        <icon height="114" src="resources/ios/icon/icon@2x.png" width="114" />
        <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
        <icon height="80" src="resources/ios/icon/icon-40@2x.png" width="80" />
        <icon height="120" src="resources/ios/icon/icon-40@3x.png" width="120" />
        <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
        <icon height="100" src="resources/ios/icon/icon-50@2x.png" width="100" />
        <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
        <icon height="120" src="resources/ios/icon/icon-60@2x.png" width="120" />
        <icon height="180" src="resources/ios/icon/icon-60@3x.png" width="180" />
        <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
        <icon height="144" src="resources/ios/icon/icon-72@2x.png" width="144" />
        <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
        <icon height="152" src="resources/ios/icon/icon-76@2x.png" width="152" />
        <icon height="167" src="resources/ios/icon/icon-83.5@2x.png" width="167" />
        <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
        <icon height="58" src="resources/ios/icon/icon-small@2x.png" width="58" />
        <icon height="87" src="resources/ios/icon/icon-small@3x.png" width="87" />
        <icon height="1024" src="resources/ios/icon/icon-1024.png" width="1024" />
        <splash height="2732" src="resources/ios/splash/Default@2x~universal~anyany.png" width="2732" />

But I have some doubts:

  1. At codova plugin splashscreen documentation puts:

If you are using launch storyboard images, there is no need to include legacy images. If you do, the legacy images will be copied, but not used.

Reading this I understand that you can have legacy images and these images don't be use if you have storyboard images and I understand that this situation fulfill Apple request.

  1. @spinninghamster Does your single image work with iPhone 6+, iPhone 6s+ and iPhone 7+? Reading cordova plugin splashscreen documentation I'm not sure and I have curiosity if with this single image it works for all devices or it is necessary multi images.

  2. Reading Apple request I don't see nothing about adding default config for splitscreen and removing legacy icon & legacy launch image logic. Is it related with PR CB-13143: Integrate and replace SplashScreens with Launch Storyboard #790?

@spinninghamster
Copy link

  1. @spinninghamster Does your single image work with iPhone 6+, iPhone 6s+ and iPhone 7+? Reading cordova plugin splashscreen documentation I'm not sure and I have curiosity if with this single image it works for all devices or it is necessary multi images.

@irene-pc Yes, it does. I'm using the single image for over a year across several projects. No problems, just 1 line of configuration.

@irene-pc
Copy link

irene-pc commented May 5, 2020

@spinninghamster Thank you so much for your response. It helps me a lot. So with this single line for splashscreen the requirement of Apple is resolve, right?

<splash height="2732" src="resources/ios/splash/Default@2x~universal~anyany.png" width="2732" />

Can you o someone help me with my doubts? I want to understand well what implies the requirements of Apple and the possible changes.

Thank you so much.

@spinninghamster
Copy link

@spinninghamster Thank you so much for your response. It helps me a lot. So with this single line for splashscreen the requirement of Apple is resolve, right?

<splash height="2732" src="resources/ios/splash/Default@2x~universal~anyany.png" width="2732" />

Can you o someone help me with my doubts? I want to understand well what implies the requirements of Apple and the possible changes.

Thank you so much.

Yes, that worked for me with several new apps as well as updates. No errors from Apple's end with that.

Note I don't use any "width" attribute, just:

<splash src="resources/ios/screens/Default@2x~universal~anyany.png" />

Just give it a try. Remove all the other splash screen configurations. It works just fine. Very simple.

@irene-pc
Copy link

irene-pc commented May 5, 2020

@spinninghamster Thank you so much. I am going a little crazy with the requirement of using storyboards since 30/06/2020 from Apple. I think that the part of iOS in config.xml must change like I put on my first comment but I am not sure and your responses help me a lot.

I am testing with the line like you said and the first test with XCode simulator is ok.

@irene-pc
Copy link

irene-pc commented May 5, 2020

I want to understand all this stuff good but I have doubts:

  1. At codova plugin splashscreen documentation puts:

If you are using launch storyboard images, there is no need to include legacy images. If you do, the legacy images will be copied, but not used.

Reading this I understand that you can have legacy images and these images don't be use if you have storyboard config, so I understand that this situation fulfill Apple request.

  1. Reading Apple request I don't see nothing about adding default config for splitscreen and removing legacy icon & legacy launch image logic. Is it related with PR CB-13143: Integrate and replace SplashScreens with Launch Storyboard #790? Is this PR going to delete Launchimage from images.xcassets?

@spinninghamster
Copy link

@irene-pc Yes, I personally don't use any legacy images at all.

I am not sure about splitscreen or if it's supported by Cordova yet. But it seems Apply only "strongly encourages" it at this point; so even if you don't have support for it you should be fine. It doesn't appear to be a full requirement just yet.

About deleting images.xcassets I don't know, someone else would need to answer.

@irene-pc
Copy link

irene-pc commented May 6, 2020

@spinninghamster Thank you for your response.

Maybe can anyone help me with the doubts I have and you don't know :)

@irene-pc
Copy link

irene-pc commented May 8, 2020

Can anyone help me with my doubts? I want to understand well these requirements.

Thanks.

@breautek
Copy link
Contributor

breautek commented May 8, 2020

Launch screens have nothing to do with app icons. App icons are not changing, so you still need to supply several icons of varying sizes to support varying devices.

As for launch screens, you shouldn't be using legacy images anymore, because Apple will eventually reject your app. This means you should not be using these config options.

Instead you should be using "storyboards" (which are in fact, still images). For most cases I think, the Single image Launch screen should be enough. Especially if you use your launch screen as a simple screen with a logo. It just needs to be sized at 2732x2732 square and the image design should be focused on the center. iOS will use this image and display it for every context.

If your launch screens are more complex, then you may need to use the multi-image setup, which allows you to build the launch image with some more grained assumptions about the device that it will be used on.

Reading this I understand that you can have legacy images and these images don't be use if you have storyboard config, so I understand that this situation fulfill Apple request.

This is correct, if you have storyboard configs, they will be used and any legacy image config will be ignored. But for the sake of maintainability of your project, I personally would remove the old legacy images and legacy launch configs altogether once you made the switch to storyboards.

As for the note on split screens, I don't know if it's supported. But I don't think it is or will be a requirement. Apple says here that:

... and all iPad apps must support all iPad screens.

I interpret this that the app must support different iPad devices. They make no mention that iPads must support split view. Personally, forcing people to support split view just doesn't make much sense either. I can think of several apps that it just does not make sense to use in split view, games for example.

I've seen some blogs making that claim but I don't know why they think that and they don't offer any link to an Apple statement. If you know of an Apple statement that says split-view must be supported, then please do link it.

I hope clears some stuff up.

@irene-pc
Copy link

irene-pc commented May 8, 2020 •
edited
Loading

@breautek you help me a lot and now I understand it better. Thank you so much.

I read abot split-view in the first post of this issue. I also see it at Submit App to App Store page referenced at Deadline.

Deadline

Submit App to App Store

At submit's page, you can read about the app must be build with XCode11, Optimize for iOS13 and iPadOS, Test the app on devices and Submit the app for review.

At Optimize for iOS13 and iPadOS, they talk about Dark Mode and Multitasking. But I understand that both are optional although Apple strongly encouraged them.

Another question. I have an image 2732x2732 and I use the command ionic cordova resources to generate app's resources. At config.xml and folder resources there are more than one image. I suppose that by default this command generate legacy images and storyboard and for performing Apple Deadlines it is only necessary to delete all images at resources\ios\splash and all lines at config.xml that are not related with png image, Default@2x-universal-anyany. And I think if this issue is related with #790

@erisu erisu mentioned this issue Aug 18, 2020
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

CB-13143: Integrate and replace SplashScreens with Launch Storyboard dpogue/cordova-ios
7 participants
@timbru31 @brodycj @mobidev111 @breautek @EinfachHans @spinninghamster @irene-pc