Nativescript-ui-feedback: Side-Drawer causes problems for Image-picker plugin on IOS

[anki247]

Did you verify this is a real problem by searching the NativeScript Forum?

Yes

Which platform(s) does your issue occur on?

iOS

Please provide the following version numbers that your issue occurs with:

tns --version > 4.0.2
json "tns-ios": { "version": "4.1.1" }. { "@angular/animations": "~5.2.0", "@angular/common": "~5.2.0", "@angular/compiler": "~5.2.0", "@angular/core": "~5.2.0", "@angular/forms": "~5.2.0", "@angular/http": "~5.2.0", "@angular/platform-browser": "~5.2.0", "@angular/platform-browser-dynamic": "~5.2.0", "@angular/router": "~5.2.0", "nativescript-angular": "~5.3.0", "nativescript-theme-core": "~1.0.4", "nativescript-imagepicker": "^6.0.3", "nativescript-ui-sidedrawer": "^4.1.1", "reflect-metadata": "~0.1.10", "rxjs": "~5.5.5", "tns-core-modules": "^4.0.0", "zone.js": "~0.8.2"

Please tell us how to recreate the issue in as much detail as possible.

1. Start the application
2. Click load image btn,
3. The gallery opens
4. Select an album
5. The images are blurred

Is there code involved? If so, please share the minimal amount of code needed to recreate the problem.

I created a demo repo for that here
In app/app.component.ts you can switch between the 2 templates in order to see the problem.
The first template is just the default and is not active <page-router-outlet></page-router-outlet>. If you activate this one, then the blur effect does not appear...
The second template is active and uses the Side-Drawer plugin. (swipe from left to right, in order to see the Side-Drawer)
hmtl <RadSideDrawer> <StackLayout tkDrawerContent background="grey"> <Label text="MENU"></Label> </StackLayout> <StackLayout tkMainContent> <page-router-outlet></page-router-outlet> </StackLayout> </RadSideDrawer>

Has anyone some idea, why this happens?
Thx 🙂

[anki247]

I found the mistake I did...
The <page-router-outlet></page-router-outlet> should not be wrapped in <StackLayout></StackLayout>

The correct usage:
hmtl <RadSideDrawer> <StackLayout tkDrawerContent background="grey"> <Label text="MENU"></Label> </StackLayout> <page-router-outlet tkMainContent></page-router-outlet> </RadSideDrawer>
Pls close