Sencha touch 2.0 개발

클래스 정의 관련

view 정의

• 센차의 클래스를 상속받아서 정의함.
• xtype 을 따로 정의하여, 이것을 다른 클래스에서 아이템으로 사용할 수 있음.
• config 에는 센차의 정의된 클래스의 config을 사용하여 기존에 작업했던 대로 정의함.
• 이때 이벤트 핸들러는 여기에 정의하지 않는다. → 컨트롤러에서 정의하여 처리함.

controller 정의

• 센차의 Ext.app.Controller 클래스를 상속받아서 정의함.
• 사용할 views, stores 를 배열로 정의함.
• refs 는 셀렉터와 ref 로 구성되며, 셀렉터는 뷰 클래스의 xtype 을 사용하거나, 아이드를 사용할수있다.
  • 아이디를 사용할 경우에는 '#아이디' 식으로 사용함.
  • ref는 이 컨트롤러에서 사용할 레퍼런스이며, 자동으로 getter, setter 함수를 제공하게 된다.
• init 함수 에서 this.control 함수 사용 → 여기에 버튼등의 원하는 이벤트를 리스닝 하게 만들고, 해당 핸들러를 등록한다.
  • 하나의 객체에 여러 이벤트 등록할때에는, 'xtype' : {이벤트:함수, 이벤트:함수, … } 식으로 등록함.
• 이때 이벤트 핸들러는 여기에 정의하지 않는다. → 컨트롤러에서 정의하여 처리함.
• onLaunch 함수 : 컨트롤러가 런치 완료 되면 실행됨.

model 정의

• Ext.data.Model 클래스 상속받아서 정의함.
• 필드, 프록시등을 정의함.

store 정의

• 실제로 데이터를 담게 되는 클래스로서,
• Ext.data.Store 를 상속받아 정의함.
• requires 에 사용될 모델의 페키지명까지 적고,
• model 에 정의해줌.
• 인라인 데이터를 사용할 경우에는 data 필드를 만들고 여기에 정의를 해준다.

테스트 코드

• test2.zip

유용한 기능

• 리스트에서 스크롤을 맨 위로 올리기.
  • 리스트객체에서 스크롤러블을 구하고, 거기서 스크롤러 구한후 scrollTo함수 이용.
  • this.getCheckinCompanyList().getScrollable().getScroller().scrollTo(0,0);