-
-
Notifications
You must be signed in to change notification settings - Fork 1.7k
iOS - page freezes on page navigation with transition property #6838
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Comments
Hi @erjdriver, Meanwhile, you can set up a timeout of one millisecond before making the navigation, which seems to solve the problem.
|
I just tested with the setTimeout() and the page freezes the second time around - as long as you have the isBusy=true before the setTimeout() and isBusy=false inside the setTimeout() - with the navigation transition enabled. Did you have the isBusy code enabled? and the transition? Another odd aspect of this issue is that if I set the Very strange - ActionBar, nativescript-ui-sidedrawer, ActivityIndicator and transition issue. Here's the code that freezes: Note that I changed the animation duration from 350 to 1 - but still freezes. this.isBusy = true;
setTimeout( () =>
{
this.isBusy = false;
var page_def =
{
moduleName: "about-page",
animated: true,
transition: {
name: "slide",
duration: 1,
curve: "easeInOut"
}
};
frameModule.topmost().navigate( page_def );
}, 1 ); |
HI @erjdriver,
|
The following code does NOT work var page_def =
{
moduleName: "about-page",
animated: true,
transition: {
name: "slide",
duration: 1,
curve: "easeInOut"
}
};
this.isBusy = true;
setTimeout( () =>
{
this.isBusy = false;
frameModule.topmost().navigate( page_def );
}, 1 ); var page_def =
{
moduleName: "about-page",
animated: true,
transition: {
name: "slide",
duration: 1,
curve: "easeInOut"
}
};
this.isBusy = true;
this.isBusy = false;
frameModule.topmost().navigate( page_def ); The following snippets DO work. var page_def =
{
moduleName: "about-page",
animated: true,
/*
transition: {
name: "slide",
duration: 1,
curve: "easeInOut"
}
*/
};
this.isBusy = true;
this.isBusy = false;
frameModule.topmost().navigate( page_def ); var page_def =
{
moduleName: "about-page",
animated: true,
/*
transition: {
name: "slide",
duration: 1,
curve: "easeInOut"
}
*/
};
//this.isBusy = true;
setTimeout( () =>
{
//this.isBusy = false;
frameModule.topmost().navigate( page_def );
}, 1 ); var page_def =
{
moduleName: "about-page",
animated: true,
/*
transition: {
name: "slide",
duration: 1,
curve: "easeInOut"
}
*/
};
this.isBusy = true;
setTimeout( () =>
{
this.isBusy = false;
frameModule.topmost().navigate( page_def );
}, 1 ); var page_def =
{
moduleName: "about-page",
animated: true,
transition: {
name: "slide",
duration: 1,
curve: "easeInOut"
}
};
//this.isBusy = true;
setTimeout( () =>
{
//this.isBusy = false;
frameModule.topmost().navigate( page_def );
}, 1 ); But setting isBusy and resetting is something that I need - so for now - I've chosen not to set the transition - that combination works. |
It seems the RadSideDrawer and flat ActionBar are a separate issue that cause the UI layout to break. This should be fixed with #6929. I was able to isolate this underlying issue to the custom https://play.nativescript.org/?template=play-tsc&id=hnisRP&v=2 |
I experience the same in {N} 5.2 with Angular project. Interestingly, this happens only when passing custom transition via If I unset the custom transition (e.g. platform default is used) it works as expected. |
Uh oh!
There was an error while loading. Please reload this page.
Environment
Latest 5.1 - issue on iOS platform
Plugin nativescript-ui-sidedrawer
Describe the bug
Simple test app that has an icon on the bottom left. Press it and navigate to another page. Press back and press the icon again to repeat. Page is frozen.
This is on iOS.
I've narrowed the problem down to the navigation code (file main-view-model.ts).
If the
transition
property is commented out - it works.If that property is activated, then on navigating back to the main page, the whole page is frozen - subsequent clicks never occur.
To Reproduce
Make sure the
transition
property in main-view-model.ts is enabled.Press the icon to navigate to new page and then navigate back.
Try to press the icon again - page should be frozen.
Expected behavior
Should be able to navigate freely.
Sample project
test3.zip
Additional context
I think this might be related to issue #6810.
This app also has a nativescript-ui-sidedrawer.
Interestingly, if I set the
flat
property of theActionBar
is set to false - app works - but creates other issues (e.g. #6674)Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.
The text was updated successfully, but these errors were encountered: