[Solved] Is it possible to colorize only a part of a string in QML?

[p3c0]

AFAIK, the closest thing to do it in pure QML only is to use the HTML tags.
For e.g
@
Text {
anchors.centerIn: parent
font.pointSize: 18.0
text: "<b>T</b>h<b>i</b>s i<i>s</i> a <font color='red'>T</font>es<font color='green'>T</font>"
}
@

[skammers]

Thanks! Thats perfect! :)

[skammers]

What if I wanted to do it from C++?=)

[clochydd]

Hi, it's (nearly) the same:

@
ui->label->setText("<b>T</b>h<b>i</b>s i<i>s</i> a <font color='red'>T</font>es<font color='green'>T</font>");
@

[skammers]

I have a QString which I want to be in the text field, in different styles.

So I have:

@
QString text = "<b>Test</b>";
@

but in the TextField in QML, it displays <b>Test</b> instead of
"Test" in bold style. How can I change that?

[clochydd]

How do you transform the QString text to QML?

[skammers]

@
Q_PROPERTY(QString test READ test NOTIFY testChanged)
@

[p3c0]

Create you own QML component by subclassing the "QQuickPaintedItem":http://qt-project.org/doc/qt-5/qquickpainteditem.html and override paint() method and draw the text with the styles as per your need. Check "QPainter":http://qt-project.org/doc/qt-4.8/qpainter.html api's. You will need "setPen":http://qt-project.org/doc/qt-4.8/qpainter.html#setPen to change the font color or its style according to your need.

[p3c0]

Also,

bq. but in the TextField in QML, it displays <b>Test</b> instead of
“Test” in bold style. How can I change that?

TextField doesnot have ability to display Rich Texts. Use TextArea instead,
@
TextArea {
width: 240
text: "<b>T</b>h<b>i</b>s i<i>s</i> a <font color='red'>T</font>es<font color='green'>T</font>"
textFormat: TextEdit.RichText
}
@

[skammers]

Thank you! Now I really got it to work.