sencha-touch - 煎茶触摸中的“大师”观

Question

我想为我的 SenchaTouch2 应用程序创建 Master/Base 视图。它应该有页眉、页脚和内容区域。页眉和页脚是静态的，但内容应在具体视图中声明。我在 sencha docs 中找不到我的问题的解决方案。也许这是一个错误的方式？任何指向煎茶指南的链接都会有所帮助。

Answer 1

对于这种类型的功能，您可以使用导航视图或使用卡片布局创建任何一个视图，并放置两个您想要修复的顶部和底部停靠的项目，并根据需要更改第三个项目。

Answer 2

您应该创建一个从 Container 或 Panel 扩展的视图，其中包含 3 个项目。您决定哪个 xtype（面板、容器、工具栏等）是您的页眉和页脚，您应该使用卡片布局并停靠在顶部或按钮：停靠：'top' 然后您可以使用第三个元素并更新视图根据您的需要并根据需要使用模型和控制器。

Answer 3

使用页眉和页脚容器定义一个新的 Ext.Container 类。然后创建它的新实例并插入内容视图。像这样的东西：

Ext.define('App.view.BaseView', {
    extend : 'Ext.Container',
    xtype : 'masterview',
    config : {
         items : [{
         xtype : 'container',
         height : 100,
         html : 'This is header',
         styleHtmlContent : true,
         // docked : 'top'      //if needed
       }, {
         xtype : 'container',
         height : 100,
         html : 'This is footer',
         styleHtmlContent : true,
         // docked : 'bottom'      //if needed
       }]
    }
});

并像这样使用它：

var panel = Ext.create('App.view.BaseView');
panel.insert(1, {
    xtype : 'container',
    html : 'This is concrete view'
});

这是最基本的例子。你可以按照你想要的方式调整它。