Titanium Mobile

# Titanium.UI.iOS.TabbedBar

A button bar that maintains a selected state.

Availability
0.8
9.2.0
Extends
Titanium.UI.View

DEPRECATED SINCE 8.0.0

Use Titanium.UI.TabbedBar instead.

# Overview

A TabbedBar is a ButtonBar that maintains its state (visually distinguished as a pressed or selected look). See Titanium.UI.ButtonBar for information on styling both tabbed bars and buttons bars.

You create a TabbedBar with the Titanium.UI.iOS.createTabbedBar factory method, or <TabbedBar> Alloy element.

# Examples

# Simple Tabbed Bar with 3 items

Create a tabbed bar with 3 items.

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

# Alloy XML Markup

Previous example as an Alloy view.

<Alloy>
    <Window id="win">
        <TabbedBar id="bb1" platform="ios" backgroundColor="#369" top="50" height="25" width="200">

            <!-- The Labels tag sets the TabbedBar.labels property. -->
            <Labels>

                <!-- Specify text with node text or the title attribute. -->
                <!-- Can also specify the enabled, image and width attributes. -->

                <Label>One</Label>
                <Label>Two</Label>
                <Label>Three</Label>

            </Labels>

            <!-- Place additional views for the TabbedBar here. -->

        </TabbedBar>
    </Window>
</Alloy>

# Properties

# index

Availability
0.8
9.2.0
index :Number

Index of the currently selected button.

# labels

Availability
0.8
9.2.0
labels :Array<String> | Array<BarItemType>

Array of labels for the tabbed bar.

The labels can be specified either using an array of strings, in which case each string defines the title for a button, or using an array of simple dictionary objects, BarItemType, which can specify title, image, width and enabled state for each button.

# style

Availability
0.8
9.2.0
style :Number

Style of the tabbed bar.

The BAR style specifies a more compact style and allows the bar's background color or gradient to show through.

This API can be assigned the following constants:

Default: Titanium.UI.iOS.SystemButtonStyle.PLAIN

# Events

# click

Availability
0.9
9.2.0

Fired when a button is clicked.

There is a subtle difference between singletap and click events.

A singletap event is generated when the user taps the screen briefly without moving their finger. This gesture will also generate a click event.

However, a click event can also be generated when the user touches, moves their finger, and then removes it from the screen.

On Android, a click event can also be generated by a trackball click.

Properties

Name Type Description
index Number

Index of the clicked button.

source Object

Source object that fired the event.

type String

Name of the event fired.

bubbles Boolean

True if the event will try to bubble up if possible.

cancelBubble Boolean

Set to true to stop the event from bubbling.

Contents