Sencha Touch V2에서 MVC보기를 올바르게 활성화하는 방법

저는 Sencha Touch V2 베타를 실행 중이며 가장 많이보고있는 것은 recent documentation입니다.Sencha Touch V2에서 MVC보기를 올바르게 활성화하는 방법

나는 Ext.application 지침을 따라 왔으며 내 MVC 응용 프로그램을 올바르게 배치하려고합니다. 불행히도 실제로이 접근법으로 뷰를로드하는 방법을 알 수는 없습니다.

하는 index.js

Ext.application({ 

    name: 'rpc', 
    defaultUrl: 'home/index', 
    controllers: ['home'], //note: define controllers here 
    launch: function() { 

     console.log('Ext.application ~ launch'), 

     Ext.create('Ext.TabPanel', { 
      id: 'rpc-rootPanel', 
      fullscreen: true, 
      tabBarPosition: 'bottom', 
      items: [{ 
       title: 'Home', 
       iconCls: 'home' 
      }] 
     }); 

     Ext.create('Ext.viewport.Viewport', { 
      id:'rpc-rootPanel', 
      fullscreen: true, 
      layout: 'card', 
      cardSwitchAnimation: 'slide' 
     }); 

    } 
});

homeController.js

Ext.define('rpc.controller.home', { 
    extend: 'Ext.app.Controller', 
    views: ['home.index'], 
    stores: [], 
    refs: [], 
    init: function() { 
     console.log('rpc.controller.home ~ init'); 
    }, 

    index: function() { 
     console.log('rpc.controller.home ~ index'); 
    } 
});

indexView.js

Ext.define('rpc.view.home.index', { 
    extend: 'Ext.Panel', 
    id: 'rpc-view-home-index', 
    config: { 
     fullscreen: true, 
     layout: 'vbox', 
     items: [{ 
      xtype: 'button', 
      text: 'Videos', 
      handler: function() { 
      } 
     }], 
     html:'test' 
    } 
});

당신이 ㄱ 있습니다 어떤 도움 전자 제공 할 수 크게 감사하겠습니다. ,

Folder structure for Sencha Touch 2 application

응용 프로그램의 개발 과정 :

출처

2011-10-19 Chase Florell

새로운 릴리스는 센차 터치 같은 arch.Here 내 폴더 구조 다음되기 때문에 당신은 Architecture guide을 읽어야는 ExtJS 4에서 도입 MVC 개념을 다음과 html로 sencha-touch-all-debug-w-comments.js를 사용해야합니다. 이렇게하면 응용 프로그램을 디버깅하는 데 도움이됩니다. 내가 별칭 ('홈페이지'위해 xtype)를 사용하여 홈 페이지 뷰를 포함 얼마나,

Ext.Loader.setConfig({enabled: true}); 
Ext.application({ 
    name: 'rpc', 
    appFolder: 'app',   
    controllers: ['Home'], 
    launch: function() { 

     Ext.create('Ext.tab.Panel',{ 
      fullscreen: true,   
      tabBarPosition: 'bottom', 
      items:[{ 
       title: 'Home', 
       iconCls: 'home', 
       html: '<img src="http://staging.sencha.com/img/sencha.png" />' 
      },{ 
       title: 'Compose', 
       iconCls: 'compose', 
       xtype: 'homepage' 
      }]   
     });  
    } 
});

참고 : 여기에

응용 프로그램 클래스입니다.

Ext.define('rpc.controller.Home', { 
    extend: 'Ext.app.Controller', 
    views: ['home.HomePage'], 
    init: function() {  

     console.log('Home controller init method...'); 
    }  
});

그리고 마지막으로, 내 홈페이지보기 :

Ext.define('rpc.view.home.HomePage', { 
    extend: 'Ext.Panel',  
    alias: 'widget.homepage', 
    config: {    
     html: '<img src="http://staging.sencha.com/img/sencha.png" />' 
    }, 
    initialize: function() { 
     console.log("InitComponent for homepage");  
     this.callParent(); 
    }  
});

별칭 속성이 필요할 때 클래스의 인스턴스를 인스턴스화하는 데 사용됩니다 여기에

는 컨트롤러입니다. Ext.create 메서드를 사용할 수도 있습니다.

Sencha Touch를 시작하는 데 도움이되기를 바랍니다.

출처

2011-10-19 11:57:45

이 좋은, 별명 비트처럼 보인다는 ... 내가 옳은 일 오전 않았다입니까? –

'위젯'이 무엇을 의미하는지 설명 할 수 있습니까? –

hava이 질문을보십시오 : http://stackoverflow.com/q/7376969/185655 –

위대한 답변 Abdel. 이 답변에서 입증 된 바와 같이

또한 그것은, 프로파일 불구하고 수행 할 수 있습니다 Sencha Touch 2.0 MVC tutorial

출처

2012-02-12 07:51:06 Grgur

Sencha Touch V2에서 MVC보기를 올바르게 활성화하는 방법

답변

관련 문제