Slide Menu For iOS using Alloy With latest Titanium sdk

Question

I want to create a sliding menu on the right side of the screen but all the tutorials and links that I found on internet were using older sdks with navigationGroup. Can anyone please help me to make it?

Answer 1

<Alloy>
    <Window class="container" id="window">
        <Require type="view" src="menu" id="menu"></Require>
        <View id="displayedView">
            <View id="topView">
                <View id="viewForBack" onClick="back">
                    <ImageView id="backButton" >
                    </ImageView>
                </View>
                <Label id="headerLabel">
                    Window Name
                </Label>
                <View id ="menuButtonView" onTouchstart="showMenu">
                    <ImageView id="menuButton">
                    </ImageView>
                </View>
            </View>
        </View>
    </Window>
</Alloy>

This is the main window in this we have requires the side menu as a view

<Alloy>
    <View id="menu" >

        // put the menu view design code here

    </View>
</Alloy>

with this the menu view is created first and it is behind the main view of the window we have . All we have to do is slide the top view to create sliding animation

int menuPosition = 1;

function showMenu()
{
    if(menuPosition == 1)
    {
     var a = Ti.UI.createAnimation();
                    a.left = "-100%";
                    a.curve = Ti.UI.ANIMATION_CURVE_EASE_OUT;
                    a.duration = 500;
                    $.displayedView.animate(a);
                    a = null;
                    $.menuButton.zIndex = 1;
    }
    else
    {
     var a = Ti.UI.createAnimation();
                    a.left = "0%";
                    a.curve = Ti.UI.ANIMATION_CURVE_EASE_OUT;
                    a.duration = 500;
                    $.displayedView.animate(a);
                    a = null;
                    $.menuButton.zIndex = 1;
    }   
  menuPosition = -menuPosition;
}

hope this helps