QmlDesigner.PropertyEditor: fix specifics for controls

User the new Qt Quick 2 format.

Change-Id: I178ffe84c49df51bcf96983c3a0c89e240f5bf58
Reviewed-by: Thomas Hartmann <Thomas.Hartmann@digia.com>

7 files changed, 513 insertions, 468 deletions

diff --git a/src/plugins/qmldesigner/componentsplugin/Controls/ButtonSpecifics.qml b/src/plugins/qmldesigner/componentsplugin/Controls/ButtonSpecifics.qml
index 00c8eaba43..4633c06fc3 100644
--- a/src/plugins/qmldesigner/componentsplugin/Controls/ButtonSpecifics.qml
+++ b/src/plugins/qmldesigner/componentsplugin/Controls/ButtonSpecifics.qml
@@ -27,144 +27,144 @@
 **
 ****************************************************************************/
 
-import Bauhaus 1.0
-import HelperWidgets 1.0
-
-QWidget {
-    layout: QVBoxLayout {
-        topMargin: 0
-        bottomMargin: 0
-        leftMargin: 0
-        rightMargin: 0
-        spacing: 0
-        GroupBox {
-            finished: finishedNotify;
-            caption: qsTr("Button")
-            layout: VerticalLayout {
-
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text:  qsTr("Text")
-                            toolTip:  qsTr("The text shown on the button")
-                        }
-                        LineEdit {
-                            backendValue: backendValues.text
-                            baseStateFlag: isBaseState;
-                            translation: true
-                        }
-                    }
-                }
-
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Checked")
-                            toolTip: qsTr("The state of the button")
-                        }
-                        CheckBox {
-                            text: backendValues.checked.value
-                            backendValue: backendValues.checked
-                            baseStateFlag: isBaseState
-                            checkable: true
-                        }
-                    }
-                }
-
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Checkable")
-                            toolTip: qsTr("Determines whether the button is checkable or not.")
-                        }
-                        CheckBox {
-                            text: backendValues.checkable.value
-                            backendValue: backendValues.checkable
-                            baseStateFlag: isBaseState
-                            checkable: true
-                        }
-                    }
-                }
-
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Enabled")
-                            toolTip: qsTr("Determines whether the button is enabled or not.")
-                        }
-                        CheckBox {
-                            text: backendValues.enabled.value
-                            backendValue: backendValues.enabled
-                            baseStateFlag: isBaseState
-                            checkable: true
-                        }
-                    }
-                }
-
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Default button")
-                            toolTip: qsTr("Sets the button as the default button in a dialog.")
-                        }
-                        CheckBox {
-                            text: backendValues.defaultbutton.value
-                            backendValue: backendValues.defaultbutton
-                            baseStateFlag: isBaseState
-                            checkable: true
-                        }
-                    }
-                }
-
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Tool tip")
-                            toolTip: qsTr("The tool tip shown for the button.")
-                        }
-                        LineEdit {
-                            backendValue: backendValues.toolTip
-                            baseStateFlag: isBaseState;
-                            translation: true
-                        }
-                    }
-                }
-
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Focus on press")
-                            toolTip: "Determines whether the check box gets focus if pressed."
-                        }
-                        CheckBox {
-                            text: backendValues.activeFocusOnPress.value
-                            backendValue: backendValues.activeFocusOnPress
-                            baseStateFlag: isBaseState
-                            checkable: true
-                        }
-                    }
-                }
-
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Icon source")
-                            toolTip: qsTr("The URL of an icon resource.")
-                        }
-
-                        FileWidget {
-                            enabled: isBaseState || backendValues.id.value != "";
-                            fileName: backendValues.iconSource.value;
-                            onFileNameChanged: {
-                                backendValues.iconSource.value = fileName;
-                            }
-                            itemNode: anchorBackend.itemNode
-                            filter: "*.png *.gif *.jpg *.bmp *.jpeg"
-                            showComboBox: true
-                        }
-                    }
+import QtQuick 2.1
+import HelperWidgets 2.0
+import QtQuick.Layouts 1.0
+
+Column {
+    anchors.left: parent.left
+    anchors.right: parent.right
+
+    Section {
+        anchors.left: parent.left
+        anchors.right: parent.right
+        caption: qsTr("Button")
+
+        SectionLayout {
+
+            Label {
+                text: qsTr("Text")
+                toolTip:  qsTr("The text shown on the button")
+            }
+
+            SecondColumnLayout {
+                LineEdit {
+                    backendValue: backendValues.text
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
                 }
             }
+
+            Label {
+                text: qsTr("Checked")
+                toolTip: qsTr("The state of the button")
+            }
+
+            SecondColumnLayout {
+                CheckBox {
+                    backendValue: backendValues.checked
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
+                }
+            }
+
+            Label {
+                text: qsTr("Checkable")
+                toolTip: qsTr("Determines whether the button is checkable or not.")
+            }
+
+            SecondColumnLayout {
+                CheckBox {
+                    backendValue: backendValues.checkable
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
+                }
+            }
+
+            Label {
+                text: qsTr("Enabled")
+                toolTip: qsTr("Determines whether the button is enabled or not.")
+            }
+
+            SecondColumnLayout {
+                CheckBox {
+                    backendValue: backendValues.enabled
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
+                }
+            }
+
+
+            Label {
+                text: qsTr("Default button")
+                toolTip: qsTr("Sets the button as the default button in a dialog.")
+            }
+
+            SecondColumnLayout {
+                CheckBox {
+                    backendValue: backendValues.defaultbutton
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
+                }
+            }
+
+            Label {
+                text: qsTr("Tool tip")
+                toolTip: qsTr("The tool tip shown for the button.")
+            }
+
+            SecondColumnLayout {
+                LineEdit {
+                    backendValue: backendValues.toolTip
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
+                }
+            }
+
+            Label {
+                text: qsTr("Focus on press")
+                toolTip: "Determines whether the check box gets focus if pressed."
+            }
+
+            SecondColumnLayout {
+                CheckBox {
+                    backendValue: backendValues.activeFocusOnPress
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
+                }
+            }
+
+
+            Label {
+                text: qsTr("Icon source")
+                toolTip: qsTr("The URL of an icon resource.")
+            }
+
+            SecondColumnLayout {
+                LineEdit {
+                    backendValue: backendValues.iconSource
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
+                }
+            }
+
+
         }
     }
 }
