Skip to content
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

bug: ion-header ios 11 style only working on first tab #19640

Closed
GeorgeBark opened this issue Oct 12, 2019 · 9 comments
Closed

bug: ion-header ios 11 style only working on first tab #19640

GeorgeBark opened this issue Oct 12, 2019 · 9 comments
Labels
package: core @ionic/core package type: bug a confirmed bug report

Comments

@GeorgeBark
Copy link

Bug Report

Ionic version:

[x] 4.11.0

Current behavior:

The "condense" header is only working on the first loaded tab.
out

Expected behavior:
The header should be hidden in all tabs.

Related code:
Example in StackBlitz

Ionic info:

Ionic:

   Ionic CLI                     : 5.4.1 
   Ionic Framework               : @ionic/angular 4.11.0
   @angular-devkit/build-angular : 0.801.3
   @angular-devkit/schematics    : 8.1.3
   @angular/cli                  : 8.1.3
   @ionic/angular-toolkit        : 2.0.0


System:

   ios-deploy : 1.9.4
   ios-sim    : 6.1.3
   NodeJS     : v10.15.3 
   npm        : 6.11.3
   OS         : macOS Mojave
   Xcode      : Xcode 11.0 Build version 11A420a
@ionitron-bot ionitron-bot bot added the triage label Oct 12, 2019
@liamdebeasi
Copy link
Contributor

Glad to see someone trying the new iOS 11 style header 🙂. Looks like it was selecting the wrong ion-content when in use on tabs that were not tab 1. I'll work on a fix for this.

@liamdebeasi liamdebeasi added package: core @ionic/core package type: bug a confirmed bug report labels Oct 14, 2019
@ionitron-bot ionitron-bot bot removed the triage label Oct 14, 2019
@liamdebeasi
Copy link
Contributor

Can you try this dev build and see if it fixes the issue for you?

npm i @ionic/angular@4.12.0-dev.201910141832.776993c

@GeorgeBark
Copy link
Author

Can you try this dev build and see if it fixes the issue for you?

npm i @ionic/angular@4.12.0-dev.201910141832.776993c

Now it fails from the beginning:

image

New Stackblitz

Did I miss anything?

@liamdebeasi
Copy link
Contributor

Nope, I think I just gave you a bad build. Try this one:

npm i @ionic/angular@4.12.0-dev.201910151255.dd0d993

@rdlabo
Copy link
Contributor

rdlabo commented Oct 15, 2019

Good! This work well in my production environment!!

@GeorgeBark
Copy link
Author

Nope, I think I just gave you a bad build. Try this one:

npm i @ionic/angular@4.12.0-dev.201910151255.dd0d993

Now it works but somehow the fading animation is "flashing" the first time you enter a tab (I guess because after that it is on the stack so it is not initialised again), it is just a flash but doesn't look very nice...

out3

Link to Stackblitz

@liamdebeasi
Copy link
Contributor

Yeah that one is a known issue. I'm currently working on that separately 👍. Glad it's working now in your tabbed application.

@liamdebeasi
Copy link
Contributor

Thanks for the issue. This issue has been fixed and will be available in an upcoming release of Ionic Framework.

@ionitron-bot
Copy link

ionitron-bot bot commented Nov 16, 2019

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

@ionitron-bot ionitron-bot bot locked and limited conversation to collaborators Nov 16, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
package: core @ionic/core package type: bug a confirmed bug report
Projects
None yet
Development

No branches or pull requests

3 participants