CODEWITHSUNDEEP
sencha-touch-2
eplatonov
eplatonov

Reputation: 65

Sencha touch 2/ app workflow with navigation view

There is a problem with sencha touch 2.

I am trying to understand how can I implement the same functionality which provides navigation view in sencha touch 2, but .... Each item of the 'Ext.NavigationView' component should have it's own unique set of 'navigationBar' elements. I mean set of buttons, for example.

I know that I can do something like this:

this.getMain().getNavigationBar().rightBox.removeAll();
this.getMain().getNavigationBar().rightBox.add(this.getSettingButton());
        //where 'getSettingButton' predefined by me a button

And do this action each time when 'push' event happens (clear 'navigationBar' and add appropriate set of buttons)

Of course, I even can implement 'Ext.Panel' with 'layout: card' and set of 'Ext.panel' elements in the 'items' property, each of which will be have unique 'toolbar'. To control the behavior I can use 'setActiveItem' method.

But, I think each of these approaches is a bit weird, isn't it?

I expected that would be much more natural approach to implement it.

Most likely I don't know what I need. Confirm my doubts. What is the best way to do it.

Upvotes: 1

Views: 2493

Answers (1)

Thiem Nguyen
Thiem Nguyen

Reputation: 6365

Currently, Ext.NavigationView tends to perform navigation between "simple" views. "Simple" here means that your views are just panel with innerHTML, not the "complicated" ones with functional buttons, toolbars, etc.

As far as I know, there're 2 ways you could try:

  1. If you still want to use Ext.NavigationView, you can customize your NavigationBar with titles, items (buttons, spacers, etc.) as normal components through navigationBar config, getter and setter.

  2. (recommended) If your views are completely different from each other, you should use many Ext.Container with different items of your choice (for eg. first container with simple HTML announcement, second one with some extra Ext.Button, and so on). Simple use animateActiveItem() for animated navigation. This way is much more flexible, I suppose.

Upvotes: 2

Related Questions