diff --git a/src/plugins/qmldesigner/componentsplugin/Controls/CheckBoxSpecifics.qml b/src/plugins/qmldesigner/componentsplugin/Controls/CheckBoxSpecifics.qml
index 412fdeb95b..7ec2cfd91d 100644
--- a/src/plugins/qmldesigner/componentsplugin/Controls/CheckBoxSpecifics.qml
+++ b/src/plugins/qmldesigner/componentsplugin/Controls/CheckBoxSpecifics.qml
@@ -27,54 +27,67 @@
 **
 ****************************************************************************/
 
-import HelperWidgets 1.0
-import Bauhaus 1.0
-GroupBox {
-    caption: "Check Box"
-    layout: VerticalLayout {
+import QtQuick 2.1
+import HelperWidgets 2.0
+import QtQuick.Layouts 1.0
 
-        QWidget {
-            layout: HorizontalLayout {
-                Label {
-                    text: qsTr("Text")
-                    toolTip: qsTr("The text label for the check box")
-                }
+Column {
+    anchors.left: parent.left
+    anchors.right: parent.right
+
+    Section {
+        anchors.left: parent.left
+        anchors.right: parent.right
+        caption: qsTr("Check Box")
+
+        SectionLayout {
+
+            Label {
+                text: qsTr("Text")
+                toolTip:  qsTr("The text shown on the check button")
+            }
+
+            SecondColumnLayout {
                 LineEdit {
                     backendValue: backendValues.text
-                    baseStateFlag: isBaseState
-                    translation: true
+                    implicitWidth: 180
                 }
-            }
-        }
+                ExpandingSpacer {
 
-        QWidget {
-            layout: HorizontalLayout {
-                Label {
-                    text: qsTr("Checked")
-                    toolTip: qsTr("Determines whether the check box is checkable or not.")
                 }
+            }
+
+            Label {
+                text: qsTr("Checked")
+                toolTip: qsTr("The state of the check button")
+            }
+
+            SecondColumnLayout {
                 CheckBox {
-                    text: backendValues.checked.value
                     backendValue: backendValues.checked
-                    baseStateFlag: isBaseState
-                    checkable: true
+                    implicitWidth: 180
                 }
-            }
-        }
+                ExpandingSpacer {
 
-        QWidget {
-            layout: HorizontalLayout {
-                Label {
-                    text: qsTr("Focus on press")
-                    toolTip: "Determines whether the check box gets focus if pressed."
                 }
+            }
+
+
+            Label {
+                text: qsTr("Focus on press")
+                toolTip: "Determines whether the check box gets focus if pressed."
+            }
+
+            SecondColumnLayout {
                 CheckBox {
-                    text: backendValues.activeFocusOnPress.value
                     backendValue: backendValues.activeFocusOnPress
-                    baseStateFlag: isBaseState
-                    checkable: true
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
                 }
             }
+
         }
     }
 }
diff --git a/src/plugins/qmldesigner/componentsplugin/Controls/ComboBoxSpecifics.qml b/src/plugins/qmldesigner/componentsplugin/Controls/ComboBoxSpecifics.qml
index 151d47bd32..c645055654 100644
--- a/src/plugins/qmldesigner/componentsplugin/Controls/ComboBoxSpecifics.qml
+++ b/src/plugins/qmldesigner/componentsplugin/Controls/ComboBoxSpecifics.qml
@@ -27,40 +27,51 @@
 **
 ****************************************************************************/
 
+import QtQuick 2.1
+import HelperWidgets 2.0
+import QtQuick.Layouts 1.0
 
-import HelperWidgets 1.0
-import Bauhaus 1.0
+Column {
+    anchors.left: parent.left
+    anchors.right: parent.right
 
-GroupBox {
-    caption: "Combo Box"
-    layout: VerticalLayout {
+    Section {
+        anchors.left: parent.left
+        anchors.right: parent.right
+        caption: qsTr("Combo Box")
 
-        QWidget {
-            layout: HorizontalLayout {
-                Label {
-                    text: qsTr("Tool tip")
-                    toolTip: qsTr("The tool tip shown for the combobox.")
-                }
+        SectionLayout {
+
+            Label {
+                text: qsTr("Tool tip")
+                toolTip: qsTr("The tool tip shown for the combobox.")
+            }
+
+            SecondColumnLayout {
                 LineEdit {
                     backendValue: backendValues.tooltip
-                    baseStateFlag: isBaseState
+                    implicitWidth: 180
                 }
-            }
-        }
+                ExpandingSpacer {
 
-        QWidget {
-            layout: HorizontalLayout {
-                Label {
-                    text: qsTr("Focus on press")
-                    toolTip: "Determines whether the combobox gets focus if pressed."
                 }
+            }
+
+            Label {
+                text: qsTr("Focus on press")
+                toolTip: "Determines whether the combobox gets focus if pressed."
+            }
+
+            SecondColumnLayout {
                 CheckBox {
-                    text: backendValues.activeFocusOnPress.value
                     backendValue: backendValues.activeFocusOnPress
-                    baseStateFlag: isBaseState
-                    checkable: true
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
                 }
             }
+
         }
     }
 }
diff --git a/src/plugins/qmldesigner/componentsplugin/Controls/RadioButtonSpecifics.qml b/src/plugins/qmldesigner/componentsplugin/Controls/RadioButtonSpecifics.qml
index 25ed160c0f..d15172f3bb 100644
--- a/src/plugins/qmldesigner/componentsplugin/Controls/RadioButtonSpecifics.qml
+++ b/src/plugins/qmldesigner/componentsplugin/Controls/RadioButtonSpecifics.qml
@@ -27,55 +27,68 @@
 **
 ****************************************************************************/
 
-import HelperWidgets 1.0
-import Bauhaus 1.0
-
-GroupBox {
-    caption: "Radio Button"
-    layout: VerticalLayout {
-
-        QWidget {
-            layout: HorizontalLayout {
-                Label {
-                    text: qsTr("Text")
-                    toolTip: qsTr("The text label for the radio button")
-                }
+import QtQuick 2.1
+import HelperWidgets 2.0
+import QtQuick.Layouts 1.0
+
+Column {
+    anchors.left: parent.left
+    anchors.right: parent.right
+
+    Section {
+        anchors.left: parent.left
+        anchors.right: parent.right
+        caption: qsTr("Radio Button")
+
+        SectionLayout {
+
+            Label {
+                text: qsTr("Text")
+                toolTip: qsTr("The text label for the radio button")
+            }
+
+            SecondColumnLayout {
                 LineEdit {
                     backendValue: backendValues.text
-                    baseStateFlag: isBaseState
-                    translation: true
+                    implicitWidth: 180
                 }
-            }
-        }
+                ExpandingSpacer {
 
-        QWidget {
-            layout: HorizontalLayout {
-                Label {
-                    text: qsTr("Checked")
-                    toolTip: qsTr("Determines whether the radio button is checkable or not.")
                 }
+            }
+
+            Label {
+                text: qsTr("Checked")
+                toolTip: qsTr("Determines whether the radio button is checkable or not.")
+            }
+
+            SecondColumnLayout {
                 CheckBox {
-                    text: backendValues.checked.value
                     backendValue: backendValues.checked
-                    baseStateFlag: isBaseState
-                    checkable: true
+                    implicitWidth: 180
                 }
-            }
-        }
+                ExpandingSpacer {
 
-        QWidget {
-            layout: HorizontalLayout {
-                Label {
-                    text: qsTr("Focus on press")
-                    toolTip: "Determines whether the check box gets focus if pressed."
                 }
+            }
+
+
+            Label {
+
+                text: qsTr("Focus on press")
+                toolTip: "Determines whether the radio button gets focus if pressed."
+            }
+
+            SecondColumnLayout {
                 CheckBox {
-                    text: backendValues.activeFocusOnPress.value
                     backendValue: backendValues.activeFocusOnPress
-                    baseStateFlag: isBaseState
-                    checkable: true
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
                 }
             }
+
         }
     }
 }
diff --git a/src/plugins/qmldesigner/componentsplugin/Controls/TextAreaSpecifics.qml b/src/plugins/qmldesigner/componentsplugin/Controls/TextAreaSpecifics.qml
index bf519b8698..9bd9a5c56c 100644
--- a/src/plugins/qmldesigner/componentsplugin/Controls/TextAreaSpecifics.qml
+++ b/src/plugins/qmldesigner/componentsplugin/Controls/TextAreaSpecifics.qml
@@ -27,164 +27,177 @@
 **
 ****************************************************************************/
 
-import HelperWidgets 1.0
-import Bauhaus 1.0
-
-QWidget {
-    layout: QVBoxLayout {
-        topMargin: 0
-        bottomMargin: 0
-        leftMargin: 0
-        rightMargin: 0
-        spacing: 0
-
-        GroupBox {
-            caption: "Text Area"
-
-            layout: VerticalLayout {
-
-
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Text")
-                            toolTip: qsTr("The text of the text area")
-                        }
-                        LineEdit {
-                            backendValue: backendValues.text
-                            baseStateFlag: isBaseState
-                        }
-                    }
-                }
-
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Read only")
-                            toolTip: qsTr("Determines whether the text area is read only.")
-                        }
-                        CheckBox {
-                            text: backendValues.readOnly.value
-                            backendValue: backendValues.readOnly
-                            baseStateFlag: isBaseState
-                            checkable: true
-                        }
-                    }
-                }
-
-                ColorGroupBox {
-                    caption: qsTr("Color")
-                    toolTip: qsTr("The color of the text")
-                    finished: finishedNotify
-                    backendColor: backendValues.color
-                }
-
-
-                IntEditor {
+import QtQuick 2.1
+import HelperWidgets 2.0
+import QtQuick.Layouts 1.0
+
+Column {
+    anchors.left: parent.left
+    anchors.right: parent.right
+
+
+    Section {
+        anchors.left: parent.left
+        anchors.right: parent.right
+        caption: qsTr("Color")
+
+
+        ColorEditor {
+            caption: qsTr("Color")
+            backendendValue: backendValues.color
+            supportGradient: false
+        }
+    }
+
+    Section {
+        anchors.left: parent.left
+        anchors.right: parent.right
+        caption: qsTr("Text Area")
+
+        SectionLayout {
+
+            Label {
+                text: qsTr("Text")
+                toolTip:  qsTr("The text shown on the button")
+            }
+
+            SecondColumnLayout {
+                LineEdit {
+                    backendValue: backendValues.text
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
+                }
+            }
+
+            Label {
+                text: qsTr("Read only")
+                toolTip: qsTr("Determines whether the text field is read only.")
+            }
+
+            SecondColumnLayout {
+                CheckBox {
+                    backendValue: backendValues.readOnly
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
+                }
+            }
+
+            Label {
+                text: qsTr("Document margins")
+                toolTip: qsTr("The margins of the text area")
+            }
+
+            SectionLayout {
+                SpinBox {
                     backendValue: backendValues.documentMargins
-                    caption: qsTr("Document margins")
-                    toolTip: qsTr("The margins of the text area")
-                    baseStateFlag: isBaseState
-                    slider: false
-                }
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Frame")
-                            toolTip: qsTr("Determines whether the text area has a frame.")
-                        }
-                        CheckBox {
-                            text: backendValues.frame.value
-                            backendValue: backendValues.frame
-                            baseStateFlag: isBaseState
-                            checkable: true
-                        }
-                    }
-                }
-
-                IntEditor {
+                    minimumValue: 0;
+                    maximumValue: 1000;
+                    decimals: 0
+                }
+
+                ExpandingSpacer {
+
+                }
+            }
+
+
+            Label {
+                text: qsTr("Frame width")
+                toolTip: qsTr("The width of the frame")
+            }
+
+            SectionLayout {
+                SpinBox {
                     backendValue: backendValues.frameWidth
-                    caption: qsTr("Frame width")
-                    toolTip: qsTr("The width of the frame")
-                    baseStateFlag: isBaseState
-                    slider: false
+                    minimumValue: 0;
+                    maximumValue: 1000;
+                    decimals: 0
                 }
 
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Contents frame")
-                            toolTip: qsTr("Determines whether the frame around contents is shown.")
-                        }
-                        CheckBox {
-                            text: backendValues.frameAroundContents.value
-                            backendValue: backendValues.frameAroundContents
-                            baseStateFlag: isBaseState
-                            checkable: true
-                        }
-                    }
+                ExpandingSpacer {
+
                 }
+            }
 
+            Label {
+                text: qsTr("Contents frame")
+                toolTip: qsTr("Determines whether the frame around contents is shown.")
             }
-        }
 
-        FontGroupBox {
+            SecondColumnLayout {
+                CheckBox {
+                    backendValue: backendValues.frameAroundContents
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
+                }
+            }
 
         }
 
-        GroupBox {
-            caption: qsTr("Focus Handling")
-
-            layout: VerticalLayout {
-
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Highlight on focus")
-                            toolTip: qsTr("Determines whether the text area is highlighted on focus.")
-                        }
-                        CheckBox {
-                            text: backendValues.highlightOnFocus.value
-                            backendValue: backendValues.highlightOnFocus
-                            baseStateFlag: isBaseState
-                            checkable: true
-                        }
-                    }
-                }
-
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Tab changes focus")
-                            toolTip: qsTr("Determines whether tab changes the focus of the text area.")
-                        }
-                        CheckBox {
-                            text: backendValues.tabChangesFocus.value
-                            backendValue: backendValues.tabChangesFocus
-                            baseStateFlag: isBaseState
-                            checkable: true
-                        }
-                    }
-                }
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Focus on press")
-                            toolTip: qsTr("Determines whether the text area gets focus if pressed.")
-                        }
-                        CheckBox {
-                            text: backendValues.activeFocusOnPress.value
-                            backendValue: backendValues.activeFocusOnPress
-                            baseStateFlag: isBaseState
-                            checkable: true
-                        }
-                    }
+    }
+
+    FontSection {
+        showStyle: false
+    }
+
+
+    Section {
+        anchors.left: parent.left
+        anchors.right: parent.right
+        caption: qsTr("Focus Handling")
+
+        SectionLayout {
+
+            Label {
+                text: qsTr("Highlight on focus")
+                toolTip: qsTr("Determines whether the text area is highlighted on focus.")
+            }
+
+            SecondColumnLayout {
+                CheckBox {
+                    backendValue: backendValues.highlightOnFocus
+                    implicitWidth: 180
                 }
+                ExpandingSpacer {
 
+                }
+            }
+
+            Label {
+                text: qsTr("Tab changes focus")
+                toolTip: qsTr("Determines whether tab changes the focus of the text area.")
+            }
+
+            SecondColumnLayout {
+                CheckBox {
+                    backendValue: backendValues.tabChangesFocus
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
+                }
+            }
+
+            Label {
+                text: qsTr("Focus on press")
+                toolTip: qsTr("Determines whether the text area gets focus if pressed.")
             }
-        }
 
-        ScrollArea {
+            SecondColumnLayout {
+                CheckBox {
+                    backendValue: backendValues.activeFocusOnPress
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
+                }
+            }
 
         }
     }
diff --git a/src/plugins/qmldesigner/componentsplugin/Controls/TextFieldSpecifics.qml b/src/plugins/qmldesigner/componentsplugin/Controls/TextFieldSpecifics.qml
index 8204cf83ed..7bad915625 100644
--- a/src/plugins/qmldesigner/componentsplugin/Controls/TextFieldSpecifics.qml
+++ b/src/plugins/qmldesigner/componentsplugin/Controls/TextFieldSpecifics.qml
@@ -27,123 +27,118 @@
 **
 ****************************************************************************/
 
-import Bauhaus 1.0
-import HelperWidgets 1.0
-
-QWidget {
-    layout: QVBoxLayout {
-        topMargin: 0
-        bottomMargin: 0
-        leftMargin: 0
-        rightMargin: 0
-        spacing: 0
-        GroupBox {
-            finished: finishedNotify;
-            caption: qsTr("Text Field")
-            layout: VerticalLayout {
-
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text:  qsTr("Text")
-                            toolTip:  qsTr("The text shown on the text field")
-                        }
-                        LineEdit {
-                            backendValue: backendValues.text
-                            baseStateFlag: isBaseState;
-                            translation: true
-                        }
-                    }
+import QtQuick 2.1
+import HelperWidgets 2.0
+import QtQuick.Layouts 1.0
+
+Column {
+    anchors.left: parent.left
+    anchors.right: parent.right
+
+    Section {
+        anchors.left: parent.left
+        anchors.right: parent.right
+        caption: qsTr("Text Field")
+
+        SectionLayout {
+
+            Label {
+                text: qsTr("Text")
+                toolTip:  qsTr("The text shown on the button")
+            }
+
+            SecondColumnLayout {
+                LineEdit {
+                    backendValue: backendValues.text
+                    implicitWidth: 180
                 }
+                ExpandingSpacer {
 
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text:  qsTr("Placeholder text")
-                            toolTip: qsTr("The placeholder text")
-                        }
-                        LineEdit {
-                            backendValue: backendValues.placeholderText
-                            baseStateFlag: isBaseState;
-                            translation: true
-                        }
-                    }
                 }
+            }
+
+            Label {
+                text:  qsTr("Placeholder text")
+                toolTip: qsTr("The placeholder text")
+            }
 
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Read only")
-                            toolTip: qsTr("Determines whether the text field is read only.")
-                        }
-                        CheckBox {
-                            text: backendValues.readOnly.value
-                            backendValue: backendValues.readOnly
-                            baseStateFlag: isBaseState
-                            checkable: true
-                        }
-                    }
+            SecondColumnLayout {
+                LineEdit {
+                    backendValue: backendValues.placeholderText
+                    implicitWidth: 180
                 }
+                ExpandingSpacer {
 
-                QWidget {
-                    layout: HorizontalLayout {
-                        Label {
-                            text: qsTr("Password mode")
-                            toolTip: qsTr("Determines whether the text field is in password mode.")
-                        }
-                        CheckBox {
-                            text: backendValues.passwordMode.value
-                            backendValue: backendValues.passwordMode
-                            baseStateFlag: isBaseState
-                            checkable: true
-                        }
-                    }
                 }
+            }
 
-                QWidget {
-                    layout: HorizontalLayout {
+            Label {
+                text: qsTr("Read only")
+                toolTip: qsTr("Determines whether the text field is read only.")
+            }
 
-                        Label {
-                            text: qsTr("Input mask")
-                            toolTip: qsTr("Restricts the valid text in the text field.")
-                        }
+            SecondColumnLayout {
+                CheckBox {
+                    backendValue: backendValues.readOnly
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
 
-                        LineEdit {
-                            backendValue: backendValues.inputMask
-                            baseStateFlag: isBaseState
-                        }
-                    }
                 }
+            }
 
-                QWidget {
-                    layout: HorizontalLayout {
-
-                        Label {
-                            text: qsTr("Echo mode")
-                            toolTip: qsTr("Specifies how the text is displayed in the text field.")
-                        }
-
-                        ComboBox {
-                            baseStateFlag: isBaseState
-                            items : { ["Normal", "Password", "PasswordEchoOnEdit", "NoEcho"] }
-                            currentText: backendValues.echoMode.value;
-                            onItemsChanged: {
-                                currentText =  backendValues.echoMode.value;
-                            }
-                            backendValue: backendValues.echoMode
-                        }
-                    }
+            Label {
+                text: qsTr("Password mode")
+                toolTip: qsTr("Determines whether the text field is in password mode.")
+            }
+
+            SecondColumnLayout {
+                CheckBox {
+                    backendValue: backendValues.passwordMode
+                    implicitWidth: 180
                 }
+                ExpandingSpacer {
 
+                }
             }
-        }
 
-        FontGroupBox {
+            Label {
+                text: qsTr("Input mask")
+                toolTip: qsTr("Restricts the valid text in the text field.")
+            }
 
-        }
+            SecondColumnLayout {
+                LineEdit {
+                    backendValue: backendValues.inputMask
+                    implicitWidth: 180
+                }
+                ExpandingSpacer {
+
+                }
+            }
+
+            Label {
+                text: qsTr("Echo mode")
+                toolTip: qsTr("Specifies how the text is displayed in the text field.")
+            }
+
+            SecondColumnLayout {
+                ComboBox {
+                    backendValue: backendValues.echoMode
+                    implicitWidth: 180
+                    model:  ["Normal", "Password", "PasswordEchoOnEdit", "NoEcho"]
+                }
+                ExpandingSpacer {
+
+                }
+            }
 
-        ScrollArea {
 
         }
+
+    }
+
+    FontSection {
+        showStyle: false
     }
 }
diff --git a/src/plugins/qmldesigner/componentsplugin/componentsplugin.qrc b/src/plugins/qmldesigner/componentsplugin/componentsplugin.qrc
index c139996ee0..cbf529aeb6 100644
--- a/src/plugins/qmldesigner/componentsplugin/componentsplugin.qrc
+++ b/src/plugins/qmldesigner/componentsplugin/componentsplugin.qrc
@@ -36,7 +36,7 @@
         <file>images/window.png</file>
         <file>images/window16.png</file>
     </qresource>
-    <qresource prefix="/propertyeditor/QtQuick">
+    <qresource prefix="/propertyEditorQmlSources/QtQuick">
         <file>Controls/ButtonSpecifics.qml</file>
         <file>Controls/TextFieldSpecifics.qml</file>
         <file>Controls/TextAreaSpecifics.qml</file>