Skip to content

Instantly share code, notes, and snippets.

@sumitk

sumitk/app.js

Forked from dawsontoth/app.js
Created August 29, 2012 10:32
Show Gist options
  • Save sumitk/3510132 to your computer and use it in GitHub Desktop.
Save sumitk/3510132 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. @dawsontoth dawsontoth created this gist Apr 16, 2012.
    83 changes: 83 additions & 0 deletions app.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,83 @@
    var win = Ti.UI.createWindow({
    backgroundColor: '#333'
    });

    var menuWidth = 200;

    var container = Ti.UI.createScrollView({
    disableBounce: false,
    horizontalBounce: true,
    contentWidth: Ti.Platform.displayCaps.platformWidth + menuWidth
    });
    container.contentOffset = { x: menuWidth, y: 0 };

    var startX;
    container.addEventListener('dragStart', function (evt) {
    if (evt.source == container) {
    startX = evt.source.contentOffset.x;
    }
    });
    container.addEventListener('dragEnd', function (evt) {
    if (evt.source != container) {
    return;
    }
    var endX = evt.source.contentOffset.x;
    if (endX < 0 || endX > menuWidth) {
    // The scroll view itself will handle it.
    return;
    }
    var delta = startX - endX;
    Ti.API.info(endX);
    if (delta > 10) {
    openMenu();
    }
    else if (delta < -10) {
    closeMenu();
    }
    startX = null;
    });

    function openMenu() {
    container.contentOffset = { x: 0, y: 0 };
    }

    function closeMenu() {
    container.contentOffset = { x: menuWidth, y: 0 };
    }

    var menu = Ti.UI.createScrollView({
    backgroundColor: '#123',
    left: 0,
    width: menuWidth,
    disableBounce: false,
    verticalBounce: true
    });
    menu.add(Ti.UI.createLabel({
    text: 'This is the super sexy menu.', textAlign: 'center',
    color: '#fff'
    }));
    container.add(menu);

    var content = Ti.UI.createScrollView({
    backgroundColor: '#246',
    left: menuWidth,
    width: Ti.Platform.displayCaps.platformWidth,
    disableBounce: false,
    verticalBounce: true
    });
    content.add(Ti.UI.createLabel({
    text: 'This is the main content area.', textAlign: 'center',
    color: '#fff'
    }));
    var button = Ti.UI.createButton({
    title: 'Open Menu',
    top: 20, left: 20,
    width: 200, height: 40
    });
    button.addEventListener('click', openMenu);
    content.add(button);
    container.add(content);

    win.add(container);

    win.open();