iOS Style Navigation in Sencha Touch 2
Recently I’ve noticed that in iOS, the navigation animation for the title bar is more than simply slide in new screen from right to left, despite I’m using iPhone for few months now, I didn’t aware of the animation until I felt something different with the animation done by Sencha Touch, the attention paid to the detail made the whole screen switching much smoother.
Your browser does not support native video tag, that’s bad
(video quality might not be that clear, but still able to see the title bar animation)
It appears that Sencha Touch 2 provide a new component Ext.navigation.View, which according to the documentation, it’s a container with extra features. Using navigation view is a bit different than what I’ve done previously.
Another navigation animation I found different from iOS native and Sencha Touch is the tab panel switching, in Sencha Touch, it use the slide effects, while in stock apps in iOS, it don’t have animation, but this one is a quick fix in Sencha Touch.
So, as usual, we need the MVC folder structure, index.html, app.js and Viewport.js to get started. In this testing, I’m using tab panel on the viewport.
Read more ... →