** iOS 7 ONLY **

iOS 7 style side menu with parallax effect.

Wrapper module for the great RESideMenu

Since 1.2 this module supports both left and right menu views.

Use TiSideMenu as a replacement for your root window.

var contentView = Ti.UI.createWindow({
	background: 'red'
});

var leftMenuView    = Ti.UI.createWindow({
	background: 'transparent'
});
var rightMenuView    = Ti.UI.createWindow({
	background: 'transparent'
});

var win = TiSideMenu.createSideMenu({
	contentView: 		contentView,
	leftMenuView: 		leftMenuView,
	rightMenuView: 		rightMenuView,
	backgroundImage: 	'stars.png',
	contentViewScaleValue: 0.2,
	scaleContentView: true,		
	panGestureEnabled: false,	
	scaleBackgroundImageView: false,
	parallaxEnabled: false,
	panFromEdge: true,
	// Blur settings
	blurBackground: true,
	tintColor: '#ffffff',
	radius: 20,
	iterations: 10
});
win.open();

• Setting the content window without animation Default

    win.setContentWindow(newWin);
  

• Setting the content window with an animation

    win.setContentWindow({
    		window: newWin,
    		animated: true 
    });
  

If the slide animation is enabled, a bug exists where an incomplete slide results in opening empty windows through a navigation / tabgroup. To resolve this issue be sure to manually hide the side Menu before opening the new window.

win.hideMenuViewController();

• Enable / Disable the pan gesture win.setPanGestureEnabled( true / false );

• Enable / Disable then pan from the edge win.setPanFromEdge( true / false );

• Enable / Disable Parallax effect win.setParallaxEnabled( true / false );

• Enable / Disable Background image scaling win.setScaleBackgroundImageView( true / false );

• Enable / Disable Content view scaling win.setScaleContentView( true / false );

• Set the content view scale value win.setContentViewScaleValue( 0.0 - 1.0 );

Manually showing / hiding the menu:

win.hideMenuViewController()

win.presentLeftMenuViewController()

win.presentRightMenuViewController()

Type: Blog / Image URL
Default: empty String

Background image to use for the menu.

Type: Float
Default: 0.5

Scale value used for the content view when the menu is shown.

Type: Boolean
Default: true

Should the content view be scaled when the menu gets displayed.

Type: Boolean
Default: true

Should the pan gesture be available for showing the menu.

Type: Boolean
Default: false

Should the pan gesture only trigger when it starts from the edge

Type: Boolean
Default: true

Should the background image view be scaled for showing the menu.

Type: Boolean
Default: true

Enable / disable the parallax effect.

Type: Boolean
Default: false

Enable / disable the iOS 7 blur effect on the background image.

Type: Color
Default: transparent

The tinting color used for the background image.

Type: Float
Default: 40

The radius used for blurring the background image.

win.addEventListener("willShowMenuViewController",function()
{
	alert("Will show menu view controller");
});

win.addEventListener("didShowMenuViewController",function()
{
	alert("Did show menu view controller");
});

win.addEventListener("willHideMenuViewController",function()
{
	alert("Will hide menu view controller");
});

win.addEventListener("didHideMenuViewController",function()
{
	alert("Did hide menu view controller");
});

I'm a web enthusiast located in Germany.

Follow me on twitter: @marcelpociot