패널에 sencha touch 2가 표시되지 않습니다.

Question

툴바에서 '로그인'을 탭하면 패널을 전환하려고합니다. 내 컨트롤러가 이벤트를 가져오고 내가 원하는 패널에 활성 항목을 추가하고 설정하여 전환합니다. 그러나 화면이 공백으로 유지되고 디버그 오류가 없습니다.

이것은 내 패널의 코드입니다. 실수는 무엇일까요?

Ext.define('App.view.LoginView', { 
extend: 'Ext.Panel', 
xtype: 'loginpanel', 
alias: 'widget.loginView', 

fullscreen: true, 
layout: 'fit', 

items: [ 
    { 
     xtype: 'TopToolBar' 
    }, 
    { 
      xtype: 'formpanel', 
      items: [ 
      { 
       xtype: 'fieldset', 
       title: 'Login', 
       instructions: 'Have a great day!', 
       items: [ 
        { 
         xtype: 'emailfield', 
         name: 'email', 
         label: 'Email' 
        }, 

        { 
         xtype: 'passwordfield', 
         name: 'password', 
         label: 'Password' 
        } 
       ] 
      }, 

      { 
       xtype: 'button', 
       text: 'Login', 
       ui: 'confirm', 
       handler: function() 
       { 
        this.up('loginpanel').submit(); 
       } 
      } 
     ] 
    }]}) 

내 도구 모음 클래스의 코드는 :

Ext.define('App.view.TopToolBar', { 
extend: 'Ext.Toolbar', 
xtype: 'TopToolBar', 
dock: 'top', 
initialize: function() { 
    var loginButton = { 
     xtype: 'button', 
     text: 'Login', 
     ui: 'action', 
     handler: this.onLoginTap, 
     scope: this 
    }; 

    this.add(loginButton); 
}, 

onLoginTap: function(){ 
    console.log('login tap'); 
    this.fireEvent('loginBtnHandler', this); 
}}) 

Answer 1

는 Ext.define으로 클래스를 정의합니다.

Ext.define('My.Toolbar', { 
    extend: 'Ext.Toolbar', 
    alias: 'widget.mytoolbar' 
    //configuration 
}); 

가와 생성 (인스턴스화) 클래스 Ext.create

var tlb= Ext.create('My.Toolbar', { 
    //configuration 
}); 

화면이 공백 않습니다