Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-28323] iOS: Gap between top UI element and and status bar on iPhone 12 mini with extendSafeArea set to false

GitHub Issuen/a
TypeBug
PriorityMedium
StatusClosed
ResolutionUnresolved
Affected Version/sRelease 9.3.0, Release 9.2.2
Fix Version/sRelease 9.3.1
ComponentsiOS
Labelsn/a
ReporterEwan Harris
AssigneeVijay Singh
Created2021-01-19T14:17:41.000+0000
Updated2021-01-22T20:49:03.000+0000

Description

Description

When running the below code on an iPhone 12 mini there is a gap between the status bar and the toolbar element. This is only seen on a iPhone 12 mini and is most likely due to that device having a differing status bar and safe area top inset size (see [here](https://useyourloaf.com/blog/iphone-12-screen-sizes/) and [here](https://twitter.com/steipete/status/1316482397312090118?lang=en))
var win = Ti.UI.createWindow({
	title : "test",
	backgroundColor : '#fff',
	extendSafeArea : false
});
Ti.UI.iOS.setStatusBarBackgroundColor("#00AEE0");
var toolbar = Ti.UI.createToolbar({
	barColor : 'blue',
	title : "Toolbar",
	top : 0
});
win.add(toolbar);
win.open(); 

Steps to reproduce

1. Add the code above to an existing app.js 2. Build to an iPhone 12 mini simulator or device

Actual

Gap between statusbar and top UI element

Expected

No gap

Attachments

FileDateSize
Simulator Screen Shot - iPhone 12 mini - 2021-01-19 at 14.20.09.png2021-01-19T14:20:28.000+000061994

Comments

  1. Vijay Singh 2021-01-19

    This is native issue from Apple side. The height of statusbar is 44 while top of safearea is 50. For supporting property Ti.UI.iOS.statusBarBackgroundColor in iOS 13+, we are using a view(TIMOB-27609 / https://github.com/appcelerator/titanium_mobile/pull/11370) . I think we can manage the height of view to top of safearea if it is not equal to height of statusbar.
  2. Vijay Singh 2021-01-20

    PR - https://github.com/appcelerator/titanium_mobile/pull/12402
  3. Hans Knöchel 2021-01-20

    Is there a reference that it's an Apple issue? I have not heard about this bug so far and would like to prevent the manual top-margin hack if possible and fix it where it's actually happening.
  4. Vijay Singh 2021-01-20

    1. Apart from 2 links added in ticket description , see [this](https://developer.apple.com/forums/thread/662466) where people are talking about it. 2. In all other devices (except iPhone 12 mini) the top of safearea insets is same as height of status bar . e.g iPhone 12, status bar height is 47 and top of safe area insets is 47. 3. In titanium, from iOS 13+ to support Ti.UI.iOS.statusBarBackgroundColor, we are using view to be backward compatible. So setting the proper frame of view is necessary. In case if someone is not using Ti.UI.iOS.statusBarBackgroundColor, no need to adjust anything.
  5. Satyam Sekhri 2021-01-22

    FR Passed. Waiting for Jenkins build.
  6. Christopher Williams 2021-01-22

    Merged to master and backport PR merged to 9_3_X for 9.3.1 release.

JSON Source