apache
Splashscreen content not fitting or centered after screen rotation
Bug Report
Problem
When the screen is rotated, the splashscreen does not fit the screen anymore and the content is not centered. The view retains the size it had when the app started. This can be seen:
- at app startup, while the splashscreen is still visible (and rotating the screen)
- at runtime, when showing the splashscreen with
navigator.splashscreen.show()(and the screen has been rotated)
What is expected to happen?
The splashscreen should always fit the screen and has its content centered.
What does actually happen?
The splashscreen does not fit the screen. The webview content is then visible in the area of the screen not covered by the splashscreen view.
Information
My config.xml uses the following (single image):
...
<preference name="AutoHideSplashScreen" value="false" />
<preference name="FadeSplashScreen" value="false" />
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="RemoveSplashScreenOnPause" value="false" />
...
<splash src="res/ios/Default@2x~universal~anyany.png" />
...
Version information
cordova-ios: 6.2.0 Xcode: 13.3.1 iOS: 15.4.1
Checklist
- [x] I searched for existing GitHub issues
- [x] I updated all Cordova tooling to most recent version
- [x] I included all the necessary information above
I've reproduced the issue, but my naïve attempts to solve it with autoresizingMasks is just resulting in the image getting scaled and stretched horribly 😞
FYI, I managed to work around the issue by using the following in one of my plugins. It's not pretty, but does the job.
// Add layout constraints to a view (usually a child) to fit and
// center it onto another view (usually a parent).
+ (void) constrainView:(UIView*)v1 to:(UIView*)v2;
{
v1.translatesAutoresizingMaskIntoConstraints = NO;
[NSLayoutConstraint activateConstraints:@[
[NSLayoutConstraint constraintWithItem:v1 attribute:NSLayoutAttributeWidth
relatedBy:NSLayoutRelationEqual toItem:v2 attribute:NSLayoutAttributeWidth multiplier:1 constant:0],
[NSLayoutConstraint constraintWithItem:v1 attribute:NSLayoutAttributeHeight
relatedBy:NSLayoutRelationEqual toItem:v2 attribute:NSLayoutAttributeHeight multiplier:1 constant:0],
[NSLayoutConstraint constraintWithItem:v1 attribute:NSLayoutAttributeCenterY
relatedBy:NSLayoutRelationEqual toItem:v2 attribute:NSLayoutAttributeCenterY multiplier:1 constant:0],
[NSLayoutConstraint constraintWithItem:v1 attribute:NSLayoutAttributeCenterX
relatedBy:NSLayoutRelationEqual toItem:v2 attribute:NSLayoutAttributeCenterX multiplier:1 constant:0]
]];
}
- (void) pluginInitialize
{
// Dirty trick to work around splashscreen problem when rotating the screen.
// Look into the view hierarchy for the CDVLaunchScreen and add layout contraints
// to make the various layers to fit/center onto each other.
[self.viewController.view.subviews enumerateObjectsUsingBlock:^(UIView *view, NSUInteger idx, BOOL *stop) {
if (! [view isKindOfClass:WKWebView.class]) {
[<myplugin> constrainView:view to:self.viewController.view];
[<myplugin> constrainView:view.subviews[0] to:view];
*stop = YES;
}
}];
}