Switching between screens

I am developing an application, in which i have to show Tutorial screen on first run.

To achieve this approach i am using following approach.

Initially my screen directs to Splash Screen, where i have checked

if($localStorage.isFirstRun == 1)
{
 $state.go('app.home')
}

Other wise it will show the tutorial screen, and on tutorial screen, i have set the value of

$localStorage.isFirstRun = 1

everything is working perfectly, but once user has seen the tutorial screen and the above IF condition is true, then it goes to home screen with slide effect (it also shows that tutorial screen for 1 sec and then i goes to home screen). i dont want that slide effect. how to get rid of it?

and is there any way to access $localStorage in app.js class?

Try doing the check before the view is loaded?

http://ionicframework.com/docs/api/directive/ionView/

how does it work? do you have any example?

.controller('MyCtrl', function($scope){ $scope.$on('$ionicView.beforeEnter', function(){ console.log('This message will shown before every enter to state bound to this ctrl'); }); });

You can use the event $ionicView.loaded … Before each view is shown (and leaves), Ionic will fire some events (such as $ionicView.loaded). You can setup a listener

@Koleman, i will try this, and let you know.

thanks :smile:

np, also there is another aproach(lower-level) based on angular-ui-router, something like this:
.config(function($rootScope){ $rootScope.$on('$stateChangeStart', function(){}); });

@Koleman, i have implemented this approach, but same old behavior.

This is strange, im using config-approach in my app for preventing access to some states and works well

i have not tried config approach @Koleman, can you please provide an example?

.config(function($rootScope){ $rootScope.$on('$stateChangeStart', function(){}); });

Since you’re having issues with the “tutorial” screen showing before your “real” screen, why don’t you switch your logic. Show the real screen by default, and then if and only if it’s the first time time, show the tutorial screen. That way, you’ll slide from “default” to “tutorial”, which is okay for the first time, and then every time after that you’ll just stay on default.

Also, the way I’ve done the tutorial screen in the past is with a ionicPopup. But even then, I show the main screen first, and then only show the popup if I determine the tutorial needs to be displayed.

thanks @dbashizi for your answer, but i don’t want to show real screen. Is there any way to write IF ELSE in app.js?

if(firstTime)
$urlRouterProvider.otherwise(‘/app/tutorial’);
else
$urlRouterProvider.otherwise(‘/app/main’);

I don’t think so … but if you don’t want to show the real screen, then you can still have your routing go there and have a div “hide” the content of the screen until you decide it’s okay to show in your controller. From the controller, you can then make the div visible and show the content.

yes, that’s a good alternative. let me give it a try. thanks (Y)