Appcelerator Titanium Facebook喜欢菜单

时间:2012-06-04 13:51:19

标签: titanium appcelerator titanium-mobile appcelerator-mobile

那一刻我正在开发一个应用程序,我想从这里使用FacebookLikeMenü:

https://github.com/mpociot/titanium-facebook-slide-menu

// ALPHABYTES

// Facebook like menu window
var leftMenu    = Ti.UI.createWindow({
    backgroundColor: 'red',
    top:   0,
    left:  0,
    width: 150,
    zIndex: 1
});
var data = [{title:"Row 1"},{title:"Row 2"},{title:"Row 3"},{title:"Row 4"}];
var tableView   = Ti.UI.createTableView({ data: data });
leftMenu.add(tableView);
leftMenu.open();

// Facebook like menu window
var rightMenu   = Ti.UI.createWindow({
    backgroundColor: 'red',
    top:   0,
    right:  0,
    width: 150,
    zIndex: 1
});
var data = [{title:"Row 1"},{title:"Row 2"},{title:"Row 3"},{title:"Row 4"}];
var tableView   = Ti.UI.createTableView({ data: data });
rightMenu.add(tableView);
rightMenu.open();

// animations
var animateLeft = Ti.UI.createAnimation({
    left: 150,
    curve: Ti.UI.iOS.ANIMATION_CURVE_EASE_OUT,
    duration: 500
});
var animateRight    = Ti.UI.createAnimation({
    left: 0,
    curve: Ti.UI.iOS.ANIMATION_CURVE_EASE_OUT,
    duration: 500
});
var animateNegativeLeft = Ti.UI.createAnimation({
                left: -150,
                curve: Ti.UI.iOS.ANIMATION_CURVE_EASE_OUT,
                duration: 500
});


var win = Titanium.UI.createWindow({
    left: 0,
    zIndex: 10
});
var win1 = Titanium.UI.createWindow({
    backgroundColor: 'white',
    title: 'Facebook menu',
    left: 0,
    zIndex: 10
});
var nav = Titanium.UI.iPhone.createNavigationGroup({
   window: win1,
   left: 0,
   width: Ti.Platform.displayCaps.platformWidth
});
var button = Ti.UI.createButton({
    title: 'm',
    left: 10,
    width: 30,
    height: 30,
    top: 10
});
var button2 = Ti.UI.createButton({
    title: 'm',
    right: 10,
    width: 30,
    height: 30,
    top: 10
});
var touchStartX = 0;
var touchStarted = false;
win1.addEventListener('touchstart',function(e){
    touchStartX = parseInt(e.x,10);
});
win1.addEventListener('touchend',function(e){
    touchStarted = false;
    if( win.left < 0 ){
        if( win.left <= -140 ){
            win.animate(animateNegativeLeft);
            isToggled = true;
        } else {
            win.animate(animateRight);
            isToggled = false;
        }
    } else {
        if( win.left >= 140 ){
            win.animate(animateLeft);
            isToggled = true;
        } else {
            win.animate(animateRight);
            isToggled = false;
        }
    }
});
win1.addEventListener('touchmove',function(e){
    var x       = parseInt(e.globalPoint.x, 10);
    var newLeft = x - touchStartX;
    if( touchStarted ){
        if( newLeft <= 150 && newLeft >= -150)
        win.left    = newLeft;
    }
    // Minimum movement is 30
    if( newLeft > 30 || newLeft < -30 ){
        touchStarted = true;
    }
});
nav.add(button);
nav.add(button2);
win.add(nav);
win.open();


var isToggled = false;
button.addEventListener('click',function(e){
    if( !isToggled ){
        win.animate(animateLeft);
        isToggled = true;
    } else {
        win.animate(animateRight);
        isToggled = false;
    }
});

button2.addEventListener('click',function(e){
    if( !isToggled ){
        win.animate(animateNegativeLeft);
        isToggled = true;
    } else {
        win.animate(animateRight);
        isToggled = false;
    }
});

我也实现了菜单,一切都按预期工作。

现在我的问题如下: 如果我点击左侧菜单,例如“第1行”(与我一起“设置”),我希望我的设置菜单显示在主窗口中。 怎么做?

如果我创建一个新窗口并打开它,我会得到一个完整的新窗口,左边没有Facebook菜单和按钮......我不知道该怎么做?!?!有人可以帮忙吗?

谢谢, 的Sascha

2 个答案:

答案 0 :(得分:0)

我希望我没有误解你的问题,但我会在主窗口内打开新窗口作为视图。以下是一些代码:https://gist.github.com/manumaticx/4961175

或者您想要更改菜单吗?然后你会对左侧菜单窗口做同样的事情!

答案 1 :(得分:0)

var curWin = Titanium.UI.createWindow();

var menuBtn = Titanium.UI.createButton({
    title : "Menu",
    top : 20,
    left : 5,
    zIndex : 999
});

var windowView = Titanium.UI.createView({
    top : 60,
    left : 0,
    right : 0,
    width : '100%',
    height : '100%',
    backgroundColor : "blue",
    zIndex : 1
});
curWin.add(windowView);

curWin.add(menuBtn);

curWin.open();

var menuWindow = Titanium.UI.createView({
    top : 20,
    left : 0,
    width : 150
});

curWin.add(menuWindow);
//// ---- Menu Table
// Menu Titles
var menuTitles = [{
    title : 'Menu 1'
}, {
    title : 'Menu 2'
}, {
    title : 'Menu 3'
}, {
    title : 'Menu 4'
}, {
    title : 'Menu 5'
}, {
    title : 'Menu 6'
}];
// Tableview
var tableView = Titanium.UI.createTableView({
    data : menuTitles
});
menuWindow.add(tableView);
var toggle = false;
menuWindow.hide();
menuBtn.addEventListener('click', function(e) {
    if (toggle) {
        menuWindow.hide();
        toggle = false;
        windowView.left = 0;
        menuBtn.left = 5;
    } else {
        menuWindow.show();
        toggle = true;
        windowView.left = 150;
        menuBtn.left = 160;
    }
});

windowView.addEventListener('click', function(e) {
    if (toggle) {
        menuWindow.hide();
        toggle = false;
        windowView.left = 0;
        menuBtn.left = 5;
    }
});