Консультации по дизайну титана

Изучая Appcelerator Titanium, я создаю приложение, которое начинается с окна, содержащего 2 метки. Две метки (onclick) должны открывать 2 разных окна (каждое из которых содержит группы вкладок).

Итак, в моем app.js у меня есть:

Window = require('ui/handheld/ApplicationWindow');

и в моей функции ApplicationWindow:

    var window1 = Ti.UI.createWindow({
        backgroundColor:'#ffffff'
    });

    var label = Ti.UI.createLabel({ text: "Open first Window", top:10 });
    window1.add(label);

    var label2 = Ti.UI.createLabel({ text: "Open second Window", top:50 });
    window1.add(label2);

    var window2 = Titanium.UI.createWindow({url:"A.js",backgroundColor:'#00ff00'});
    var window3 = Titanium.UI.createWindow({url:"B.js",backgroundColor:'#ff0000'});

    label.addEventListener("click", function(e) {
    var t = Ti.UI.iPhone.AnimationStyle.CURL_UP;
    window1.animate({view:window2,transition:t},function(){window2.open();});
    });

    label2.addEventListener("click", function(e) {
    var t = Ti.UI.iPhone.AnimationStyle.CURL_UP;
    window1.animate({view:window3,transition:t},function(){window3.open();});
    }); 

    return window1;

Первый вопрос: хороший ли это дизайн? Это неисправимо? Как?

Второй вопрос: есть ли способ показать открываемую страницу до окончания перехода? На данный момент кажется, что JS, содержащийся в A.js и B.js, выполняется только тогда, когда анимация останавливается.

Спасибо, любая помощь приветствуется и извините за вопрос новичка.

[EDIT] Это мой текущий код после комментария Ch4rAss:

function ApplicationWindow() {

    var root = Ti.UI.createWindow({
        backgroundColor:'#ffffff'
    });

    var label = Ti.UI.createLabel({ text: "Open first Window", top:10 });
    root.add(label);

    var label2 = Ti.UI.createLabel({ text: "Open second Window", top:50 });
    root.add(label2);

    var win2 = require('ui/handheld/Win2');
    var win3 = require('ui/handheld/Win3');

    label.addEventListener("click", function(e) {
    var t = Ti.UI.iPhone.AnimationStyle.CURL_UP;
    win2.open({transition:t});
    });

   label2.addEventListener("click", function(e) {
   var t = Ti.UI.iPhone.AnimationStyle.CURL_UP;
    win3.open({transition:t});
   }); 

    return root;
}

module.exports = ApplicationWindow;

и:

function Win2(){
        /* You can (of course) do more than this */
        return Ti.UI.createWindow({backgroundColor:'#00ff00'});
    }
module.exports = Win2;

javascript commonjs appcelerator titanium
person ContentiousMaximus    schedule 12.11.2012    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Вы должны добавить анимацию в метод open(), чтобы открывать окно во время анимации:

window1.open({transition:Titanium.UI.iPhone.AnimationStyle.CURL_UP});

Я бы рекомендовал использовать отдельный файл для каждого окна и использовать CommonJS для его require(). Тот же подход, что и для ApplicationWindow. В данный момент вы создаете два окна и загружаете их в память, не используя их! Лучше бы:

var Win1 = require('ui/handheld/WhateverWindow');
label.addEventListener("click", function(e) {
   var win1 = new Win1();
   win1.open({transition:Titanium.UI.iPhone.AnimationStyle.CURL_UP});
});

И ui/handheld/WhateverWindow.js

(function() {
    var WhateverWindow = function() {
        /* You can (of course) do more than this */
        return Ti.UI.createWindow({backgroundColor:'#00ff00'});
    }
    module exports = WhateverWindow;
})();

Вы можете прочитать больше здесь.

person Ch4rAss    schedule 12.11.2012
comment
Это не работает для меня. Я немного изменил ваш код и функция W2 в файле W2.js стала: function Win2(){return Ti.UI.createWindow({backgroundColor:'#00ff00'});}module.exports = Win2; . Код вызова очень похож на ваш, но при нажатии появляется ошибка. Мой код: var win2 =require('ui/handheld/W2');label.addEventListener("click", function(e) {var t = Ti.UI.iPhone.AnimationStyle.CURL_UP;win2.open({transition:t});}); Ошибка: строка = 30; message = 'undefined' не является функцией (оценка 'win2.open({transition:t})'); имя = ошибка типа; идентификатор источника = 208669216; - person ContentiousMaximus; 12.11.2012
comment
Может быть, я не понимаю, но я жду нашего комментария: я должен создать экземпляр выигрыша следующим образом: var Win2 = require('ui/handheld/Win2'); переменная Win2 = новая Win2(). Затем win.open(...)... - person ContentiousMaximus; 12.11.2012
comment
Сорри, я случайно забыл создать объект окна. Смотрите мою правку. - person Ch4rAss; 13.11.2012
comment
Хорошо, еще один вопрос: если я хочу закрыть открытое окно, я заметил, что могу использовать close и передать переход (например, open). Я проверил это, и это сработало, но я увидел, что содержимое корневого окна появляется только после окончания перехода. Можно ли это изменить? - person ContentiousMaximus; 13.11.2012