Sencha Touch: Change text color of a component

Question

I have a simple View (Container) containing a component. Content is added to this component using Ext.getCmp('foo').setHtml('bar');

I want now to change the text color of the component "foo". Using the style-property works fine, but only as long as styleHtmlContent is set to false.

How can I change the text color but still setting styleHtmlContent to true?

Answer 1

Setting the property styleHtmlCls to <myClass> on the specific component was the trick! Doing so I was able to create an custom css file which contains <myClass> where the custom color is specified...

Answer 2

You can use the Ext.Component#addCls(String) method to add some CSS class to your component.

Once you bar class is declared in your css file with your text styling, just do :

Ext.getCmp('foo').addCls('bar');

That way, you will simply add some css styling to your component and not override them.

Link to documentation : http://docs.sencha.com/touch/2.3.2/#!/api/Ext.Component-method-addCls