7 Answers

• Accepted Answer

  A nasty hack for this problem. It works for me on Android platform:

  tabGroup.addEventListener('focus', function(e)
  {
      setTimeout(function()
      {       
          Ti.API.debug('tab changed to ' + tabGroup.activeTab);        
      },100);
  });
  

  Ticket for this bug.

• Adding the following in your tab group setup code fixes the issue (be sure to remove it if/when the actual bug is fixed in Ti or you'll probably get the listeners called twice)

  if (Ti.Platform.osname === "android") {
      // window focus events don't work on android so this workaround
      // catches the tabGroup focus event and fires the event on the
      // active window object
      tabGroup.addEventListener('focus', function(e) {
          var win = tabGroup.activeTab.window;
          e.originalSource = e.source;
          e.source = win;
          win.fireEvent('focus', e);
      });
  }
  

• Thanks Kevin,
  It looks like you're adding an event listener to the tabGroup. I haven't tried that yet. What I have done is added listeners to the windows that are in my tabGroup. On iPhone, they seem to get tickled, on android only the open event gets caught. I'm doing something like the following:

  function winEvent(e) {
      Ti.API.info('window event> evt:' + e.type + ' window:' + e.source.name);
  }
  
  var win1 = Ti.UI.createWindow({title:'win1',name:'win1'});
  win1.addEventListener('blur', winEvent);
  win1.addEventListener('close', winEvent);
  win1.addEventListener('focus', winEvent);
  win1.addEventListener('open', winEvent);
  
  var win2 = TI.UI.createWindow({title:'win2',name:'win2'});
  win2.addEventListener('blur', winEvent);
  win2.addEventListener('close', winEvent);
  win2.addEventListener('focus', winEvent);
  win2.addEventListener('open', winEvent);
  
  var tabGroup = Ti.UI.createTabGroup();
  var t1 = Ti.UI.createTab({window:win1});
  var t2 = Ti.UI.createTab({window:win2});
  tabGroup.addTab(t1);
  tabGroup.addTab(t2);
  
  tabGroup.open();
  

  On iPhone, I'll see the event callback function reporting open, blur and focus events as you open the tabs and switch between them. on Android, I only see the open event.

• I'm baffled that this issue hasn't been fixed yet. How are we meant to detect when a tab has been accessed?

  I've got an app where the window in tab1 writes to a databse, and the window in tab2 displays the contents of that database. Its currently impossible to update the contents of the tab2 without restarting the app!

  Heres some example code which will won't work on Android:

  var tabGroup = Titanium.UI.createTabGroup();
  
  var win1 = Titanium.UI.createWindow({  
      title:'test',
      backgroundColor:'#EEE',
     url:'test.js'
  });
  var tab1 = Titanium.UI.createTab({  
      icon:'KS_nav_ui.png',
      title:'test',
      window:win1
  });
  
  var win2 = Titanium.UI.createWindow({  
      title:'test',
      backgroundColor:'#EEE',
     url:'test2.js'
  });
  var tab2 = Titanium.UI.createTab({  
      icon:'KS_nav_ui.png',
      title:'test',
      window:win2
  });
  win2.addEventListener('focus', function(e){
      Titanium.API.debug("got here");
  });
  
  tabGroup.open();
  

  You'll find that "focus" is never fired. Its as if its simply not supported (WTF?). If you change that "focus" to be an "open" instead, you'll find "got here" is output the first time the tab/window is loaded, but it is never loaded again, regardless how many times you click into the tab.

  It seems clear theres no way of firing events each time a root window associated with a tab is opened, which severely reduces the potential uses of Titanium.

• I pushed a fix for Ticket 891 yesterday.

• The indexes of the focus-event on a tabGroup is always one position behind the actual.

  Example: I click on the tabs #4, #2, #3, #1.

  The events fire with those e.index: -1, 4, 2, 3

  That means, when clicking tab #1, I can't tell, because e.index is set to the previous tab (e.previousIndex is the last but one index).

• The focus/blur events are working for me on Android when I run through the Kitchen SInk examples. Could you share some code to demonstrate what you're seeing?

  Here's the KS example:

  tabGroup.addEventListener('focus', function(e)
  {
      messageLabel.text = 'tab changed to ' + e.index + ' old index ' + e.previousIndex;
      messageWin.open();
      setTimeout(function()
      {
          Ti.API.info('tab ' + e.tab.title  + ' prevTab = ' + (e.previousTab ? e.previousTab.title : null));
          messageLabel.text = 'active title ' + e.tab.title + ' old title ' + (e.previousTab ? e.previousTab.title : null);
      },1000);
  
      setTimeout(function()
      {
          messageWin.close({opacity:0,duration:500});
      },2000);
  
  });