如何在appcelerator Titanium中創建滑動菜單？

Question

我想制作一個從左側打開的菜單，在頂部具有一個圖像，然后有幾個部分分別重定向到頁面。 我已經在網上搜索過，有的發布了github鏈接，當我去那里時，我凍結了。 不知道我該怎么辦？ 我應該安裝東西嗎？ 那是示例代碼嗎？ 將不勝感激。

Answer 1

您必須為此使用第三方模塊，它們在市場上是有的。 我將舉一個我使用的示例，否則您可以使用Titanium中的關鍵工作Drawer搜索其他示例。

對於Android： https : //github.com/viezel/NappDrawer/tree/master/android

var homeScreen = Alloy.createController("homeScreen").getView();

var NappDrawerModule = require('dk.napp.drawer');
Alloy.Globals.drawer = NappDrawerModule.createDrawer({
    fullscreen : false,
    leftWindow : Alloy.createController('leftMenu').getView(),
    centerWindow : homeScreen,
    fading : 0.2, // 0-1
    parallaxAmount : 0.2, //0-1
    exitOnClose : true,
    shadowWidth : "5dp",
    leftDrawerWidth : "280dp",
    animationMode : NappDrawerModule.ANIMATION_NONE,
    closeDrawerGestureMode : NappDrawerModule.CLOSE_MODE_NONE,
    openDrawerGestureMode : NappDrawerModule.OPEN_MODE_NONE,
    orientationModes : [Ti.UI.PORTRAIT, Ti.UI.UPSIDE_PORTRAIT]
});

Alloy.Globals.drawer.addEventListener("didChangeOffset", function(e) {
    //Ti.API.info("didChangeOffset: " + e.offset);
});
Alloy.Globals.drawer.addEventListener("android:back", function(e) {
    Ti.API.info('currentWindow : ' + Alloy.Globals.currentWindow);
    if (Alloy.Globals.currentWindow != null) {
        return;
    }
});

Alloy.Globals.drawer.addEventListener("windowDidOpen", function(e) {

    if (e.window == NappDrawerModule.LEFT_WINDOW) {
        Ti.API.info("windowDidOpen - LEFT DRAWER");
    } else if (e.window == NappDrawerModule.RIGHT_WINDOW) {
        Ti.API.info("windowDidOpen - RIGHT DRAWER");
    }

});

Alloy.Globals.drawer.addEventListener("open", function(e) {
        Ti.API.info('Drawer Open');
});

Alloy.Globals.drawer.addEventListener("windowDidClose", function(e) {
    Ti.API.info("windowDidClose");
});

// lets open it
Alloy.Globals.drawer.open();

對於iOS： https : //github.com/viezel/NappSlideMenu

Alloy.Globals.SlideWindow = Alloy.createController("leftMenu");
var homeWindow = Alloy.createController("homeScreen").getView();

var NappSlideMenu = require('dk.napp.slidemenu');

var window = NappSlideMenu.createSlideMenuWindow({
    centerWindow : homeWindow,
    leftWindow : Alloy.Globals.SlideWindow.getView(),
    leftLedge : (Alloy.Globals.iPad) ? 170 : 70,
    parallaxAmount : 0.2,
});

Alloy.Globals.window = window;

window.addEventListener("viewWillOpen", function(e) {
});

window.addEventListener("viewWillClose", function(e) {
});

exports.openLeft = function() {
    window.toggleLeftView();
};

exports.openRight = function() {
    window.toggleRightView();
};

window.open();

注意： android的leftMenu和homeScreen是一個View ，而iOS的是一個Window 。

祝你好運，干杯