title: Flickering during the transition between views on iOS (ionic framework)
body: <p>This is the video of the issue: <a href="https://youtu.be/9m1MlaiuZB0" rel="nofollow noreferrer">https://youtu.be/9m1MlaiuZB0</a></p>
  
  <p>On the video you can see that during the transition between tabs there is a strange flickering. This issue occures only when the animation of the transition goes from right to left.</p>
  
  <p>The tabs are custom and implemented as a button-bar in the subheader.</p>
  
  <pre><code>$scope.data.tabs = [
    {
      title: "Accepted",
      state: "events.accepted"
    },
    {
      title: "Pending",        
      state: "events.pending"
    },
    {
      title: "Declined",    
      state: "events.declined"
    }
  ];
  
  
  &lt;ion-view&gt;   
    .....
  
    &lt;ion-header-bar align-title="center" class="bar bar-subheader event-type-bar"&gt;
      &lt;div class="button-bar"&gt;
        &lt;a class="button button-light event-type-bar-button" ng-repeat="tab in data.tabs" tab-state ui-sref="{{tab.state}}"&gt;
          {{tab.title}}
        &lt;/a&gt;
      &lt;/div&gt;
    &lt;/ion-header-bar&gt;
  
    &lt;ion-nav-view name="events-view"&gt;&lt;/ion-nav-view&gt;
  
    .....
  &lt;/ion-view&gt;
  </code></pre>
  
  <p>Click on the tab changes the state and loads the new view.</p>
  
  <p>This is my UI-router config for these tabs:</p>
  
  <pre><code>  .state('events', {
      url: '/events',
      abstract: true,
      templateUrl: 'views/events/events.html',
      controller: 'EventsCtrl'
    })
    .state('events.accepted', {
      url: '/accepted',
      views:{
          'events-view':{
          templateUrl: 'views/events/accepted.html',
          controller: 'AcceptedEventsCtrl',
          }
      }
    })
    .state('events.pending', {
      url: '/pending',
      views: {
          'events-view': {
          templateUrl: 'views/events/pending.html',
          controller: 'PendingEventsCtrl',
        }
      }
    })
    .state('events.declined', {
      url: '/declined',
      views: {
          'events-view': {
          templateUrl: 'views/events/declined.html',
          controller: 'DeclinedEventsCtrl',
          }
      }   
    })
  </code></pre>
  
  <p>I tried to change the direction of the transition with <a href="http://ionicframework.com/docs/api/directive/navDirection/" rel="nofollow noreferrer">nav-direction</a>, but it doesn't help.</p>
  
  <p>As a workaround I disabled the animation during the transitions between nav-views (from <a href="https://stackoverflow.com/questions/29098079/how-to-disable-change-animation-between-views-in-ion-nav-view">there</a>), but it's not the way which I'm looking for.</p>
  
  <p>My ionic configuration:</p>
  
  <ul>
  <li>Cordova CLI: 5.3.3 </li>
  <li>Ionic Version: 1.1.0 </li>
  <li>Ionic CLI Version: 1.7.1</li>
  </ul>
  
  <p>By the way, the issue reproduces on the iOS device (iPhone 6) and simulator both, and also in the Chrome Device mode too.</p>
  
  <p>Thanks in advance.</p>