No Support for Tab Transitions in Ionic

Ionic Framework ionic-v3
1

Happy to see ionic team coming with new innovative solutions. But i often feel they are just ignoring the basic features and necessities and moving over to develop goodies.

I have spent over 9 hours searching for the most basic requirement. That is adding some animation to the tabs when swiping. Just fading would also be good rather than the ugly static page switch.

As of now. I’m switching over to Framework 7. Its seem to have what i need. But I really prefer Ionic. I love the structure , the syntax and ionic CLI . But due to lack of few basic features made me take up this choice.
Finally I opened this thread to remind the Ionic team to focus on making the basic solid rather than focusing too much on extra goodies . Do help me keep the thread alive if you feel the same.

Cheers,
Karthik

2

There are a few solutions to this I think. Here’s one: https://github.com/zyra/ionic2-super-tabs

4

I tried that. But no luck. A lot of bugs and poor documentation :frowning:

5

You can manually add CSS3 animations as style with [ngClass]=“tab-style (or your tab name)”

Trigger CSS3 animation using (click). So whenever you click on a certain tab, it adds CSS3 animation class to tab. You can add slide in CSS3 animations using translateX property or fade in animation using opacity property.

I managed to make this work on my tab. Try to search about ngClass and CSS3 animations.