0

我正在创建一个应用程序，我必须在其中创建像sencha touch 主题示例这样的弹出窗口来选择导航项。

在此处输入图像描述

我试图在github上查看它的代码以获得提示，但不知道我缺少的是我的标题栏和列表按钮的代码。

Ext.define('ov_app.view.HeaderBar', {
xtype : 'HeaderBar',
extend:'Ext.Toolbar',

config: {
           // xtype : 'toolbar',
    ui: 'plain',        
    docked: 'top',
    cls: 'menuBar',
    border:0,
    defaults:{
        border: 0,
        },
    items: [

        {
            iconCls: 'list',
            iconMask: true,
            ui: 'plain',
            action: 'ShowMoreOption',
        },{
            xtype: 'spacer'
        },{
            xtype: 'container',
            html: '<img src="resources/images/logo.png">'
        },{
            xtype: 'spacer'
        },{
            iconCls: 'home',
            iconMask: true,
            id: 'homeBtn',
            ui: 'plain',
            action: 'push-view'
        }
    ]
}
});

`

和我的控制器 main.js 的代码来处理列表按钮上的选项卡操作。

Ext.define('ov_app.controller.MainController', {
extend: 'Ext.app.Controller',
config:{
    control: {
        'button[action=push-view]': {
            tap: 'pushViewFunction'
       },
         'button[action=ShowMoreOption]':{
    tap: 'togglMenu'
    },
    },
},

pushViewFunction: function() {
ov_app.container.setActiveItem(0);
},
togglMenu: function(){
console.log("hello");
}
togglMenu: function(button) {
    this.getStyleBubble().showBy(button)
},
});

`

当我尝试单击顶部的列表按钮时，我在控制台中看到的错误是这样的

未捕获的类型错误：对象 [object Object] 没有方法“getStyleBubble”

而且我在模型、视图、控制器、存储目录的任何文件中都没有看到这个“getStyleBubble”函数的任何定义。它是在任何触摸目录文件中定义的，还是我遗漏了一些东西。

4

1 回答 1

0

如果您下载整个源代码 zip 文件夹，控制器文件中也没有 getStyleBubble() 函数减速，我认为他们没有上传完整的源代码。但我找到了答案的解决方案。我必须创建一个新面板并通过单击这样的列表按钮使其切换。

 togglMenu: function(button){
    if(!this.overlay) {
    this.overlay = Ext.Viewport.add({
        xtype: 'panel',
        modal: true,
        hideOnMaskTap: true,
        showAnimation: {
            type: 'popIn',
            duration: 250,
            easing: 'ease-out'
        },
        hideAnimation: {
            type: 'popOut',
            duration: 250,
            easing: 'ease-out'
        },
        height: 200,
        width: 200,
        //centered: true,
        styleHtmlContent: true,
        html: '<p>hello dummy content in the pop up box </p>',
        scrollable: true
    });
}
this.overlay.showBy(button);

`

在此处输入图像描述

于 2013-05-03T09:53:10.337 回答