Start implementing view and edit support in the materials page

Contributes to CURA-342

resources/qml/Preferences/MaterialView.qml

@@ -0,0 +1,183 @@
+// Copyright (c) 2016 Ultimaker B.V.
+// Uranium is released under the terms of the AGPLv3 or higher.
+
+import QtQuick 2.1
+import QtQuick.Controls 1.1
+import QtQuick.Dialogs 1.2
+
+import UM 1.2 as UM
+import Cura 1.0 as Cura
+
+TabView
+{
+    id: base
+
+    property QtObject properties;
+
+    property bool editingEnabled;
+
+    property string currency: UM.Preferences.getValue("general/currency") ? UM.Preferences.getValue("general/currency") : "€"
+
+    Tab
+    {
+        title: "Information"
+
+        ScrollView
+        {
+            anchors.fill: parent
+            anchors.margins: UM.Theme.getSize("default_margin").width
+
+            Flow
+            {
+                id: containerGrid
+
+                width: base.width - UM.Theme.getSize("default_margin").width * 4;
+
+                property real firstColumnWidth: width * 0.5
+                property real secondColumnWidth: width * 0.4
+
+                property real rowHeight: textField.height;
+
+                Label { width: parent.firstColumnWidth; height: parent.rowHeight; verticalAlignment: Qt.AlignVCenter; text: catalog.i18nc("@label", "Brand") }
+                TextField { id: textField; width: parent.secondColumnWidth; text: properties.supplier; readOnly: !base.editingEnabled; }
+
+                Label { width: parent.firstColumnWidth; height: parent.rowHeight; verticalAlignment: Qt.AlignVCenter; text: catalog.i18nc("@label", "Material Type") }
+                TextField { width: parent.secondColumnWidth; text: properties.material_type; readOnly: !base.editingEnabled; }
+
+                Label { width: parent.firstColumnWidth; height: parent.rowHeight; verticalAlignment: Qt.AlignVCenter; text: catalog.i18nc("@label", "Color") }
+
+                Row
+                {
+                    width: parent.secondColumnWidth;
+                    height:  parent.rowHeight;
+                    spacing: UM.Theme.getSize("default_margin").width/2
+
+                    Rectangle
+                    {
+                        id: colorSelector
+                        color: properties.color_code
+                        width: colorLabel.height * 0.75
+                        height: colorLabel.height * 0.75
+                        border.width: UM.Theme.getSize("default_lining").height
+
+                        anchors.verticalCenter: parent.verticalCenter
+
+                        MouseArea { anchors.fill: parent; onClicked: colorDialog.open(); enabled: base.editingEnabled }
+                    }
+                    TextField { id: colorLabel; text: properties.color_name; readOnly: !base.editingEnabled }
+
+                    ColorDialog { id: colorDialog; color: properties.color_code; onAccepted: colorSelector.color = color }
+                }
+
+                Item { width: parent.width; height: UM.Theme.getSize("default_margin").height }
+
+                Label { width: parent.width; height: parent.rowHeight; verticalAlignment: Qt.AlignVCenter; text: "<b>" + catalog.i18nc("@label", "Properties") + "</b>" }
+
+                Label { width: parent.firstColumnWidth; height: parent.rowHeight; verticalAlignment: Qt.AlignVCenter; text: catalog.i18nc("@label", "Density") }
+                ReadOnlySpinBox
+                {
+                    width: parent.secondColumnWidth;
+                    value: properties.density;
+                    decimals: 2
+                    suffix: "g/cm"
+                    stepSize: 0.01
+                    readOnly: !base.editingEnabled;
+                }
+
+                Label { width: parent.firstColumnWidth; height: parent.rowHeight; verticalAlignment: Qt.AlignVCenter; text: catalog.i18nc("@label", "Diameter") }
+                ReadOnlySpinBox
+                {
+                    width: parent.secondColumnWidth;
+                    value: properties.diameter;
+                    decimals: 2
+                    suffix: "mm³"
+                    stepSize: 0.01
+                    readOnly: !base.editingEnabled;
+                }
+
+                Label { width: parent.firstColumnWidth; height: parent.rowHeight; verticalAlignment: Qt.AlignVCenter; text: catalog.i18nc("@label", "Filament Cost") }
+                ReadOnlySpinBox
+                {
+                    width: parent.secondColumnWidth;
+                    value: properties.spool_cost;
+                    prefix: base.currency
+                    readOnly: !base.editingEnabled;
+                }
+
+                Label { width: parent.firstColumnWidth; height: parent.rowHeight; verticalAlignment: Qt.AlignVCenter; text: catalog.i18nc("@label", "Filament weight") }
+                ReadOnlySpinBox
+                {
+                    width: parent.secondColumnWidth;
+                    value: properties.spool_weight;
+                    suffix: "g";
+                    stepSize: 10
+                    readOnly: !base.editingEnabled;
+                }
+
+                Label { width: parent.firstColumnWidth; height: parent.rowHeight; verticalAlignment: Qt.AlignVCenter; text: catalog.i18nc("@label", "Filament length") }
+                ReadOnlySpinBox
+                {
+                    width: parent.secondColumnWidth;
+                    value: parseFloat(properties.spool_length);
+                    suffix: "m";
+                    readOnly: !base.editingEnabled;
+                }
+
+                Label { width: parent.firstColumnWidth; height: parent.rowHeight; verticalAlignment: Qt.AlignVCenter; text: catalog.i18nc("@label", "Cost per Meter (Approx.)") }
+                ReadOnlySpinBox
+                {
+                    width: parent.secondColumnWidth;
+                    value: parseFloat(properties.cost_per_meter);
+                    suffix: catalog.i18nc("@label", "%1/m".arg(base.currency));
+                    readOnly: !base.editingEnabled;
+                }
+
+                Item { width: parent.width; height: UM.Theme.getSize("default_margin").height }
+
+                Label { width: parent.width; height: parent.rowHeight; verticalAlignment: Qt.AlignVCenter; text: catalog.i18nc("@label", "Description") }
+
+                TextArea
+                {
+                    text: properties.description;
+                    width: parent.firstColumnWidth + parent.secondColumnWidth
+                    wrapMode: Text.WordWrap
+
+                    readOnly: !base.editingEnabled;
+                }
+
+                Label { width: parent.width; height: parent.rowHeight; verticalAlignment: Qt.AlignVCenter; text: catalog.i18nc("@label", "Adhesion Information") }
+
+                TextArea
+                {
+                    text: properties.adhesion_info;
+                    width: parent.firstColumnWidth + parent.secondColumnWidth
+                    wrapMode: Text.WordWrap
+
+                    readOnly: !base.editingEnabled;
+                }
+            }
+        }
+    }
+
+    Tab
+    {
+        title: catalog.i18nc("@label", "Print settings")
+        anchors.margins: UM.Theme.getSize("default_margin").height
+
+        ScrollView
+        {
+            anchors.fill: parent;
+
+            ListView
+            {
+                model: UM.SettingDefinitionsModel
+                {
+                    containerId: Cura.MachineManager.activeDefinitionId
+                    visibilityHandler: UM.SettingPreferenceVisibilityHandler { }
+                }
+
+                delegate: Cura.SettingDelegate { }
+            }
+        }
+    }
+}

