Sencha滑动导航菜单 - 脸谱风格 - 添加一个面板,其中两个子面板作为单独的xtype

时间:2014-05-27 02:49:26

标签: extjs sencha-touch

我下载了最新版本的https://github.com/wnielson/sencha-SlideNavigation,在view / Main.js中,对于Item1 / Group 1项,添加了工具栏+2个面板,而不是工具栏+ 1个面板,代码工作正常:< / p>

{
    title : 'Item1',
    group : 'Group 1',

    xtype : 'container',

    // Enable the slide button using the
    // defaults defined above in
    // `slideButtonDefaults`.
    slideButton : true,
    layout: 'vbox',

    items : [
                {
                    xtype : 'toolbar',
                    title : 'Item 1',
                    docked : 'top'
                },
                {
                    xtype : 'panel',
                    style: 'background: red',
                    html: 'New1',
                    flex: 1,

                    // Mask this item when the
                    // container is opened
                    maskOnOpen : true
                },
                {
                    xtype : 'panel',
                    style: 'background: green',
                    html: 'New2',
                    flex: 2,

                    // Mask this item when the
                    // container is opened
                    maskOnOpen : true
                } 

            ]
},

代码工作正常 - 它用一个面板替换你演示中的图像,该面板有两个垂直放置的红色和绿色子面板 1

我正在尝试将代码重构为单独的视图

Ext.define('Volt.view.FeedView', {
    extend: 'Ext.Panel',

    requires: [
        'Ext.TitleBar',
        'Ext.Button',
        'Ext.Toolbar',
        //'Ext.Panel'
    ],

    xtype: 'feedViewCard',


    config: {

        iconCls: 'action',
        title: 'FeedView',

        layout: 
        {
            type: 'vbox'
        },

        items : [
                    {
                        xtype : 'toolbar',
                        title : 'FeedView',
                        docked : 'top'
                    },
                    {
                        xtype : 'container',
                        style: 'background: red',
                        html: 'New1',

                        flex: 1

                        // Mask this item when the
                        // container is opened
                        //maskOnOpen : true
                    },
                    {
                        xtype : 'container',
                        style: 'background: green',
                        html: 'New2',
                        flex: 1

                        // Mask this item when the
                        // container is opened
                        //maskOnOpen : true
                    } 

                ]
    }
});

并在view / Main.js中使用以下代码,删除前面的代码 - 没有错误,但只显示绿框

 { 
     xtype: 'feedViewCard',
     title : 'Home Page',
     group : 'Group 1',
     slideButton : true

 },

2

此外,这个重构的FeedView.js在TabPanel视图中使用时显示为两个子面板 - 所以它肯定正常工作。有什么建议?非常感谢

0 个答案:

没有答案