How to create a striped Ext.Dataview

Question

Ext.dataview.Dataview unlike Ext.dataview.List does not have a striped attribute.
Is there a straightforward way of simulating that?

I've tried using itemTpl in my DataView, but no luck.

itemTpl: '<tpl for=".">' + 
             '<div class="{[xindex % 2 === 0 ? "even" : "odd"]}"></div>' + 
         '</tpl>'

Maybe my "for clause" is wrong. Maybe I shouldn't be iterating through the root node...

So is that ExtJS or Sencha Touch? If ExtJS, which version? – Greendrake Jul 03 '15 at 02:03 — Greendrake, Jul 03 '15 at 02:03
My mistake - it's Sencha Touch 2.4.1. I'll remove the tag. – pushkin Jul 03 '15 at 02:07 — pushkin, Jul 03 '15 at 02:07

score 1 · Answer 1 · edited Aug 22 '15 at 19:06

1

If you are using the itemTpl in the DataView the xindex value will be always one. Since it will create the xtemplate for each dataview item.

You can try using the css:

dataviewItemCls:nth-child(even) {background: #CCC}
dataviewItemCls:nth-child(odd) {background: #FFF}

edited Aug 22 '15 at 19:06

Qiu

answered Aug 22 '15 at 18:13

Sandeep Ranga

1 Answers1