Search code examples
sencha-touchextjssencha-touch-2sencha-architect

Sencha Touch 2 fixed header


Is there a way to have a fixed non animated header in a sencha app and still retain page animation and browsing history?

I need my header to not animate on a page slide. The way i tried it is:

-main container (v box)
--header container
--card container(card layout)
---card
---card2
---card3

Etc

And I manually switch the cards inside the card container with setActiveItem(index) The header is never animated in/out but I dont have history now so the only way to have a back button is manually hard coding it with setActiveItwm(prevIndex)

Its an unfortunate and dirty solution maybe somebody else has a better one.


Solution

  • Yes I achieved it using sencha architect to test. From memory I created a base container that had layout vbox. Inside that I had a top tabpanel and under that a tabpanel. I then set the flex on the top panel to 0.2 and the tabpanel to 0.8. That way my header will always be 20% height on any device. I hope this helps.