nativescript-angular: Broken layout in iOS after upgrading to Nativescript 5
Environment
Provide version numbers for the following components (information can be retrieved by running tns info in your project folder or by inspecting the package.json of the project):
- CLI: 5.0.0
- Android Runtime: 5.0.0
- iOS Runtime: 5.0.0
- NativeScript-Angular: ^6.3.0-2018-10-30-174754-04
- Angular: ~6.1.0
This is what I get when I run tns doctor:
✔ Your ANDROID_HOME environment variable is set and points to correct directory. ✔ Your adb from the Android SDK is correctly installed. ✔ The Android SDK is installed. ✔ A compatible Android SDK for compilation is found. ✔ Javac is installed and is configured properly. ✔ The Java Development Kit (JDK) is installed and is configured properly. ✔ Xcode is installed and is configured properly. ✔ xcodeproj is installed and is configured properly. ✔ CocoaPods are installed. ✔ CocoaPods update is not required. ✔ CocoaPods are configured properly. ✔ Your current CocoaPods version is newer than 1.0.0. ✔ Python installed and configured correctly. ✔ The Python ‘six’ package is found. ✔ Xcode version 10.1.0 satisfies minimum required version 9. ✔ Getting NativeScript components versions information… ✔ Component nativescript has 5.0.0 version and is up to date. ✔ Component tns-core-modules has 5.0.2 version and is up to date. ✔ Component tns-android has 5.0.0 version and is up to date. ✔ Component tns-ios has 5.0.0 version and is up to date.
Describe the bug Layout is broken in iOS. Android works fine. iOS was working fine before upgrading from NS4 to NS5.
To Reproduce See sample project in Playground example below.
Expected behavior Home page shopping lists should be stacked without overlapping.
Sample project See example here: https://play.nativescript.org/?template=play-ng&id=eGOyrq&v=13
About this issue
- Original URL
- State: closed
- Created 6 years ago
- Reactions: 2
- Comments: 37 (6 by maintainers)
FYI adding iosOverflowSafeAreaEnabled=“false” to the ScrollView fixed this issue for me as it cascaded the disabling of OverflowSafeArea to all children. (using tns-core-modules 5.1.2)
Yeah, understood @MartoYankov, the
iosOverflowSafeArea="false"seems to be a good temporary fix but as you mentioned, “In this scenario there shouldn’t be a need for adjustment”. Hopefully you guys can get this fixed soon, thank you!No, actually it does not solve problem when content is deeply nested, or inside list view etc. We cannot put iosOverFlowSafeArea for all components.