Remove tab focus for tabPanel in sencha touch

Question

How do I remove the focus of any tab on a tabPanel in Sencha Touch? I am opening up a different dialog that does not have a tab in the tabPanel, and I want to represent that so that the user doesn't get confused. How do I do this? Calling views.tabPanel.setActiveItem(-1) and views.tabPanel.setActiveItem(null) don't work. Any ideas?

Answer 1

FYI, for Sencha Touch 2 I've implemented the following. Note however, that it is a workaround, so take it with a grain of salt.

In my app.js

...
setActiveTab: function(idOfTabToActiveOrNull) {
  var tb = Ext.Viewport.getDockedComponent('your-tabbar-id');
  if (tb && !idOfTabToActiveOrNull) {
    var at = an.getActiveTab();
    if (at) { at.setActive(false); }
    // Note that this only changes style, but the tab is still "active" in the tabbar
  } else if (an) {
    tb.setActiveTab(idOfTabToActiveOrNull);
    tb.getActiveTab().setActive(true); // just to be sure it's marked
  }
},
...

Use it like this:

YourApp.app.setActiveTab(null); // remove styles for active tab
YourApp.app.setActiveTab('id-of-other-tab'); // change to different tab

Answer 2

I think , for tabpanel, it is also require one and only one tab active.

Not sure. I'm also a newbie to js and sencha touch.