QmlDesigner.propertyEditor: fixing color editing in Qt5

In Qt5 color does not implcitly get converted to string in QML.
Since this was never a documented feature we just adapt the
codein the property editor and convert color to string explictly if
needed.

Change-Id: I6b2b1dc356d2ec1c806c77450f49e793def2f5bb
Reviewed-by: Marco Bubke <marco.bubke@digia.com>

share/qtcreator/qmldesigner/propertyeditor/Qt/ColorGroupBox.qml

@@ -172,7 +172,7 @@ QExtGroupBox {
                 layout: HorizontalLayout {
                     spacing: 6
 
-                    LineEdit {
+                    ColorLineEdit {
                         inputMask: "\\#HHHHHH"
                         visible: gradientEditing == false
                         backendValue: colorGroupBox.backendColor
@@ -185,7 +185,12 @@ QExtGroupBox {
                         id: lineEditWidget;
                         QLineEdit {
                             y: 2
-                            text: color
+                            property color colorG: color
+                            onColorGChanged: {
+                                text = convertColorToString(color);
+                            }
+
+                            text: "#000000";
                             width: lineEditWidget.width
                             height: lineEditWidget.height
 

share/qtcreator/qmldesigner/propertyeditor/Qt/ColorLineEdit.qml

@@ -0,0 +1,161 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Digia Plc and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/legal
+**
+** This file is part of Qt Creator.
+**
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and Digia.  For licensing terms and
+** conditions see http://qt.digia.com/licensing.  For further information
+** use the contact form at http://qt.digia.com/contact-us.
+**
+** GNU Lesser General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU Lesser
+** General Public License version 2.1 as published by the Free Software
+** Foundation and appearing in the file LICENSE.LGPL included in the
+** packaging of this file.  Please review the following information to
+** ensure the GNU Lesser General Public License version 2.1 requirements
+** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html.
+**
+** In addition, as a special exception, Digia gives you certain additional
+** rights.  These rights are described in the Digia Qt LGPL Exception
+** version 1.1, included in the file LGPL_EXCEPTION.txt in this package.
+**
+****************************************************************************/
+
+import QtQuick 1.0
+import Bauhaus 1.0
+
+QWidget {
+    id: lineEdit
+
+    function escapeString(string) {
+        var str  = string;
+        str = str.replace(/\\/g, "\\\\");
+        str.replace(/\"/g, "\\\"");
+        str = str.replace(/\t/g, "\\t");
+        str = str.replace(/\r/g, "\\r");
+        str = str.replace(/\n/g, '\\n');
+        return str;
+    }
+
+    property variant backendValue
+    property alias enabled: lineEdit.enabled
+    property variant baseStateFlag
+    property alias text: lineEditWidget.text
+    property alias readOnly: lineEditWidget.readOnly
+    property alias translation: trCheckbox.visible
+    property alias inputMask: lineEditWidget.inputMask
+
+    minimumHeight: 24;
+
+    onBaseStateFlagChanged: {
+        evaluate();
+    }
+
+    property variant isEnabled: lineEdit.enabled
+    onIsEnabledChanged: {
+        evaluate();
+    }
+
+
+    property bool isInModel: backendValue.isInModel;
+    onIsInModelChanged: {
+        evaluate();
+    }
+    property bool isInSubState: backendValue.isInSubState;
+    onIsInSubStateChanged: {
+        evaluate();
+    }
+
+    function evaluate() {
+        if (!enabled) {
+            lineEditWidget.setStyleSheet("color: "+scheme.disabledColor);
+        } else {
+            if (baseStateFlag) {
+                if (backendValue != null && backendValue.isInModel)
+                    lineEditWidget.setStyleSheet("color: "+scheme.changedBaseColor);
+                else
+                    lineEditWidget.setStyleSheet("color: "+scheme.defaultColor);
+            } else {
+                if (backendValue != null && backendValue.isInSubState)
+                    lineEditWidget.setStyleSheet("color: "+scheme.changedStateColor);
+                else
+                    lineEditWidget.setStyleSheet("color: "+scheme.defaultColor);
+            }
+        }
+    }
+
+    ColorScheme { id:scheme; }
+
+    QLineEdit {
+        y: 2
+        id: lineEditWidget
+        styleSheet: "QLineEdit { padding-left: 32; }"
+        width: lineEdit.width
+        height: lineEdit.height
+        toolTip: backendValue.isBound ? backendValue.expression : ""
+
+        property string valueFromBackend: (backendValue === undefined || backendValue.value === undefined) ? "" : backendValue.valueToString;
+
+        onValueFromBackendChanged: {
+            if (backendValue.value === undefined)
+                return;
+            text = backendValue.valueToString;
+        }
+
+        onEditingFinished: {
+            if (backendValue.isTranslated) {
+                backendValue.expression = "qsTr(\"" + escapeString(text) + "\")"
+            } else {
+                backendValue.value = text
+            }
+            evaluate();
+        }
+
+        onFocusChanged: {
+            if (focus)
+                backendValue.lock();
+            else
+                backendValue.unlock();
+        }
+
+
+    }
+    ExtendedFunctionButton {
+        backendValue: lineEdit.backendValue
+        y: 6
+        x: 0
+        visible: lineEdit.enabled
+    }
+    QCheckBox {
+        id: trCheckbox
+        y: 2
+        styleSheetFile: "checkbox_tr.css";
+        toolTip: qsTr("Translate this string")
+        x: lineEditWidget.width - 22
+        height: lineEdit.height - 2;
+        width: 24
+        visible: false
+        checked: backendValue.isTranslated
+        onToggled: {
+            if (trCheckbox.checked) {
+                backendValue.expression = "qsTr(\"" + escapeString(lineEditWidget.text) + "\")"
+            } else {
+                backendValue.value = lineEditWidget.text
+            }
+            evaluate();
+        }
+
+        onVisibleChanged: {
+            if (trCheckbox.visible) {
+                trCheckbox.raise();
+                lineEditWidget.styleSheet =  "QLineEdit { padding-left: 32; padding-right: 62;}"
+            }
+        }
+    }
+}

src/libs/qmleditorwidgets/colorbutton.cpp

@@ -89,15 +89,15 @@ static inline QColor properColor(const QString &str)
 
 namespace QmlEditorWidgets {
 
-void ColorButton::setColor(const QString &colorStr)
+void ColorButton::setColor(const QVariant &colorStr)
 {
-    if (m_colorString == colorStr)
+    if (m_colorString == colorStr.toString())
         return;
 
 
-    setEnabled(isColorString(colorStr));
+    setEnabled(isColorString(colorStr.toString()));
 
-    m_colorString = colorStr;
+    m_colorString = colorStr.toString();
     update();
     emit colorChanged();
 }

src/libs/qmleditorwidgets/colorbutton.h

@@ -40,15 +40,15 @@ class QMLEDITORWIDGETS_EXPORT ColorButton : public QToolButton {
 
 Q_OBJECT
 
-Q_PROPERTY(QString color READ color WRITE setColor NOTIFY colorChanged)
+Q_PROPERTY(QVariant color READ color WRITE setColor NOTIFY colorChanged)
 Q_PROPERTY(bool noColor READ noColor WRITE setNoColor)
 Q_PROPERTY(bool showArrow READ showArrow WRITE setShowArrow)
 
 public:
     ColorButton(QWidget *parent = 0) : QToolButton (parent), m_colorString("#ffffff"), m_noColor(false), m_showArrow(true) {}
 
-    void setColor(const QString &colorStr);
+    void setColor(const QVariant &colorStr);
-    QString color() const { return m_colorString; }
+    QVariant color() const { return m_colorString; }
     QColor convertedColor() const;
     bool noColor() const { return m_noColor; }
     void setNoColor(bool f) { m_noColor = f; update(); }

src/libs/qmleditorwidgets/contextpanetextwidget.cpp

@@ -264,7 +264,7 @@ void ContextPaneTextWidget::onTextColorButtonToggled(bool flag)
     if (flag)
         ui->colorButton->setChecked(false);
     QPoint p = mapToGlobal(ui->textColorButton->pos());
-    parentContextWidget->colorDialog()->setupColor(ui->textColorButton->color());
+    parentContextWidget->colorDialog()->setupColor(ui->textColorButton->color().toString());
     p = parentContextWidget->colorDialog()->parentWidget()->mapFromGlobal(p);
     parentContextWidget->onShowColorDialog(flag, p);
 }
@@ -275,7 +275,7 @@ void ContextPaneTextWidget::onColorButtonToggled(bool flag)
         ui->textColorButton->setChecked(false);
     ContextPaneWidget *parentContextWidget = qobject_cast<ContextPaneWidget*>(parentWidget());
     QPoint p = mapToGlobal(ui->colorButton->pos());
-    parentContextWidget->colorDialog()->setupColor(ui->colorButton->color());
+    parentContextWidget->colorDialog()->setupColor(ui->colorButton->color().toString());
     p = parentContextWidget->colorDialog()->parentWidget()->mapFromGlobal(p);    
     parentContextWidget->onShowColorDialog(flag, p);
 }

src/plugins/qmldesigner/components/propertyeditor/propertyeditorcontextobject.h

@@ -65,6 +65,8 @@ public:
 
     QDeclarativePropertyMap* backendValues() const { return m_backendValues; }
 
+    Q_INVOKABLE QString convertColorToString(const QColor &color) { return color.name(); }
+
 signals:
     void globalBaseUrlChanged();
     void specificsUrlChanged();

src/plugins/qmldesigner/components/propertyeditor/propertyeditorvalue.cpp

@@ -173,6 +173,11 @@ void PropertyEditorValue::setExpression(const QString &expression)
     }
 }
 
+QString PropertyEditorValue::valueToString() const
+{
+    return value().toString();
+}
+
 bool PropertyEditorValue::isInSubState() const
 {
     const QmlDesigner::QmlObjectNode objectNode(modelNode());

src/plugins/qmldesigner/components/propertyeditor/propertyeditorvalue.h

@@ -79,6 +79,7 @@ class PropertyEditorValue : public QObject
     Q_OBJECT
     Q_PROPERTY(QVariant value READ value WRITE setValueWithEmit NOTIFY valueChangedQml)
     Q_PROPERTY(QString expression READ expression WRITE setExpressionWithEmit NOTIFY expressionChanged FINAL)
+    Q_PROPERTY(QString valueToString READ valueToString NOTIFY valueChangedQml FINAL)
     Q_PROPERTY(bool isInModel READ isInModel NOTIFY valueChangedQml FINAL)
     Q_PROPERTY(bool isInSubState READ isInSubState NOTIFY valueChangedQml FINAL)
     Q_PROPERTY(bool isBound READ isBound NOTIFY isBoundChanged FINAL)
@@ -99,6 +100,8 @@ public:
     void setExpressionWithEmit(const QString &expression);
     void setExpression(const QString &expression);
 
+    QString valueToString() const;
+
     bool isInSubState() const;
 
     bool isInModel() const;