extjs - ExtJsのグリッドの行の色を変更する

Question

最初の5行の背景色またはテキストの色を次の5行とは異なるものにする方法。たとえば、最初の5イエロー、5オレンジ、5イエロー、5オレンジなどです。

グリッドに次のリスナーを追加しました

listeners: {
    viewready: function(g) {
        g.getView().getRow(1).style.color="#f30";
    }
} 

これを使って2行目の内容を赤で表示しましたが、うまくいきません。

Answer 1

カスタムGridViewgetRowClassメソッドを使用できます。

var mygrid = new Ext.grid.GridPanel({
   viewConfig: {
      getRowClass: function(record, index, rowParams)
      {
         return (Math.floor(index / 5.0) % 2 == 0) ? 'rowClass1' : 'rowClass2';
      }
   }
})

次に、ページまたはcssでカスタム行スタイルクラスを定義します。

Answer 2

これが必要ですhttp://docs.sencha.com/ext-js/4-0/#!/api/Ext.grid.column.Column-cfg-renderer

例

ExtJS 4-グリッドの列に背景色を追加するにはどうすればよいですか？