Question

我试图在我的应用程序中将视图显示为“模态”。主应用程序是一个选项卡面板，当用户执行某个操作时，我想在此tabpanel上弹出一个视图。我知道在原生iOS上你可以通过将视图作为一个模态来实现，但我如何在Sencha中做到这一点？

有什么想法吗？

Answer 1

你可以这样做：

Ext.define('MyApp.controller.MyController4', {
    extend: 'Ext.app.Controller',

    config: {
        control: {
            "button#mybutton": {
                tap: 'onMybuttonTap'
            }
        }
    },

    onMybuttonTap: function(button, e, options) {
        Ext.Viewport.add({xtype:'modalpanel'});
    }
});

查看：

Ext.define('MyApp.view.ModaPanel', {
extend: 'Ext.Panel',
alias: 'widget.modalpanel',

config: {
    centered: true,
    height: 300,
    html: 'Cool Story Bro....',
    itemId: 'modalPanel',
    width: 300,
    hideOnMaskTap: true,
    modal: true,
    scrollable: true,
    hideAnimation: {
        type: 'popOut',
        duration: 200,
        easing: 'ease-out'
    },
    showAnimation: {
        type: 'popIn',
        duration: 200,
        easing: 'ease-out'
    },
    items: [
        {
            xtype: 'toolbar',
            docked: 'top',
            title: 'Blah Blah'
        }
    ]
}

});

Ext.define('MyApp.view.MyTabPanel', {
extend: 'Ext.tab.Panel',

config: {
    items: [
        {
            xtype: 'container',
            title: 'Tab 1',
            items: [
                {
                    xtype: 'button',
                    itemId: 'mybutton',
                    text: 'MyButton10'
                }
            ]
        },
        {
            xtype: 'container',
            title: 'Tab 2'
        },
        {
            xtype: 'container',
            title: 'Tab 3'
        }
    ]
}

});

修改如果这不是您想要的，那么您可能正在寻找actionsheet。有关不同类型的叠加层，请参阅Sencha Touch Kitchensink。

在sencha touch 2中的模态视图

1 个答案: