Question

我为此广泛搜索，但我似乎没有找到任何关于如何做到这一点的线索。 sencha在其厨房水槽中做得非常整齐如下：

导航栏停靠在左侧
工具栏停靠在顶部，显示视图的标题。

我似乎无法弄清楚如何做到这一点，即使是通过厨房水槽的源代码吐痰。我确实找到了一些关于如何做的痕迹，但这并不完整。

showViewById: function(id) {
    var nav = this.getNav(),
        view = nav.getStore().getNodeById(id);

    this.showView(view);
    this.setCurrentDemo(view);
    this.hideSheets();
},

这几乎不是全部。

对于如何创建这种类型的布局的某种教程，你能满足我吗？或者进一步帮助我？

Answer 1

查看Main.js文件（Kitchensink.view.tablet.Main）。这个类基本上创建了你正在谈论的布局..它是直截了当的：

items: [
    {       // This is the content area... 
        id: 'launchscreen',
        cls : 'card',
        scrollable: true,
        html: 'Home page content'
    },
    { 
        // The left navigation
        id: 'mainNestedList',
        xtype : 'nestedlist',
        useTitleAsBackText: false,
        docked: 'left',
        width : 250,
        store: 'Demos'
    },
    {
        // The top toolbar
        id: 'mainNavigationBar',
        xtype : 'titlebar',
        docked: 'top',
        title : 'Kitchen Sink',
        items: {
            xtype : 'button',
            id: 'viewSourceButton',
            hidden: true,
            align : 'right',
            ui    : 'action',
            action: 'viewSource',
            text  : 'Source'
        }
    }
]

这应该可以帮助您入门。

Sencha Touch 2厨房水槽就像导航一样

1 个答案: