2013-05-03 93 views
0

我正在創建一個應用程序,在其中創建像sencha touch theming expample這樣的彈出窗口來選擇導航項目。sencha touch如何通過sencha touch觸摸主題示例進行導航

enter image description here

我想看到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) 
}, 
}); 

`

當我嘗試點擊列表按鈕頂部的錯誤我在控制檯中看到的是這樣的

Uncaught TypeError: Object [object Object] has no method 'getStyleBubble'

而且我沒有看到任何定義這個'getStyleBubble'函數在模型,視圖,控制器,商店目錄中的任何文件中。所以它在任何觸摸目錄文件中定義,或者我缺少一些東西。

+0

https://github.com/senchalearn/Touch-Theming/blob/master/app/controller/Main.js,並在控制器的裁判尋找styleBubble配置對象 – 2013-05-03 09:21:53

+0

這是如何控制器的引用工作http://docs.sencha.com/touch/2.1.1/#!/api/Ext.app.Controller-cfg-refs – 2013-05-03 09:22:27

回答

0

控制器文件中沒有getStyleBubble()函數減速也沒有在任何文件中,如果你下載整個源代碼zip文件夾我認爲他們沒有上傳完整的源代碼。但我找到了答案。我必須創建一個新面板,並通過點擊列表按鈕來切換。

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); 

`

enter image description here

+0

這是很好的標記自己的答案被接受,如果你找到解決方案:) – SachinGutte 2013-05-03 17:58:44