How to change the font size and color of list items in sencha touch
14,520
Solution 1
You need to add a cls
attributes to your list like :
cls:'myList'
and then add this in your CSS File :
.myList .x-list-item:nth-child(1),
.myList .x-list-item:nth-child(2) {
color: #CCC;
font-size:14px;
}
Hope this helps
Solution 2
you can set font and color in itemTpl
itself.
itemTpl: '<table><td><tr height=10%><font size="12" color="#990000">{BlockNo}</font></tr>
<tr height=90%><p><font size="8" color="#990000">{ShortDescription}</font></p></tr></td>
</table>'
Author by
mahesh
Updated on June 05, 2022Comments
-
mahesh almost 2 years
I have an sample application where i am binding the store data to the list using itemtpl, I have little confusion on how to change the color and size of first two list items when i am dynamically binding data to list from store.
This my sample code :
Ext.define('Sample.view.SearchResultView', { extend: 'Ext.Panel', requires: [ 'Ext.List', 'Ext.form.FieldSet', 'Ext.field.Text', 'Ext.Toolbar', 'Ext.TitleBar' ], alias: "widget.searchresultpage", config: { scrollable: true, items: [ { xtype: 'list', layout:'fit', height:500, title: 'Search Results', store: 'MySearchStore', itemTpl: '<table><td><tr height=10%>{BlockNo}</tr><tr height=90%><p>{ShortDescription}</p></tr></td></table>' ) } ] }, });