QML 如何动态更改 TextArea 的颜色？

Question

这是我的测试APP的代码:

TextAreaStyle{
    id: loggerStyle
    textColor: "#00ff88";
    backgroundColor: "#000000";
}

TextArea {
    id: taLog
    readOnly: true
    width: parent.width
    height: parent.height - labelTitle.height - btnTest.height - 2*v_AIR
    x: 0
    y: labelTitle.height + v_AIR
    style: loggerStyle
    font.family: "Helvetica";
    font.pointSize: 16;
    font.bold: true
    function logError(msg){
        loggerStyle.textColor = "#FF0000"
        taLog.text = taLog.text + "\n" + msg
    }
    function logMessage(msg){
        loggerStyle.textColor = "#FFFFFF"
        taLog.text = taLog.text + "\n" + msg
    }
    function logSuccess(msg){
        loggerStyle.textColor = "#00FF00"
        taLog.text = taLog.text + "\n" + msg
    }
}

当我尝试运行这段代码时，我收到了所有这些消息:

file:///opt/Qt5.7.0/5.7/gcc_64/qml/QtQuick/Controls/Private/Style.qml:52: ReferenceError: __control is not defined
file:///opt/Qt5.7.0/5.7/gcc_64/qml/QtQuick/Controls/Styles/Base/ScrollViewStyle.qml:56: ReferenceError: __control is not defined
file:///opt/Qt5.7.0/5.7/gcc_64/qml/QtQuick/Controls/Styles/Base/TextAreaStyle.qml:80: TypeError: Cannot read property 'enabled' of null
file:///opt/Qt5.7.0/5.7/gcc_64/qml/QtQuick/Controls/Styles/Base/TextAreaStyle.qml:77: TypeError: Cannot read property 'enabled' of null
file:///opt/Qt5.7.0/5.7/gcc_64/qml/QtQuick/Controls/Styles/Base/TextAreaStyle.qml:68: ReferenceError: __control is not defined
file:///opt/Qt5.7.0/5.7/gcc_64/qml/QtQuick/Controls/ScrollView.qml:354: TypeError: Cannot read property 'padding' of null
file:///opt/Qt5.7.0/5.7/gcc_64/qml/QtQuick/Controls/ScrollView.qml:353: TypeError: Cannot read property 'padding' of null
file:///opt/Qt5.7.0/5.7/gcc_64/qml/QtQuick/Controls/ScrollView.qml:352: TypeError: Cannot read property 'padding' of null
file:///opt/Qt5.7.0/5.7/gcc_64/qml/QtQuick/Controls/ScrollView.qml:351: TypeError: Cannot read property 'padding' of null
file:///opt/Qt5.7.0/5.7/gcc_64/qml/QtQuick/Controls/TextArea.qml:906: TypeError: Cannot read property '__selectionHandle' of null
file:///opt/Qt5.7.0/5.7/gcc_64/qml/QtQuick/Controls/TextArea.qml:942: TypeError: Cannot read property '__cursorHandle' of null

而且我的文本区域没有应用任何样式。

那么动态更改用于将消息写入 TextArea 的颜色的正确方法是什么？

Answer 1

我已经设法用这段代码做了我想做的事:

TextArea {
    id: taLog
    readOnly: true
    width: parent.width
    height: parent.height - labelTitle.height - btnTest.height - 2*v_AIR
    textFormat: TextEdit.RichText
    x: 0
    y: labelTitle.height + v_AIR
    style: TextAreaStyle{
        backgroundColor: "#000000";
    }
    font.family: "Helvetica";
    font.pointSize: 16;
    font.bold: true
    function logError(msg){
        logNew(msg,"#FF0000");
    }
    function logMessage(msg){
        logNew(msg,"#FFFFFF");
    }
    function logSuccess(msg){
        logNew(msg,"#00FF00");
    }
    function logNew(msg, color){
        msg = "<p style='color: " + color +  ";' >" + msg + "</p>"
        taLog.text = taLog.text + msg
    }
}

我基本上告诉它文本将是 HTML，并且不同的消息有不同的颜色。