Sencha Touch: панель инструментов внутри TabPanel

Я новичок в Sencha Touch и просто пытаюсь разместить панель инструментов внутри TabPanel. Я делаю это, потому что TabPanel будет моей основной навигацией, а панель инструментов будет предоставлять несколько операций, связанных с контентом, таких как создание нового домашнего задания или что-то в этом роде.

Вот мое «решение», которое совершенно не работает. Появится TabPanel и «Hello World» тоже, но панели инструментов не будет.

var tapHandler = function(btn, evt) {
alert("Button "+btn.text+" tapped");
}

var HomeScreen = new Ext.Panel({
fullscreen: true,
dockedItems: [
    {
        xtype: "toolbar",
        title: "buttons",
        ui: "light",
        dock: "bottom",
        items: [
            {ui: "action", text: "Add"}
        ],
        defaults: {
            handler: tapHandler
        }
    }
],
html: "Hello World"
});

new Ext.Application({
name: "Hello World",

launch: function() {
    var tabPanel = new Ext.TabPanel({
        fullscreen: true,
        ui: 'dark',
        sortable: true,
        items: [
            {
                title: "Home",
                html: "Loading..."
            }
        ]
    });
    tabPanel.items.get(0).update(HomeScreen, true);
}
});

У вас есть какие-нибудь решения?

Привет, Мартин


person Martin Bories    schedule 05.10.2011    source источник


Ответы (1)


Я думаю, проблема здесь может быть в том, что метод update () ожидает строку HTML, а HomeScreen - это Ext.Panel.

Если бы это был я, я бы добавил HomeScreen в коллекцию элементов в tabPanel либо с помощью такой переменной:

    items: [
         HomePanel                              
    ]

Или определив его внутри массива items как объект:

items: [{
    xtype: "panel",
    html: "Hello world",
    dockedItems: [{
        // You toolbar definition
    }]
}]

Или с помощью метода TabPanel.add ():

tabPanel.add(HomePanel);
person dougajmcdonald    schedule 05.10.2011
comment
Спасибо, что сделали это: D. Но мне нужно сделать: items: [HomePanel] - person Martin Bories; 05.10.2011
comment
И метод update () - не кроме строки HTML, Ext.Panel работает хорошо;) - person Martin Bories; 05.10.2011