resources/qml/Preferences/MaterialsPage.qml

@@ -52,134 +52,45 @@ UM.ManagementPage
     scrollviewCaption: " "
     detailsVisible: true
 
-    property string currency: UM.Preferences.getValue("general/currency")
-
     Item {
         UM.I18nCatalog { id: catalog; name: "cura"; }
 
         visible: base.currentItem != null
         anchors.fill: parent
 
-        Label { id: profileName; text: materialProperties.name; font: UM.Theme.getFont("large"); width: parent.width; }
+        Item
+        {
+            id: profileName
 
-        TabView {
+            width: parent.width;
-            id: scrollView
+            height: childrenRect.height
-            anchors.left: parent.left
-            anchors.right: parent.right
-            anchors.top: profileName.bottom
-            anchors.topMargin: UM.Theme.getSize("default_margin").height
-            anchors.bottom: parent.bottom
 
-            Tab {
+            Label { text: materialProperties.name; font: UM.Theme.getFont("large"); }
-                title: "Information"
+            Button
-                anchors.margins: UM.Theme.getSize("default_margin").height
+            {
+                id: editButton
+                anchors.right: parent.right;
+                text: catalog.i18nc("@action:button", "Edit");
+                iconName: "document-edit";
 
-                Flow {
+                checkable: true
-                    id: containerGrid
-
-                    width: scrollView.width;
-                    property real columnWidth: width / 2
-
-                    Label { width: parent.columnWidth; text: catalog.i18nc("@label", "Profile Type") }
-                    Label { width: parent.columnWidth; text: materialProperties.profile_type }
-
-                    Label { width: parent.columnWidth; text: catalog.i18nc("@label", "Supplier") }
-                    Label { width: parent.columnWidth; text: materialProperties.supplier }
-
-                    Label { width: parent.columnWidth; text: catalog.i18nc("@label", "Material Type") }
-                    Label { width: parent.columnWidth; text: materialProperties.material_type }
-
-                    Label { width: parent.columnWidth; text: catalog.i18nc("@label", "Color") }
-
-                    Row {
-                        width: parent.columnWidth;
-                        spacing: UM.Theme.getSize("default_margin").width/2
-                        Rectangle {
-                            color: materialProperties.color_code
-                            width: colorLabel.height
-                            height: colorLabel.height
-                            border.width: UM.Theme.getSize("default_lining").height
-                        }
-                        Label { id: colorLabel; text: materialProperties.color_name }
-                    }
-
-                    Item { width: parent.width; height: UM.Theme.getSize("default_margin").height }
-
-                    Label { width: parent.width; text: "<b>" + catalog.i18nc("@label", "Properties") + "</b>" }
-
-                    Label { width: parent.columnWidth; text: catalog.i18nc("@label", "Density") }
-                    Label { width: parent.columnWidth; text: materialProperties.density }
-
-                    Label { width: parent.columnWidth; text: catalog.i18nc("@label", "Diameter") }
-                    Label { width: parent.columnWidth; text: materialProperties.diameter }
-
-                    Label {
-                        text: catalog.i18nc("@label", "Filament cost")
-                        width: parent.columnWidth;
-                        height: spoolCostInput.height
-                        verticalAlignment: Text.AlignVCenter
-                    }
-
-                    Row {
-                        width: parent.columnWidth;
-                        Label {
-                            text: base.currency ? base.currency + " " : " "
-                            anchors.verticalCenter: parent.verticalCenter
-                        }
-                        TextField {
-                            id: spoolCostInput
-                            text: materialProperties.spool_cost
             }
         }
 
-                    Label { width: parent.columnWidth; text: catalog.i18nc("@label", "Filament weight") }
+        MaterialView
-                    Label { width: parent.columnWidth; text: materialProperties.spool_weight + " " + "g" }
+        {
+            anchors
+            {
+                left: parent.left
+                right: parent.right
+                top: profileName.bottom
+                topMargin: UM.Theme.getSize("default_margin").height
+                bottom: parent.bottom
+            }
 
-                    Label { width: parent.columnWidth; text: catalog.i18nc("@label", "Filament length") }
+            editingEnabled: editButton.checked;
-                    Label { width: parent.columnWidth; text: materialProperties.spool_length + " " + "m" }
 
-                    Label { width: parent.columnWidth; text: catalog.i18nc("@label", "Cost per meter") }
+            properties: materialProperties
-                    Label { width: parent.columnWidth; text: catalog.i18nc("@label", "approx. %1 %2/m").arg(materialProperties.cost_per_meter).arg(base.currency); }
-
-                    Item { width: parent.width; height: UM.Theme.getSize("default_margin").height }
-
-                    Label {
-                        text: materialProperties.description ? "<b>" + catalog.i18nc("@label", "Information") + "</b><br>" + materialProperties.description : "";
-                        width: parent.width
-                        wrapMode: Text.WordWrap
-                    }
-                    Label {
-                        text: materialProperties.adhesion_info ? "<b>" + catalog.i18nc("@label", "Adhesion") + "</b><br>" + materialProperties.adhesion_info : "";
-                        width: parent.width
-                        wrapMode: Text.WordWrap
-                    }
-                }
-            }
-            Tab {
-                title: catalog.i18nc("@label", "Print settings")
-                anchors.margins: UM.Theme.getSize("default_margin").height
-
-                Grid {
-                    columns: 2
-                    spacing: UM.Theme.getSize("default_margin").width
-
-                    Column {
-                        Repeater {
-                            model: base.currentItem ? base.currentItem.settings : null
-                            Label {
-                                text: modelData.name.toString();
-                                elide: Text.ElideMiddle;
-                            }
-                        }
-                    }
-                    Column {
-                        Repeater {
-                            model: base.currentItem ? base.currentItem.settings : null
-                            Label { text: modelData.value.toString() + " " + modelData.unit.toString(); }
-                        }
-                    }
-                }
-            }
         }
 
         QtObject
@@ -194,13 +105,15 @@ UM.ManagementPage
             property string color_name: "Yellow";
             property color color_code: "yellow";
 
-            property string density: "Unknown";
+            property real density: 0.0;
-            property string diameter: "Unknown";
+            onDensityChanged: console.log(density);
+            property real diameter: 0.0;
+            onDiameterChanged: console.log(diameter);
 
-            property string spool_cost: "Unknown";
+            property real spool_cost: 0.0;
-            property string spool_weight: "Unknown";
+            property real spool_weight: 0.0;
-            property string spool_length: "Unknown";
+            property real spool_length: 0.0;
-            property string cost_per_meter: "Unknown";
+            property real cost_per_meter: 0.0;
 
             property string description: "";
             property string adhesion_info: "";
@@ -228,13 +141,13 @@ UM.ManagementPage
 
             if(currentItem.metadata.properties != undefined && currentItem.metadata.properties != null)
             {
-                materialProperties.density = currentItem.metadata.properties.density ? currentItem.metadata.properties.density : "Unknown";
+                materialProperties.density = currentItem.metadata.properties.density ? currentItem.metadata.properties.density : 0.0;
-                materialProperties.diameter = currentItem.metadata.properties.diameter ? currentItem.metadata.properties.diameter : "Unknown";
+                materialProperties.diameter = currentItem.metadata.properties.diameter ? currentItem.metadata.properties.diameter : 0.0;
             }
             else
             {
-                materialProperties.density = "Unknown";
+                materialProperties.density = 0.0;
-                materialProperties.diameter = "Unknown";
+                materialProperties.diameter = 0.0;
             }
         }
     }