[TIMOB-18871] iOS: How to make Views inside tabbedBar work

GitHub Issue	n/a
Type	Bug
Priority	High
Status	Closed
Resolution	Not Our Bug
Resolution Date	2015-05-14T04:11:27.000+0000
Affected Version/s	n/a
Fix Version/s	Release 4.1.0
Components	iOS
Labels	alloy, tabbedbar
Reporter	Shuo Liang
Assignee	Ingo Muschenetz
Created	2015-05-05T02:45:52.000+0000
Updated	2015-05-14T04:11:27.000+0000

Description

How can we use additional views inside tabbedBar like [doc](http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.iOS.TabbedBar) say. I tried the following code, but do not work at all. So i am not sure how to do it now. Please Help.

<Alloy>
    <Window id="win" backgroundColor="white">
        <TabbedBar id="bb1" platform="ios" backgroundColor="#369" top="50" height="25" width="200" onClick="doClick" index="0">
            <Labels>
                <Label image="1.png">One</Label>  <!-- icon -->
                <Label>Two</Label>
                <Label>Three</Label>
            </Labels>
            
            <Views>
            	<View id="view1" top="100" backgroundColor='red' height="250" width="200" visible="true">1</View>
        		<View id="view2" top="100" backgroundColor='yellow' height="250" width="200" visible="false">2</View>
        		<View id="view3" top="100" backgroundColor='blue' height="250" width="200" visible="false">3</View>>
        	</Views>
        </TabbedBar>       
    </Window>
</Alloy>

Attachments

File	Date	Size
iOS Simulator Screen Shot 14 May 2015 10.32.05 am.png	2015-05-14T02:34:12.000+0000	25161

Comments

Chee Kiat Ng 2015-05-05

[~sliang], Have you tried classic to see if it works?
Shuo Liang 2015-05-05

[~cng], Not really. Since I am not sure is it suppose to work like that. Also the doc is really poor about this.

Chee Kiat Ng 2015-05-13

Just tried this on classic and it works.

   var win = Ti.UI.createWindow();
   
   var bb1 = Titanium.UI.iOS.createTabbedBar({
       labels:['One', 'Two', 'Three'],
       backgroundColor:'#336699',
       top:50,
       style:Titanium.UI.iPhone.SystemButtonStyle.BAR,
       height:25,
       width:200
   });
   win.add(bb1);
   win.open();

Moving ticket to Alloy.

Shuo Liang 2015-05-13

[~cng], ye, exactly. Sorry, the height should be 25 for all.

Chee Kiat Ng 2015-05-14

[~sliang], is this what you trying to achieve? Attached screenshot.

classic code:

   var win = Ti.UI.createWindow({
   	backgroundColor: '#FFFF'
   });
    
   var bb1 = Titanium.UI.iOS.createTabbedBar({
    //   labels:['One', 'Two', 'Three'],
    	labels:[{
    		image:'/images/appcelerator_small.png'
    	}, {
    		image:'/images/appcelerator_small.png'
    	}, {
    		image:'/images/appcelerator_small.png'
    	}],
       backgroundColor:'#336699',
       top:50,
       style:Titanium.UI.iPhone.SystemButtonStyle.BAR,
       height:25,
       width:200
   });
   win.add(bb1);
   win.open();

References here if it helps: http://docs.appcelerator.com/titanium/latest/#!/api/Titanium.UI.iOS.TabbedBar-property-labels http://docs.appcelerator.com/titanium/latest/#!/api/BarItemType

JSON Source