CODEWITHSUNDEEP
ionic-framework
DAN
DAN

Reputation: 3260

how to disable swipe effect of IOS platform in ionic

I'm new to Ionic . I'm creating an phonegap app using ionic blank template. When i swipe from left to right on second page of my app a black screen appears. I don't know from where it comes.I cant go back to previous page.I need to kill the app to solve this issue. Following are code before and after the swipe :

before : 

<ion-nav-view nav-view-transition="ios" nav-view-direction="forward" class="view-container disable-user-behavior" nav-swipe="">
<ion-pane class="pane" nav-view="active" style="opacity: 1; box-shadow: rgba(0, 0, 0, 0) 0px 0px 10px; -webkit-transform: translate3d(0%, 0px, 0px);">
<form name="memberInfo" ng-submit="saveMemberInfo(data)" class="ng-pristine ng-valid">
......
</ion-pane>
</ion-nav-view>

after :

<ion-nav-view nav-view-transition="ios" nav-view-direction="back" class="view-container disable-user-behavior" nav-swipe=""><ion-pane class="pane" nav-view="active" style="opacity: 1; box-shadow: rgba(0, 0, 0, 0.298039) 0px 0px 10px; -webkit-transform: translate3d(0%, 0px, 0px); -webkit-transition: 0ms; transition: 0ms;">
<form name="memberInfo" ng-submit="saveMemberInfo(data)" class="ng-pristine ng-valid">
........
</ion-pane><div class="pane" nav-view="cached" style="opacity: 0.9; -webkit-transform: translate3d(-33%, 0px, 0px); -webkit-transition: 0ms; transition: 0ms;"></div></ion-nav-view>

This issue is only appears in ios.

anybody knows how this issue is coming ?

Upvotes: 16

Views: 13785

Answers (5)

SuperStar518
SuperStar518

Reputation: 2885

In my case, there's a workaround using $ionicSideMenuDelegate.

$ionicSideMenuDelegate.canDragContent(false);

Of course, you should inject the delegate into the controller's dependencies.

Upvotes: 0

Greg
Greg

Reputation: 1402

In case code above is not working: in the run function you can add:

$ionicPlatform.views.swipeBackEnabled(false);

Upvotes: 1

Ciriac
Ciriac

Reputation: 109

In the latest version of ionic you can also disable the swipe to go back feature only for certain views by using can-swipe-back="false" on ion-view.

<ion-view can-swipe-back="false"></ion-view>

Upvotes: 11

DAN
DAN

Reputation: 3260

I wrote below code in app.js file . 

angular.module(....)
.config(function($stateProvider,$urlRouterProvider,$ionicConfigProvider){

    $ionicConfigProvider.views.swipeBackEnabled(false);

.
.
.
.//remaining code in config
}

Upvotes: 4

LarsBauer
LarsBauer

Reputation: 1545

According to the Ionic forum just use the following line of code in the config of your AngularJS module:

$ionicConfigProvider.views.swipeBackEnabled(false);

Upvotes: 32

Related Questions