2012-03-31 9 views
1

Sencha Touch 2 MVC를 사용하기 시작했지만 아래의 문제를 해결할 수 없습니다.Sencha Touch 2 - 스위치보기

Ext.application({ 
    name: 'ProjectName', 
    appFolder: APP_URL + "app", 
    enableQuickTips: true, 
    extend: 'Ext.app.Controller', 
    phoneStartupScreen: 'LOGO.png', 

    controllers: ['Site'], 

    views: ['Viewport_login', 'Viewport_reg'], 
    layout: 'vbox', 



    launch: function() { 
     //bootstrap 

     Ext.create("Ext.Container", { 
      requires: [ 

      ], 
      items: [ 
       Ext.create("ProjectName.view.Viewport_login", {}), 
       Ext.create("ProjectName.view.Viewport_reg", {}) 

      ] 
     }); 


     return true; 

    } 

}); 

보기 'Viewport_login'코드 :

Ext.define('ProjectName.view.Viewport_login', { 
    extend: 'Ext.Panel', 

    requires: [ 
     'ProjectName.view.Login', 
     'ProjectName.view.Header' 
    ], 


    fullscreen: true, 

    initialize: function() { 
     console.log("init viewpor_login"); 
     Ext.create("Ext.Container", { 
      //fullscreen: true, 
      style: 'background-color: white;', 
      layout: 'vbox', 
      fullscreen: true, 
      scrollable: true, 


      items: [ 
       { 
        xtype: 'Bheader' 
       },    
       Ext.create("widget.login") 
      ] 
     }); 

     this.callParent(); 
    } 

}); 

보기 'Viewpoer_reg'코드 :

Ext.define('ProjectName.view.Viewport_reg', { 
extend: 'Ext.Panel', 

requires: [ 
    'ProjectName.view.Reg', 
    'ProjectName.view.Header' 
], 


fullscreen: true, 

initialize: function() { 
    console.log("init viewpor_reg"); 
    Ext.create("Ext.Container", { 
     //fullscreen: true, 
     style: 'background-color: white;', 
     layout: 'vbox', 
     fullscreen: true, 
     scrollable: true, 


     items: [ 
      { 
       xtype: 'Bheader' 
      }, 
      Ext.create("widget.reg") 
     ] 
    }); 

    this.callParent(); 
} 

}); 

보기 '헤더'코드 :

가 나는 Ext.application 코드가
Ext.define('ProjectName.view.Header', { 
extend: 'Ext.Panel', 
alias: 'Bheader', 
xtype: 'Bheader', 

requires: [ 
    'Ext.Img' 
], 

initialize: function() { 
    console.log("header inited"); 
}, 

config: { 
    cls: 'bg-holder', 
    items: [ 
     Ext.create("Ext.Img", { 
      src: BASE_URL + 'assets/images/header3.png', 
      height: 35, 
      width: "100%", 
      style: "background-position: center 0px; " 
     }) 
    ] 
} 
}); 

마지막으로 '사이트'컨트롤러의 코드 :

Ext.define('ProjectName.controller.Site', { 
extend: 'Ext.app.Controller', 


config: { 
    views: ['Viewport_login', 'Viewport_reg'] 

}, 


init: function() { 
    console.log('Init site controller'); 
    // Start listening for events on views 


    this.control({ 
     // example of listening to *all* button taps 
     '#login_button': {   
      tap: function() { 

       // HOW CAN I SWITCH TO 'VIEWPORT_REG' VIEW? 
      } 
     }   
    }); 

}, 

renderRegFOrm: function() { 

}, 

onLaunch: function() { 
    console.log('onLaunch site controller'); 
}, 
}); 

첫째, 지금 문제가 다음 '헤더'does'nt 나는 두보기로드하는 경우 표시 ('Viewport_login을', 'Viewport_reg') 컨테이너에있는 Ext.application 시작 기능에서 생성되었습니다. 누가 도와 줄 수 있니, 왜?

둘째, 당신은 this.control를 (볼 수있는 컨트롤러 코드에서 ... 섹션. 어떻게 내가 여기에 다른보기로 전환 할 수 있습니까?

답변

1

코드보고에서, 당신이 하나를 원하는 것으로 보인다 로그인 및 등록은 한 번에 나타납니다.이 방법으로 컨테이너에 대한 setActiveItem 방법을 살펴보고 권장보기를 사용하는 것이 좋습니다.

나는 첫 번째 질문을 이해하지 못했지만 widget.loginloginreg이라는보기가 이미있는 경우 widget.reg 클래스를 사용할 수 있습니다 (그냥 사용할 수 없습니까?)