Skip to content

Commit

Permalink
Update DevLoadingView to Support iPhone X
Browse files Browse the repository at this point in the history
Summary:
The current implementation of DevLoadingView for iPhone currently gives a static height of `22` and does not take into account iPhoneX screen dimensions.

Devices: All iPhone devices currently available with Xcode v9.2
SDK: 8.1, 9, 10, 11

Validate resize only occurs on iPhone X devices and others remain consistent.

Before:
![feb-10-2018 12-30-20](https://user-images.githubusercontent.com/1743953/36065313-7b41f2ea-0e5e-11e8-87f2-928e26536077.gif)

After:
![feb-10-2018 12-28-15](https://user-images.githubusercontent.com/1743953/36065317-848e4f7e-0e5e-11e8-8aab-70cb5db32f31.gif)

[GENERAL][ENHANCEMENT][{React}] - Improvements to DevLoadingView for iPhone X
Closes facebook#17936

Differential Revision: D6962962

Pulled By: shergin

fbshipit-source-id: e11d9386544fe19a9195e22a03e12f64e934cad7
  • Loading branch information
mrtnrst authored and Plo4ox committed Feb 17, 2018
1 parent 1ea3713 commit 53e8df0
Showing 1 changed file with 9 additions and 5 deletions.
14 changes: 9 additions & 5 deletions React/DevSupport/RCTDevLoadingView.m
Original file line number Diff line number Diff line change
Expand Up @@ -73,8 +73,15 @@ - (void)setBridge:(RCTBridge *)bridge
dispatch_async(dispatch_get_main_queue(), ^{
self->_showDate = [NSDate date];
if (!self->_window && !RCTRunningInTestEnvironment()) {
CGFloat screenWidth = [UIScreen mainScreen].bounds.size.width;
self->_window = [[UIWindow alloc] initWithFrame:CGRectMake(0, 0, screenWidth, 22)];
CGSize screenSize = [UIScreen mainScreen].bounds.size;
if (screenSize.height == 812 /* iPhone X */) {
self->_window = [[UIWindow alloc] initWithFrame:CGRectMake(0, 0, screenSize.width, 60)];
self->_label = [[UILabel alloc] initWithFrame:CGRectMake(0, 30, self->_window.bounds.size.width, 30)];
} else {
self->_window = [[UIWindow alloc] initWithFrame:CGRectMake(0, 0, screenSize.width, 22)];
self->_label = [[UILabel alloc] initWithFrame:self->_window.bounds];
}
[self->_window addSubview:self->_label];
#if TARGET_OS_TV
self->_window.windowLevel = UIWindowLevelNormal + 1;
#else
Expand All @@ -83,11 +90,8 @@ - (void)setBridge:(RCTBridge *)bridge
// set a root VC so rotation is supported
self->_window.rootViewController = [UIViewController new];

self->_label = [[UILabel alloc] initWithFrame:self->_window.bounds];
self->_label.font = [UIFont systemFontOfSize:12.0];
self->_label.textAlignment = NSTextAlignmentCenter;

[self->_window addSubview:self->_label];
}

self->_label.text = message;
Expand Down

1 comment on commit 53e8df0

@brunolemos
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We should not use magical numbers, the correct implementation would be to use safeAreaInsets like I did here: https://github.com/cooperka/react-native-snackbar/pull/65/files

Please sign in to comment.