Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-6486] Android: Tabs don't fire click events

GitHub Issuen/a
TypeBug
PriorityCritical
StatusClosed
ResolutionFixed
Resolution Date2013-11-23T00:56:52.000+0000
Affected Version/sRelease 1.7.5, Release 1.8.0.1
Fix Version/sSprint 2011-49, Release 1.7.6, Release 1.8.0.1, Release 3.0.0, Release 3.1.0, 2012 Sprint 21 Core, 2012 Sprint 21, 2013 Sprint 24, 2013 Sprint 24 API, Release 3.2.0
ComponentsAndroid
Labelsmerge-1.7.6, module_tabgroup, qe-and100112, qe-closed-3.2.0, qe-testadded, regression
ReporterKarol Pomaski
AssigneePing Wang
Created2011-12-06T12:49:43.000+0000
Updated2013-11-27T17:56:53.000+0000

Description

Problem

The "click" event never gets triggered on the tabs.

Reproducible Steps

1. Use the example code from above 2. Click on the tabs

Sample Code

// this sets the background color of the master UIView (when there are no windows/tab groups on it)
Titanium.UI.setBackgroundColor('#000');

// create tab group
var tabGroup = Titanium.UI.createTabGroup();



//
// create base UI tab and root window
//
var win1 = Titanium.UI.createWindow({  
    title:'Tab 1',
    backgroundColor:'#fff'
});
var tab1 = Titanium.UI.createTab({  
    icon:'KS_nav_views.png',
    title:'Tab 1',
    window:win1
});

var label1 = Titanium.UI.createLabel({
	color:'#999',
	text:'I am Window 1',
	font:{fontSize:20,fontFamily:'Helvetica Neue'},
	textAlign:'center',
	width:'auto'
});

win1.add(label1);

//
// create controls tab and root window
//
var win2 = Titanium.UI.createWindow({  
    title:'Tab 2',
    backgroundColor:'#fff'
});
var tab2 = Titanium.UI.createTab({  
    icon:'KS_nav_ui.png',
    title:'Tab 2',
    window:win2
});

var view = Ti.UI.createView({
	top: 10,
	left: 10,
	width: 200,
	heigh: 200,
	backgroundColor: 'red'
});

var view2 = Ti.UI.createView({
	top: 20,
	left: 20,
	width: 100,
	heigh: 100,
	backgroundColor: 'green'
});
view.add(view2);


tabGroup.addTab(tab1);  
tabGroup.addTab(tab2);  


// open tab group
tabGroup.open();

tabGroup.addEventListener('click', function(e) {
	Ti.API.info("clicked tabgroup");
});

// tabs don't fire 'click' events
tab1.addEventListener('click', function(e) {
	Ti.API.info("clicked tab1");
});
tab2.addEventListener('click', function(e) {
	Ti.API.info("clicked tab2");
});

Comments

  1. Natalie Huynh 2011-12-07

    Tested with 1.8.0.1.v20111207090257 v8/rhino on Galaxy 10.1 (3.1) Droid 1 (2.2.2) Droid 3 (2.3.4) Emulator (4.0)
  2. Michael Pettiford 2011-12-09

    Tested on Ti Studio 1.0.7.201112080131 
