[TIMOB-27822] Ti.UI.iPad.Popover including arrow in content view on iOS 13
GitHub Issue | n/a |
---|---|
Type | Bug |
Priority | Critical |
Status | Closed |
Resolution | Fixed |
Resolution Date | 2020-04-16T01:39:56.000+0000 |
Affected Version/s | Release 8.3.0 |
Fix Version/s | Release 9.0.1 |
Components | iOS |
Labels | n/a |
Reporter | Justin Tickner |
Assignee | Vijay Singh |
Created | 2020-03-18T04:27:47.000+0000 |
Updated | 2020-06-11T07:39:48.000+0000 |
Description
As of iOS 13, Ti.UI.iPad.Popover's "arrow" is included as part of the content area. This was not the case in previous versions of iOS, and is causing content to be pushed outside the bounds of what is visible in the Popover on iOS 13 devices. It's probably an issue with safe area implementation in iOS 13.
See !popover_ios13_issue.png|thumbnail! for the difference between how it is working on iOS 13 and iOS 12.
Reproduction code:
var win = Ti.UI.createWindow({backgroundColor: 'white'});
var button = Ti.UI.createButton({title: 'Open Popover Up', top: 100});
var button2 = Ti.UI.createButton({title: 'Open Popover Left', top: 200});
button.addEventListener('click', function(e){
popover.show({ view: button });
})
button2.addEventListener('click', function(e){
popover2.show({ view: button2 });
})
win.add(button);
win.add(button2);
var contentWindow = Ti.UI.createWindow({ title: 'Window title' });
contentWindow.add(Ti.UI.createLabel({text: "Example text."}));
var popover = Ti.UI.iPad.createPopover({
backgroundColor: 'black',
arrowDirection: Titanium.UI.iPad.POPOVER_ARROW_DIRECTION_UP,
contentView: Ti.UI.createNavigationWindow({
width: 450,
height: 300,
window: contentWindow,
})
});
var popover2 = Ti.UI.iPad.createPopover({
backgroundColor: 'black',
arrowDirection: Titanium.UI.iPad.POPOVER_ARROW_DIRECTION_LEFT,
contentView: Ti.UI.createNavigationWindow({
width: 450,
height: 300,
window: contentWindow,
})
});
win.open();
Attachments
File | Date | Size |
---|---|---|
iPad9.7_alignmentIssue.png | 2020-04-14T16:56:14.000+0000 | 192449 |
popover_ios13_issue.png | 2020-03-18T04:26:32.000+0000 | 319664 |
I have this issue as well, it completely ruins the UI of my app unfortunately as popovers are used extensively and dynamically. My app is like a map app with pins. I cannot find a way around this, but it seems that the SDK is implementing the iOS 13 change wrong as everything is clearly shifted up/down/left/right depending on the arrow direction.
Hi, just wondering if there is any update on this issue in terms of when a fix to this may appear in the CI builds so I can test it? This bug is preventing me from releasing my app as I make heavy use of Popovers for iPad. Thanks!
[~mark.henderson@snagr.co.uk] I am working on this. I'll update progress here.
PR (master) - https://github.com/appcelerator/titanium_mobile/pull/11598 PR (9_0_X) - https://github.com/appcelerator/titanium_mobile/pull/11599
@Vijay Singh I have tested the PR manually in my 9.0.0SDK and it works perfectly! Many thanks for the fast response at this difficult time!
@Vijay Singh ditto to Mark's sentiment —really appreciate the fast response on this! Have tested this in 8.3.0.SDK and it also works fine there
FR Passed
Noticed an issue with the fix. When testing on an iPad simulator in portrait mode the text is not centrally aligned in the case of popover left. The text alignment issue is more noticeable on smaller screen like ipad pro 9.7 inch simulator whereas on on larger screen sim like iPad pro 12.9 inch the issue is not noticeable at all. Check the attached screenshot for 9.7 inch iPad pro. !iPad9.7_alignmentIssue.png|thumbnail!
Looking in this.
PR (9_0_X) - https://github.com/appcelerator/titanium_mobile/pull/11633 PR (master) - https://github.com/appcelerator/titanium_mobile/pull/11632
FR Passed. The iPad popover are shown correctly and the title text is centrally aligned.
Verified on: Mac OS: 10.15.4 SDK: 9.0.1.v20200415143120, 9.1.0.v20200415140515 Appc CLI: 8.0.0 JDK: 11.0.4 Node: 10.17.0 Studio: 6.0.0.202003181504 Xcode: 11.4 iOS simulator: iPad Air3(v13.4, 12.2), iPad Pro 9.7-inch(v13.4, 12.2), iPad Pro 11-inch(v13.4, 12.2), iPad Pro 12.9-inch(v13.4, 12.2)