# Titanium.UI.Android.DrawerLayout

> A panel that displays the app's main navigation options on the left edge of the screen.

- Source: https://titaniumsdk.com/docs/sdk/main/Titanium.UI.Android.DrawerLayout
- Titanium SDK version: main
- Kind: view
- Platforms: Android
- Since: Titanium SDK 6.2.0
- Extends: Titanium.UI.View
- Inheritance: Titanium.UI.View > Titanium.Proxy

| Android |
| ------- |
| ![Android](./drawerlayout_android.png) |

DrawerLayout acts as a top-level container for window content that allows for interactive "drawer"
views to be pulled out from one or both vertical edges of the window.

As per the Android Design guide, any drawers positioned to the left/start should always contain
content for navigating around the application, whereas any drawers positioned to the right/end
should always contain actions to take on the current content.

For design guidelines, see
[Google Design Guidelines: DrawerLayout](https://developer.android.com/training/implementing-navigation/nav-drawer.html)

## Example: Simple DrawerLayout

The following code shows a simple drawer-layout usage.

``` js
var win = Ti.UI.createWindow();

var leftView = Ti.UI.createView({ backgroundColor:'red' });
var centerView = Ti.UI.createView({ backgroundColor:'yellow' });
var rightView = Ti.UI.createView({ backgroundColor:'orange' });

var drawer = Ti.UI.Android.createDrawerLayout({
    leftView: leftView,
    centerView: centerView,
    rightView: rightView
});
var btn = Ti.UI.createButton({ title: 'RIGHT' });

btn.addEventListener('click', function() {
    drawer.toggleRight();
});

centerView.add(btn);

win.addEventListener('open', function(){
    var activity = win.activity,
        actionBar = activity.actionBar;

    if (actionBar) {
        actionBar.displayHomeAsUp = true;
        actionBar.onHomeIconItemSelected = function() {
            drawer.toggleLeft();
        };
    }
});

win.add(drawer);
win.open();
```

## Example: Alloy DrawerLayout example

The following code shows an Alloy version of the drawer-layout.
``` xml
<Alloy>
    <Window class="container">
        <ActionBar platform="android" displayHomeAsUp="true" onHomeIconItemSelected="onClickDrawer" />
        <DrawerLayout id="drawer" platform="android">
            <LeftView>
                <View backgroundColor="#fff"></View>
            </LeftView>
            <CenterView>
                <View>
                    <Label text="Center view" />
                </View>
            </CenterView>
        </DrawerLayout>
    </Window>
</Alloy>
```

``` js
function onClickDrawer(e){
    $.drawer.toggleLeft();
}

$.index.open();
```

## Properties

### centerView

- Type: Titanium.UI.View
- Platforms: Android

Get or set the center view

### drawerIndicatorEnabled

- Type: Boolean
- Platforms: Android
- Default: `true`

Determine the drawer indicator status

### drawerLockMode

- Type: Number
- Platforms: Android
- Default: `<Titanium.UI.Android.DrawerLayout.LOCK_MODE_UNDEFINED>`

Get or set the drawerLockMode

Accepts: `Titanium.UI.Android.DrawerLayout.LOCK_MODE_LOCKED_CLOSED`, `Titanium.UI.Android.DrawerLayout.LOCK_MODE_LOCKED_OPEN`, `Titanium.UI.Android.DrawerLayout.LOCK_MODE_UNDEFINED`, `Titanium.UI.Android.DrawerLayout.LOCK_MODE_UNLOCKED`

### isLeftOpen

- Type: Boolean
- Platforms: Android
- Default: `false`

Determine whether the left drawer is open

### isLeftVisible

- Type: Boolean
- Platforms: Android
- Default: `false`

Determine whether the left drawer is visible

### isRightOpen

- Type: Boolean
- Platforms: Android
- Default: `false`

Determine whether the right drawer is open

### isRightVisible

- Type: Boolean
- Platforms: Android
- Default: `false`

Determine whether the right drawer is visible

### leftDrawerLockMode

- Type: Number
- Platforms: Android
- Since: Titanium SDK 9.3.0
- Default: `<Titanium.UI.Android.DrawerLayout.LOCK_MODE_UNDEFINED>`

Get or set lock mode for the left drawer

Accepts: `Titanium.UI.Android.DrawerLayout.LOCK_MODE_LOCKED_CLOSED`, `Titanium.UI.Android.DrawerLayout.LOCK_MODE_LOCKED_OPEN`, `Titanium.UI.Android.DrawerLayout.LOCK_MODE_UNDEFINED`, `Titanium.UI.Android.DrawerLayout.LOCK_MODE_UNLOCKED`

### leftView

- Type: Titanium.UI.View
- Platforms: Android

Get or set the view of the left drawer

### leftWidth

- Type: Number
- Platforms: Android

Get or set the width of the left drawer

### LOCK_MODE_LOCKED_CLOSED

- Type: Number
- Platforms: Android
- Permission: read-only

Use with [DrawerLayout.drawerLockMode](https://titaniumsdk.com/docs/sdk/Titanium.UI.Android.DrawerLayout.md#drawerLockMode) to specify the drawer is locked closed.

### LOCK_MODE_LOCKED_OPEN

- Type: Number
- Platforms: Android
- Permission: read-only

Use with [DrawerLayout.drawerLockMode](https://titaniumsdk.com/docs/sdk/Titanium.UI.Android.DrawerLayout.md#drawerLockMode) to specify the drawer is locked opened.

### LOCK_MODE_UNDEFINED

- Type: Number
- Platforms: Android
- Permission: read-only

Use with [DrawerLayout.drawerLockMode](https://titaniumsdk.com/docs/sdk/Titanium.UI.Android.DrawerLayout.md#drawerLockMode) to specify the drawer is reset to default lock state.

### LOCK_MODE_UNLOCKED

- Type: Number
- Platforms: Android
- Permission: read-only

Use with [DrawerLayout.drawerLockMode](https://titaniumsdk.com/docs/sdk/Titanium.UI.Android.DrawerLayout.md#drawerLockMode) to specify the drawer is unlocked.

### rightDrawerLockMode

- Type: Number
- Platforms: Android
- Since: Titanium SDK 9.3.0
- Default: `<Titanium.UI.Android.DrawerLayout.LOCK_MODE_UNDEFINED>`

Get or set lock mode for the right drawer

Accepts: `Titanium.UI.Android.DrawerLayout.LOCK_MODE_LOCKED_CLOSED`, `Titanium.UI.Android.DrawerLayout.LOCK_MODE_LOCKED_OPEN`, `Titanium.UI.Android.DrawerLayout.LOCK_MODE_UNDEFINED`, `Titanium.UI.Android.DrawerLayout.LOCK_MODE_UNLOCKED`

### rightView

- Type: Titanium.UI.View
- Platforms: Android

Get or set the view of the right drawer

### rightWidth

- Type: Number
- Platforms: Android

Get or set the width of the right drawer

### toolbar

- Type: Titanium.UI.Toolbar
- Platforms: Android
- Since: Titanium SDK 7.1.0

A Toolbar instance to use as a toolbar.

Allows using a [Toolbar][Titanium.UI.Toolbar](https://titaniumsdk.com/docs/sdk/Titanium.UI.Toolbar.md) as a toolbar in the DrawerLayout,
exposing [Toolbar's][Titanium.UI.Toolbar](https://titaniumsdk.com/docs/sdk/Titanium.UI.Toolbar.md) properties and methods for a further customization.

This Toolbar instance is automatically set to be used as a default ActionBar.

### toolbarEnabled

- Type: Boolean
- Platforms: Android
- Default: `true`

Determine whether to enable the toolbar.

This property is ignored if the used theme provides a default ActionBar.

## Methods

### closeLeft

- Platforms: Android

Close the left view.

### closeRight

- Platforms: Android

Close the right view.

### interceptTouchEvent

- Platforms: Android

Disallow touch events on a specific view.

Parameters:

- `view` (Titanium.UI.View): View to intercept touch events.
- `disallowIntercept` (Boolean): Whether to disallow the interception of touch events.

### openLeft

- Platforms: Android

Open the left view.

### openRight

- Platforms: Android

Open the right view.

### toggleLeft

- Platforms: Android

Toggle the visibility of the left view.

### toggleRight

- Platforms: Android

Toggle the visibility of the right view.

## Events

### change

- Platforms: Android

Fired when the motion state of the drawer view changes.

Event properties:

- `drawer` (String): Contains the drawer frame type. Either `left` or `right`.
- `state` (Number): The current drawer state.
- `idle` (Boolean): Whether or not the drawer is currently idle.
- `dragging` (Boolean): Whether or not the drawer is currently dragging.
- `settling` (Boolean): Whether or not the drawer is currently settling.

### close

- Platforms: Android

Fired when the drawer view is closed.

Event properties:

- `drawer` (String): Contains the drawer frame type. Either `left` or `right`.

### open

- Platforms: Android

Fired when the drawer view is opened.

Event properties:

- `drawer` (String): Contains the drawer frame type. Either `left` or `right`.

### slide

- Platforms: Android

Fired when the drawer view changes it's position.

Event properties:

- `drawer` (String): Contains the drawer frame type. Either `left` or `right`.
- `offset` (Number): The current drawer offset.

## Inherited members

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

- [Titanium.Proxy](https://titaniumsdk.com/docs/sdk/main/Titanium.Proxy.md): `addEventListener`, `apiName`, `applyProperties`, `bubbleParent`, `fireEvent`, `lifecycleContainer`, `removeEventListener`
- [Titanium.UI.View](https://titaniumsdk.com/docs/sdk/main/Titanium.UI.View.md): `accessibilityDisableLongPress`, `accessibilityHidden`, `accessibilityHint`, `accessibilityLabel`, `accessibilityValue`, `add`, `anchorPoint`, `animate`, `backgroundColor`, `backgroundDisabledColor`, `backgroundDisabledImage`, `backgroundFocusedColor`, `backgroundFocusedImage`, `backgroundGradient`, `backgroundImage`, `backgroundRepeat`, `backgroundSelectedColor`, `backgroundSelectedImage`, `borderColor`, `borderRadius`, `borderWidth`, `bottom`, `center`, `children`, `click`, `convertPointToView`, `dblclick`, `doubletap`, `elevation`, `filterTouchesWhenObscured`, `focus`, `focusable`, `getViewById`, `height`, `hiddenBehavior`, `hide`, `horizontalWrap`, `id`, `insertAt`, `keepHardwareMode`, `keepScreenOn`, `keypressed`, `layout`, `left`, `longclick`, `longpress`, `opacity`, `overrideCurrentAnimation`, `pinch`, `postlayout`, `rect`, `remove`, `removeAllChildren`, `replaceAt`, `right`, `rotate`, `rotation`, `rotationX`, `rotationY`, `scaleX`, `scaleY`, `show`, `singletap`, `size`, `softKeyboardOnFocus`, `stopAnimation`, `swipe`, `toImage`, `tooltip`, `top`, `touchEnabled`, `touchFeedback`, `touchFeedbackColor`, `touchcancel`, `touchend`, `touchmove`, `touchstart`, `transform`, `transitionName`, `translationX`, `translationY`, `translationZ`, `twofingertap`, `viewShadowColor`, `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`.