# Titanium.UI.iOS.TabbedBar

> A button bar that maintains a selected state.

- Source: https://titaniumsdk.com/docs/sdk/13.4.0/Titanium.UI.iOS.TabbedBar
- Titanium SDK version: 13.4.0
- Kind: view
- Platforms: iPhone, iPad, macOS
- Since: Titanium SDK iPhone 0.8, iPad 0.8, macOS 9.2.0
- Extends: Titanium.UI.View
- Inheritance: Titanium.UI.View > Titanium.Proxy
- DEPRECATED since 8.0.0, removed in 10.0.0. Use [Titanium.UI.TabbedBar](Titanium.UI.TabbedBar) instead.

A `TabbedBar` is a `ButtonBar` that maintains its state (visually distinguished as a pressed or 
selected look). See [ButtonBar](https://titaniumsdk.com/docs/sdk/Titanium.UI.ButtonBar.md) for information on styling both tabbed bars and buttons bars.

You create a `TabbedBar` with the [Titanium.UI.iOS.createTabbedBar](https://titaniumsdk.com/docs/sdk/Titanium.UI.iOS.md#createTabbedBar) factory method, or **`<TabbedBar>`** Alloy element.

## Example: Simple Tabbed Bar with 3 items

Create a tabbed bar with 3 items.

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

## Example: Alloy XML Markup

Previous example as an Alloy view.

``` xml
<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

- Type: Number
- Platforms: iPhone, iPad, macOS

Index of the currently selected button.

### labels

- Type: Array<String> | Array<BarItemType>
- Platforms: iPhone, iPad, macOS

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](https://titaniumsdk.com/docs/sdk/BarItemType.md), which can specify title, image, width and enabled state for each button.

### style

- Type: Number
- Platforms: iPhone, iPad, macOS
- Default: `Titanium.UI.BUTTON_STYLE_OPTION_NEUTRAL`

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.

Accepts: `Titanium.UI.BUTTON_STYLE_OPTION_NEGATIVE`, `Titanium.UI.BUTTON_STYLE_OPTION_NEUTRAL`, `Titanium.UI.BUTTON_STYLE_OPTION_POSITIVE`

## Events

### click

- Platforms: iPhone, iPad, macOS

Fired when a button is clicked.

Event properties:

- `index` (Number): Index of the clicked button.

## Inherited members

63 members are inherited. Each is documented on the type that declares it.

- [Titanium.Proxy](https://titaniumsdk.com/docs/sdk/13.4.0/Titanium.Proxy.md): `addEventListener`, `apiName`, `applyProperties`, `bubbleParent`, `fireEvent`, `removeEventListener`
- [Titanium.UI.View](https://titaniumsdk.com/docs/sdk/13.4.0/Titanium.UI.View.md): `accessibilityHidden`, `accessibilityHint`, `accessibilityLabel`, `accessibilityValue`, `anchorPoint`, `animate`, `animatedCenter`, `backgroundColor`, `backgroundGradient`, `backgroundImage`, `backgroundLeftCap`, `backgroundRepeat`, `backgroundSelectedColor`, `backgroundTopCap`, `borderColor`, `borderRadius`, `borderWidth`, `bottom`, `center`, `clearMotionEffects`, `clipMode`, `convertPointToView`, `getViewById`, `height`, `hide`, `horizontalMotionEffect`, `horizontalWrap`, `id`, `insertAt`, `keypressed`, `layout`, `left`, `longpress`, `opacity`, `pinch`, `postlayout`, `previewContext`, `pullBackgroundColor`, `rect`, `right`, `rotate`, `rotation`, `show`, `size`, `tintColor`, `toImage`, `tooltip`, `top`, `touchEnabled`, `transform`, `verticalMotionEffect`, `viewShadowColor`, `viewShadowOffset`, `viewShadowRadius`, `visible`, `width`, `zIndex`

---

- This corpus documents Titanium SDK 13.4.1. Anything here that does not name a version describes 13.4.1.
- Titanium is maintained by TiDev. The Appcelerator toolchain is retired: there is no `appc` CLI, no Appcelerator Studio and no hosted build service. The supported CLI is `titanium` on npm, invoked as `ti`.