[TIMOB-11454] iOS: Accessibility: TabbedBar: Accessibility does not work on Tabbed Bar

GitHub Issue	n/a
Type	Bug
Priority	Medium
Status	Closed
Resolution	Not Our Bug
Resolution Date	2013-01-11T10:00:09.000+0000
Affected Version/s	Release 3.0.0
Fix Version/s	2012 Sprint 25, 2012 Sprint 25 Core
Components	iOS
Labels	qe-ios100112, qe-nfc
Reporter	Satyam Sekhri
Assignee	Max Stepanov
Created	2012-10-13T06:47:15.000+0000
Updated	2013-03-13T19:09:46.000+0000

Description

The accessibility does not work for Tabbed bar. The Label, Value or Hint are not voiced over. Though the Accessibility Hidden works as Tabbed bar with AccessibilityHidden as True does not voice over the default text as well. Steps To Reproduce: 1. Open the application below with voice over ON 2. Touch the first Tabbed Bar 3. Touch the second Tabbed Bar Actual: After Step 2: The default text is spoken but not the Label, Value and Hint defined After Step 3: Nothing is spoken, not even the default text Expected: After Step 2: The Label Value and Hint should be spoken by the device

var win = Ti.UI.createWindow({
    title : 'Welcome',
    backgroundColor: "#fff"
});
	var label2=Ti.UI.createLabel({
			text:'Tabbed bar with Accessibility properties',
			top: 70
		});
		var tb2=Ti.UI.iOS.createTabbedBar({
			labels:['Four', 'Five', 'Six'],
			backgroundColor:'#336699',
			top:100,
			style:Titanium.UI.iPhone.SystemButtonStyle.BAR,
			height:25,
			width:200,
			index:1,
			accessibilityLabel:'Tabbed Bar one',
			accessibilityValue:'Value',
			accessibilityHint:'Tabbed Bar has three tabs'
		});
		var label4=Ti.UI.createLabel({
			text:'Tabbed bar with Accessibility Hidden',
			top: 230
		
		});
		var tb4=Ti.UI.iOS.createTabbedBar({
			labels:['Seven', 'Eight'],
			backgroundColor:'#336699',
			top:260,
			style:Titanium.UI.iPhone.SystemButtonStyle.BAR,
			height:25,
			width:200,
			index:1,
			accessibilityLabel:'Tabbed Bar three',
			accessibilityValue:'Value for 3',
			accessibilityHint:'Tabbed Bar has two tabs',
			accessibilityHidden:true
		});
		
 win.add(label2);
 win.add(tb2);
 win.add(label4);
 win.add(tb4);
win.open();

Comments

Max Stepanov 2012-10-14

Correct test case

   var win = Ti.UI.createWindow({
       title : 'Welcome',
       backgroundColor: "#fff"
   });
       var label2=Ti.UI.createLabel({
               text:'Tabbed bar with Accessibility properties',
               top: 70
           });
           var tb2=Ti.UI.iOS.createTabbedBar({
               labels:[{title:'Four', accessibilityLabel:'Four accessibility label'}, 'Five', 'Six'],
               backgroundColor:'#336699',
               top:100,
               style:Titanium.UI.iPhone.SystemButtonStyle.BAR,
               height:25,
               width:200,
               index:1,
           });
           var label4=Ti.UI.createLabel({
               text:'Tabbed bar with Accessibility Hidden',
               top: 230
            
           });
           var tb4=Ti.UI.iOS.createTabbedBar({
               labels:[{title:'Seven', accessibilityLabel:'Seven accessibility label'}, 'Eight'],
               backgroundColor:'#336699',
               top:260,
               style:Titanium.UI.iPhone.SystemButtonStyle.BAR,
               height:25,
               width:200,
               index:1,
               accessibilityHidden:true
           });
            
    win.add(label2);
    win.add(tb2);
    win.add(label4);
    win.add(tb4);
   win.open();

Possible iOS platform bug. accessibilityLabels set this way (as suggested by WWDC 2012 Accessibility session) work in Simulator with Accessibility Inspector enabled.

Max Stepanov 2012-12-13

Accessibility features provided for TabbedBar buttons, not TabbedBar itself. Please see documentation for BarItemType labels:[{title:'Four', accessibilityLabel:"Accessible label 4"}, 'Five', 'Six'],
Satyam Sekhri 2013-01-11

Defining accessibility properties per TabbedBar button (as in comment above), the accessibility label is still not spoken for 'Four' button. However accessibilityHidden works when defined on TabbedBar. Verified On: SDK: 3.0.0 GA, 3.1.0.v20130105233407 iOS Device: iPad3 (v6.0)
Max Stepanov 2013-01-11

Please test with buttons that are images w/o titles. Note the other comment about iOS device-only bug with accessibilityLabels on titles tabbed buttons.

Satyam Sekhri 2013-01-15

Accessibility Label is voiced over for tabbed bar buttons. On iOS6 only the Accessibility Label is voiced over only for button with images without title. Verified on: Studio: 3.0.1.201212181159 SDK: 3.0.0.GA, 3.1.0.v20130105233407 iOS Device: iPad2 (v5.1), iPad3 (v6.0) XCode: 4.5.2 Following code was used to verify:

   var win = Ti.UI.createWindow({
       title : 'Welcome',
       backgroundColor: "#fff"
   });
       var label2=Ti.UI.createLabel({
               text:'Tabbed bar with Accessibility properties',
               top: 70
           });
           var tb2=Ti.UI.iOS.createTabbedBar({
               labels:['Four', {title:'Five', accessibilityLabel:'Button Five here', accessibilityHint:'This is hint'}, {title:'Six', accessibilityLabel:'Sixth button'}],
               backgroundColor:'#336699',
               top:100,
               style:Titanium.UI.iPhone.SystemButtonStyle.BAR,
               height:25,
               width:200,
               index:1,
           });
           var label4=Ti.UI.createLabel({
               text:'Tabbed bar with Image',
               top: 230
             
           });
           var buttonObjects = [
   				{title:'Left Tab', width:110, enabled:false},
   				{image:'/images/slider_thumb.png', width:50, accessibilityValue:'Value for second bar', accessibilityHint:'Tabbed Bar has one image tab', accessibilityLabel:'Tabbed Bar with Image'},
   				{title:'Right Tab', width:140}
   			];
           var tb4=Ti.UI.iOS.createTabbedBar({
               labels:buttonObjects,
               backgroundColor:'#336699',
               top:260,
               style:Titanium.UI.iPhone.SystemButtonStyle.BAR,
               height:25,
               width:200,
               index:1,
               //accessibilityHidden:true
           });
             
    win.add(label2);
    win.add(tb2);
    win.add(label4);
    win.add(tb4);
   win.open();

JSON Source