1

Sencha Touch で異なる色のリスト ビューを実装しました。

また、ビューをコンテナーにプッシュするアイテム タップ メソッドを実装しました。

RedPage.js、WhitePage.js、yelloPage.js、GreenPage.js の 4 色ごとに 4 つのビューを実装しました。

意見:

{
           xtype: 'list',
           id : 'ColorsList'
           width: '20%',

           itemTpl: [
                 '<div><b>{Color}<b></div>'
                 ],


       data: [
              {Color: 'Red' },
              {Color: 'Blue'},
              {Color: 'Yellow},
              {Color: 'Green}
              ]
       },

容器:

ColorsList: '#ColorsList',

init function(){
..
..
..
..
  'ColorsList' : {
                     itemtap : 'ColorsPagesSelected'
                     },

...
...
...
},

ColorsPagesSelectedメソッド:

 ColorsPagesSelected: function() {

           alert('Color page pushed');

           this.getColorrightnavigation().push(Ext.create('ArtGalleryApp.view.RedPage'));


           },    

私はColorslist id を使用し、リストに RedPage をプッシュしていたので、リスト内の各項目にRedPageが表示されます。

行ごとに異なるページを取得する方法がわかりません

誰でも私を助けることができますか?

4

2 に答える 2

1

次のように色付きのページを定義したと仮定します。

Ext.define('App.view.RedPage', {
    extend: 'Ext.Panel',
    xtype: 'RedPage',
...
});

便利なExt.widget関数を使用する

ColorsPagesSelected: function(ct, index, target, record) {

    alert('Color page pushed');
    var color = record.get('Color'),
        pageName = color + 'Page',
        page = Ext.widget(pageName);

    this.getColorrightnavigation().push(page);

}
于 2012-08-03T06:58:45.887 に答える
-1

これに対する私のお気に入りのハックは、関数をレコードに割り当てることです

{
  xtype: 'list',
  id: 'ColorsList'
  width: '20%',
  itemTpl: ['<div><b>{Color}<b></div>'],


  data: [{
    Color: 'Red',
    getPage: function() {
      return Ext.create('ArtGalleryApp.view.RedPage');
    }
  }, {
    Color: 'Blue'
  }, {
    Color: 'Yellow},
              {Color: '
    Green
  }]
},

init function(){
  'ColorsList' : {
     itemtap : 'ColorsPagesSelected'
   },   
 ColorsPagesSelected: function(ct, index, target, record) {
    alert('Color page pushed');
    this.getColorrightnavigation().push(record.getPage());
  }    
于 2012-08-03T15:37:33.627 に答える