在钛中进行过渡的正确方法是什么？

Question

我不知道如何在 Titan 中的视图之间进行转换。

我在两个文件中有两个视图（也许我应该使用不同的窗口？）。

ApplicationWindow.js

//Application Window Component Constructor
function ApplicationWindow() {
    //load component dependencies
    var FirstView = require('ui/common/FirstView');

    //create component instance
    var self = Ti.UI.createWindow({
        backgroundColor:'#ffffff'
    });

    //construct UI
    var firstView = new FirstView();
    self.add(firstView);

    return self;
}

FirstView.js

//FirstView Component Constructor
function FirstView() {
    //create object instance, a parasitic subclass of Observable
    var self = Ti.UI.createView();

    var create_button = Ti.UI.createButton({
        title: L('create_game'),
        height:'auto',
        width:200,
        top:40,
        borderWidth:1
    });
    self.add(create_button);

    var join_button = Ti.UI.createButton({
        title: L('join_game'),
        height:'auto',
        width:200,
        top:80,
        borderWidth:1
    });

    self.add(join_button);

    var anim;

    create_button.addEventListener('click', function(e) {
        var CreateGameView = require('ui/common/CreateGameView');
        var createGameView = new CreateGameView();
        createGameView.setLeft(640);
        self.parent.add(createGameView);
        anim = Ti.UI.createAnimation({
        left: -640,
        duration: 1000
        });
        self.animate(anim, function() {
            anim = Ti.UI.createAnimation({
            left: 0,
            duration: 1000
            });
            createGameView.animate(anim);
        });

    });

    join_button.addEventListener('click', function(e) {
        alert(e.source.text);
    });

    return self;
}

module.exports = FirstView;

CreateGameView.js

//CreateGameView Component Constructor
function CreateGameView() {
    //create object instance, a parasitic subclass of Observable
    var self = Ti.UI.createView();

    var start_button = Ti.UI.createButton({
        title: 'Pickles',
        height:'auto',
        width:200,
        top:40,
        borderWidth:1
    });
    self.add(start_button);

    var join_button = Ti.UI.createButton({
        title: L('join_game'),
        height:'auto',
        width:200,
        top:80,
        borderWidth:1
    });

    // Add behavior for UI
    join_button.addEventListener('click', function(e) {
        alert(e.source.text);
    });

    return self;
}

module.exports = CreateGameView;

这段代码真的不起作用。

帮助？

Answer 1

尝试使用不同的动画对象。

create_button.addEventListener('click', function(e) {
        var CreateGameView = require('ui/common/CreateGameView');
        var createGameView = new CreateGameView();
        createGameView.left=640;
        self.parent.add(createGameView);
        anim = Ti.UI.createAnimation({
        left: -640,
        duration: 1000
        });
        self.animate(anim, function() {
            var anim1 = Ti.UI.createAnimation({
            left: 0,
            duration: 1000
            });
            createGameView.animate(anim1);
        });

    });