QmlDesigner: Fix property editor template for colors

The color editor requires its own section.
Therefore we mark the color type with 'separateSection'.
For this to work we have to order all properties.
The properties that require their own section do come first.
The QML code generation became a bit more complicated, but
having proper default sheets for colors should be worth it.

Task-number: QDS-742
Change-Id: I1eee71aa05c66af4aaf53e0e8c5a3514a9ca6d92
Reviewed-by: Tim Jenssen <tim.jenssen@qt.io>

share/qtcreator/qmldesigner/propertyEditorQmlSources/PropertyTemplates/ColorEditorTemplate.template

@@ -1,8 +1,5 @@
-Item {
-}
 
 ColorEditor {
-    caption: "%1"
     backendValue: backendValues.%2
     supportGradient: false
 }

share/qtcreator/qmldesigner/propertyEditorQmlSources/PropertyTemplates/TemplateTypes.qml

@@ -49,6 +49,7 @@ AutoTypes {
 
     Type {
         typeNames: ["color", "QColor"]
-        sourceFile: "StringEditorTemplate.template"
+        sourceFile: "ColorEditorTemplate.template"
+        separateSection: true
     }
 }

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

@@ -408,18 +408,44 @@ QString PropertyEditorQmlBackend::templateGeneration(const NodeMetaInfo &type,
     if (!templateConfiguration() || !templateConfiguration()->isValid())
         return QString();
 
+    const auto nodes = templateConfiguration()->children();
+
+    QStringList sectorTypes;
+
+    for (const QmlJS::SimpleReaderNode::Ptr &node : nodes) {
+        if (node->propertyNames().contains("separateSection"))
+            sectorTypes.append(variantToStringList(node->property("typeNames")));
+    }
+
     QStringList imports = variantToStringList(templateConfiguration()->property(QStringLiteral("imports")));
 
     QString qmlTemplate = imports.join(QLatin1Char('\n')) + QLatin1Char('\n');
-    qmlTemplate += QStringLiteral("Section {\n");
-    qmlTemplate += QStringLiteral("caption: \"%1\"\n").arg(QString::fromUtf8(type.simplifiedTypeName()));
-    qmlTemplate += QStringLiteral("SectionLayout {\n");
+
+    qmlTemplate += "Column {\n";
+    qmlTemplate += "anchors.left: parent.left\n";
+    qmlTemplate += "anchors.right: parent.right\n";
 
     QList<PropertyName> orderedList = type.propertyNames();
-    Utils::sort(orderedList);
+    Utils::sort(orderedList, [type, &sectorTypes](const PropertyName &left, const PropertyName &right){
+        const QString typeNameLeft = QString::fromLatin1(type.propertyTypeName(left));
+        const QString typeNameRight = QString::fromLatin1(type.propertyTypeName(right));
+        if (typeNameLeft == typeNameRight)
+            return left > right;
+
+        if (sectorTypes.contains(typeNameLeft)) {
+            if (sectorTypes.contains(typeNameRight))
+                return left > right;
+            return true;
+        } else if (sectorTypes.contains(typeNameRight)) {
+            return false;
+        }
+        return left > right;
+    });
 
     bool emptyTemplate = true;
 
+    bool sectionStarted = false;
+
     foreach (const PropertyName &name, orderedList) {
 
         if (name.startsWith("__"))
@@ -433,15 +459,35 @@ QString PropertyEditorQmlBackend::templateGeneration(const NodeMetaInfo &type,
         if (typeName == "alias" && node.isValid())
             typeName = node.instanceType(name);
 
+        auto nodes = templateConfiguration()->children();
+
         if (!superType.hasProperty(name) && type.propertyIsWritable(name) && !name.contains(".")) {
-            foreach (const QmlJS::SimpleReaderNode::Ptr &node, templateConfiguration()->children())
+
+            foreach (const QmlJS::SimpleReaderNode::Ptr &node, nodes)
                 if (variantToStringList(node->property(QStringLiteral("typeNames"))).contains(QString::fromLatin1(typeName))) {
                     const QString fileName = propertyTemplatesPath() + node->property(QStringLiteral("sourceFile")).toString();
                     QFile file(fileName);
                     if (file.open(QIODevice::ReadOnly)) {
                         QString source = QString::fromUtf8(file.readAll());
                         file.close();
+                        const bool section = node->propertyNames().contains("separateSection");
+                        if (section) {
+                            qmlTemplate += "Section {\n";
+                            qmlTemplate += "anchors.left: parent.left\n";
+                            qmlTemplate += "anchors.right: parent.right\n";
+                            qmlTemplate += QString("caption: \"%1\"\n").arg(QString::fromUtf8(properName));
+                        } else if (!sectionStarted) {
+                            qmlTemplate += QStringLiteral("Section {\n");
+                            qmlTemplate += QStringLiteral("caption: \"%1\"\n").arg(QString::fromUtf8(type.simplifiedTypeName()));
+                            qmlTemplate += "anchors.left: parent.left\n";
+                            qmlTemplate += "anchors.right: parent.right\n";
+                            qmlTemplate += QStringLiteral("SectionLayout {\n");
+                            sectionStarted = true;
+                        }
+
                         qmlTemplate += source.arg(QString::fromUtf8(name)).arg(QString::fromUtf8(properName));
+                        if (section)
+                            qmlTemplate += "}\n";
                         emptyTemplate = false;
                     } else {
                         qWarning().nospace() << "template definition source file not found:" << fileName;
@@ -449,8 +495,12 @@ QString PropertyEditorQmlBackend::templateGeneration(const NodeMetaInfo &type,
                 }
         }
     }
+    if (sectionStarted) {
         qmlTemplate += QStringLiteral("}\n"); //Section
         qmlTemplate += QStringLiteral("}\n"); //SectionLayout
+    }
+
+    qmlTemplate += "}\n";
 
     if (emptyTemplate)
         return QString();