Ti Mob SDK 1.8.0.1.v20111209102124 v8/rhino 
OSX Lion Nexus S OS 2.3.6 Expected behavior of click events firing is shown
  3. Dustin Hyde 2012-01-03

    Added label qe-testadded.
  4. Tamila Smolich 2012-10-10

    Reopening the bug, since tabs do not fire click events. Adding "regression" label, the behavior does not occur on 2.1.3. Tested on: OS: Mac OS X Lion 10.7.4 Titanium Studio, build: 3.0.0.201210090117 Titanium SDK, build: 3.0.0.v20121009111437 Device: Samsung Galaxy III (4.0.4)
  5. Allen Yeung 2012-10-11

    PR: https://github.com/appcelerator/titanium_mobile/pull/3181 For testing, run the code below and try the following:
       // this sets the background color of the master UIView (when there are no windows/tab groups on it)
       Titanium.UI.setBackgroundColor('#000');
        
       // create tab group
       var tabGroup = Titanium.UI.createTabGroup();
        
        
        
       //
       // create base UI tab and root window
       //
       var win1 = Titanium.UI.createWindow({  
           title:'Tab 1',
           backgroundColor:'#fff'
       });
       var tab1 = Titanium.UI.createTab({  
           icon:'KS_nav_views.png',
           title:'Tab 1',
           window:win1
       });
        
       var label1 = Titanium.UI.createLabel({
           color:'#999',
           text:'I am Window 1',
           font:{fontSize:20,fontFamily:'Helvetica Neue'},
           textAlign:'center',
           width:'auto'
       });
        
       win1.add(label1);
        
       //
       // create controls tab and root window
       //
       var win2 = Titanium.UI.createWindow({  
           title:'Tab 2',
           backgroundColor:'#fff'
       });
       var tab2 = Titanium.UI.createTab({  
           icon:'KS_nav_ui.png',
           title:'Tab 2',
           window:win2
       });
        
       var view = Ti.UI.createView({
           top: 10,
           left: 10,
           width: 200,
           heigh: 200,
           backgroundColor: 'red'
       });
        
       var view2 = Ti.UI.createView({
           top: 20,
           left: 20,
           width: 100,
           heigh: 100,
           backgroundColor: 'green'
       });
       view.add(view2);
        
        
       tabGroup.addTab(tab1);  
       tabGroup.addTab(tab2);  
        
        
       // open tab group
       tabGroup.open();
        
       tabGroup.addEventListener('click', function(e) {
           Ti.API.info("clicked tabgroup");
       });
        
       // tabs don't fire 'click' events
       tab1.addEventListener('click', function(e) {
           Ti.API.info("clicked tab1");
       });
       tab1.addEventListener('blur', function(e) {
           Ti.API.info("blur tab1");
       });
       tab1.addEventListener('focus', function(e) {
           Ti.API.info("focus tab1");
       });
       tab2.addEventListener('click', function(e) {
           Ti.API.info("clicked tab2");
       });
       tab2.addEventListener('blur', function(e) {
           Ti.API.info("blur tab2");
       });
       tab2.addEventListener('focus', function(e) {
           Ti.API.info("focus tab2");
       });
       
    1. Click on tab 2 2. Click on tab 1 After startup, you should get:
       I/TiAPI   ( 7861):  focus tab1
       
    After clicking on tab 2, you should get:
       I/TiAPI   ( 7861):  blur tab1
       I/TiAPI   ( 7861):  clicked tab2
       I/TiAPI   ( 7861):  focus tab2
       I/TiAPI   ( 7861):  clicked tabgroup
       
    After clicking on tab 1, you should get:
       I/TiAPI   ( 7861):  blur tab2
       I/TiAPI   ( 7861):  clicked tab1
       I/TiAPI   ( 7861):  focus tab1
       I/TiAPI   ( 7861):  clicked tabgroup
       
  6. Bill Dawson 2012-10-12

    PRs for 3.0.0 and master have been merged.
  7. Tamila Smolich 2012-10-17

    Closing as fixed. Verified and tested on: Titanium Studio, build: 3.0.0.201210151149 Titanium SDK, builds: 3.0.0.v20121017100120; 3.1.0.v20121017102121 Device: Nexus 7 (4.1.1)
  8. Tamila Smolich 2012-10-17

    Reopening to make changes in comment
  9. Shyam Bhadauria 2012-10-18

    This issue also occuring on iOS (checked on iPad iOS 6.0 , iPad iOS 5.1) Titanium SDK: 3.0.0.v20121015174610 Titanium  Studio: 2.1.3.201209101847 Note to QE - Please verfiy for iOS as well while closing.
  10. Paras Mishra 2013-11-22

    I am able to reproduce this issue. Using the Environment: Device : Google Nexus 7, Android Version: 4.2.1 SDK: 3.2.0.v20131121163252 CLI version : 3.2.0-alpha OS : MAC OSX 10.9 Alloy : 1.3.0 Appcelerator Studio, build: 3.2.0.201311200357 XCode : 5.0.2
  11. Ping Wang 2013-11-22

    The test case works fine for TabHost tabgroup for targetSdkVersion<11 but does not work for ActionBar tabgroup for targetSdkVersion>=11. This is not a regression. Tested with 3.1.1.GA, it does not work for ActionBar tabgroup either.
  12. Ping Wang 2013-11-22

  13. Samuel Dowse 2013-11-27

    Verified fixed on: Mac OSX 10.9 Mavericks Titanium Studio, build: 3.2.0.201311262027 Titanium SDK, build: 3.2.0.v20131126144841 CLI: 3.2.0-beta Alloy: 1.3.0-beta Android Devices: Galaxy SIII (4.0.4) - Working Xperia S (4.1.2) - Working Galaxy Nexus (4.2.2) - Working Tabs fire click events, blur events, and focus events as expected. Closing.

JSON Source