Ionic-framework: Delay to show ion-header on ios-transition with “back” direction

Created on 9 Jun 2017  ·  7Comments  ·  Source: ionic-team/ionic-framework

Ionic version:
[ ] 1.x (For Ionic 1.x issues, please use https://github.com/ionic-team/ionic-v1)
[ ] 2.x
[ x ] 3.x

I'm submitting a ...
[ x ] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior:
Using the ios-transition with the back direction in android, the ion-header has a delay to appear. Already with forward direction is ok.

Expected behavior:
Instead of the delay for the ion-header appearing, it would be good a fade-in effect, just as it's in foward direction.

Steps to reproduce:
app.modules.ts
IonicModule.forRoot(MyApp, { pageTransition: 'ios-transition' })

PageExample.ts
this.nav.setRoot(OtherPageExample, {}, {animate: true, direction: "back"})
or
this.nav.push(OtherPageExample, {}, {direction: "back"})

As an example, I took prints of the app animation:

  1. When clicked on sidemenu, this is closed and the page is pushed with the back direction;
  2. The page is shown, but not the ion-header;
  3. After a small delay the ion-header is shown;

image

Ionic info:

global packages:

    @ionic/cli-utils : 1.3.0
    Cordova CLI      : 7.0.1 
    Ionic CLI        : 3.3.0

local packages:

    @ionic/app-scripts              : 1.3.7
    @ionic/cli-plugin-cordova       : 1.3.0
    @ionic/cli-plugin-ionic-angular : 1.3.0
    Cordova Platforms               : android 6.2.3 ios 4.4.0
    Ionic Framework                 : ionic-angular 3.3.0

System:

    Node       : v8.0.0
    OS         : Linux 4.11
    Xcode      : not installed
    ios-deploy : not installed
    ios-sim    : not installed
v3

All 7 comments

Thanks for opening an issue with us, we will look into this.

Hey, I did some more tests and verified that it isn't a delay, but a header on top of the other. The "delay" is the disappearance of this header at the top.

  1. Click back button
  2. Show the page with a header (originally it doesn't have)
  3. "Delay" for the header to disappear

image

Any fix for this?

Any update on this ?

Same problem 1 year later.. Ionic v3...

Thanks for the issue! We have moved the source code and issues for Ionic 3 into a separate repository. I am moving this issue to the repository for Ionic 3. Please track this issue over there.

Thank you for using Ionic!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

brandyscarney picture brandyscarney  ·  3Comments

GeorgeAnanthSoosai picture GeorgeAnanthSoosai  ·  3Comments

brandyscarney picture brandyscarney  ·  3Comments

masimplo picture masimplo  ·  3Comments

manucorporat picture manucorporat  ·  3Comments