From 32eab053978fad1ee8d112074138d7a541e414ae Mon Sep 17 00:00:00 2001 From: Ian Paschal Date: Tue, 3 Apr 2018 11:36:21 +0200 Subject: [PATCH 1/2] CURA-5035 Rename ToolboxDetailTile --- .../resources/qml/ToolboxViewDetail.qml | 22 +++++++++---------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/plugins/PluginBrowser/resources/qml/ToolboxViewDetail.qml b/plugins/PluginBrowser/resources/qml/ToolboxViewDetail.qml index 3ef4c74463..10ad984bdc 100644 --- a/plugins/PluginBrowser/resources/qml/ToolboxViewDetail.qml +++ b/plugins/PluginBrowser/resources/qml/ToolboxViewDetail.qml @@ -69,17 +69,17 @@ Item border.width: 1 } } - ToolboxDetailBlock {} - ToolboxDetailBlock {} - ToolboxDetailBlock {} - ToolboxDetailBlock {} - ToolboxDetailBlock {} - ToolboxDetailBlock {} - ToolboxDetailBlock {} - ToolboxDetailBlock {} - ToolboxDetailBlock {} - ToolboxDetailBlock {} - ToolboxDetailBlock {} + ToolboxDetailTile {} + ToolboxDetailTile {} + ToolboxDetailTile {} + ToolboxDetailTile {} + ToolboxDetailTile {} + ToolboxDetailTile {} + ToolboxDetailTile {} + ToolboxDetailTile {} + ToolboxDetailTile {} + ToolboxDetailTile {} + ToolboxDetailTile {} } } } From 8a7f9027c5fcf728437e5462fccf28a1947c80ca Mon Sep 17 00:00:00 2001 From: Ian Paschal Date: Tue, 3 Apr 2018 16:57:31 +0200 Subject: [PATCH 2/2] CURA-5035 Finished layout --- .../resources/qml/PluginBrowser.qml | 2 +- .../resources/qml/ToolboxFooter.qml | 8 +- .../resources/qml/ToolboxViewDetail.qml | 132 +++++++++++++++--- resources/themes/cura-light/theme.json | 2 +- 4 files changed, 119 insertions(+), 25 deletions(-) diff --git a/plugins/PluginBrowser/resources/qml/PluginBrowser.qml b/plugins/PluginBrowser/resources/qml/PluginBrowser.qml index 643d26bfbe..d0e150eaf5 100644 --- a/plugins/PluginBrowser/resources/qml/PluginBrowser.qml +++ b/plugins/PluginBrowser/resources/qml/PluginBrowser.qml @@ -33,7 +33,7 @@ Window { id: mainView width: parent.width - color: "red" + color: "transparent" anchors { top: topBar.bottom diff --git a/plugins/PluginBrowser/resources/qml/ToolboxFooter.qml b/plugins/PluginBrowser/resources/qml/ToolboxFooter.qml index 5ff336320f..b1ef00f313 100644 --- a/plugins/PluginBrowser/resources/qml/ToolboxFooter.qml +++ b/plugins/PluginBrowser/resources/qml/ToolboxFooter.qml @@ -60,7 +60,13 @@ Rectangle { } base.close(); } - anchors.right: parent.right + anchors + { + top: parent.top + topMargin: UM.Theme.getSize("default_margin").height + right: parent.right + rightMargin: UM.Theme.getSize("default_margin").height + } style: ButtonStyle { background: Rectangle { color: "transparent" diff --git a/plugins/PluginBrowser/resources/qml/ToolboxViewDetail.qml b/plugins/PluginBrowser/resources/qml/ToolboxViewDetail.qml index 10ad984bdc..84175b118c 100644 --- a/plugins/PluginBrowser/resources/qml/ToolboxViewDetail.qml +++ b/plugins/PluginBrowser/resources/qml/ToolboxViewDetail.qml @@ -15,7 +15,7 @@ Item anchors.fill: parent Item { - id: backMargin + id: sidebar height: parent.height width: UM.Theme.getSize("base_unit").width * 6 anchors @@ -29,46 +29,133 @@ Item Button { text: "Back" - onClicked: { + UM.RecolorImage + { + id: backArrow + anchors.verticalCenter: parent.verticalCenter + anchors.left: parent.left + anchors.rightMargin: UM.Theme.getSize("default_margin").width + width: UM.Theme.getSize("standard_arrow").width + height: UM.Theme.getSize("standard_arrow").height + sourceSize.width: width + sourceSize.height: height + color: UM.Theme.getColor("text") + source: UM.Theme.getIcon("arrow_left") + } + width: UM.Theme.getSize("base_unit").width * 4 + height: UM.Theme.getSize("base_unit").height * 2 + onClicked: + { manager.setDetailView("") } + style: ButtonStyle + { + background: Rectangle + { + color: "transparent" + } + label: Label + { + text: control.text + color: UM.Theme.getColor("text") + font: UM.Theme.getFont("default_bold") + horizontalAlignment: Text.AlignRight + width: control.width + } + } } } + + Rectangle + { + id: header + anchors + { + left: sidebar.right + right: parent.right + } + height: UM.Theme.getSize("base_unit").height * 12 + Rectangle + { + id: thumbnail + width: UM.Theme.getSize("toolbox_thumbnail_medium").width + height: UM.Theme.getSize("toolbox_thumbnail_medium").height + color: "grey" + anchors + { + top: parent.top + left: parent.left + leftMargin: UM.Theme.getSize("double_margin").width + topMargin: UM.Theme.getSize("double_margin").height + } + } + Column + { + anchors + { + top: thumbnail.top + left: thumbnail.right + leftMargin: UM.Theme.getSize("default_margin").width + right: parent.right + rightMargin: UM.Theme.getSize("double_margin").width + } + spacing: Math.floor(UM.Theme.getSize("default_margin").height/2) + Label + { + text: "DSM" + font: UM.Theme.getFont("large") + wrapMode: Text.WordWrap + width: parent.width + } + Label + { + text: "Sets the horizontal and vertical alignment of the text within the Text items width and height. By default, the text is vertically aligned to the top." + font: UM.Theme.getFont("default") + wrapMode: Text.WordWrap + width: parent.width + } + Label + { + text: "Author: " + "DSM" + font: UM.Theme.getFont("small") + wrapMode: Text.WordWrap + width: parent.width + // TODO: Add mail icon. + } + } + } + ScrollView { id: scroll - frameVisible: false - anchors.right: base.right - anchors.left: backMargin.right + frameVisible: true + anchors + { + right: header.right + top: header.bottom + left: header.left + bottom: base.bottom + } height: parent.height style: UM.Theme.styles.scrollview - Column + + /* + ListView { - width: scroll.width + id: contentColumn spacing: UM.Theme.getSize("base_unit").height height: childrenRect.height + (UM.Theme.getSize("double_margin").height * 2) anchors { - fill: parent + left: scroll.left + right: scroll.right + top: scroll.top topMargin: UM.Theme.getSize("double_margin").height bottomMargin: UM.Theme.getSize("double_margin").height leftMargin: UM.Theme.getSize("double_margin").width rightMargin: UM.Theme.getSize("double_margin").width } - Rectangle - { - width: parent.width - height: UM.Theme.getSize("base_unit").height * 12 - color: "transparent" - Rectangle - { - id: thumbnail - width: UM.Theme.getSize("toolbox_thumbnail_medium").width - height: UM.Theme.getSize("toolbox_thumbnail_medium").height - color: "white" - border.width: 1 - } - } + ToolboxDetailTile {} ToolboxDetailTile {} ToolboxDetailTile {} @@ -81,5 +168,6 @@ Item ToolboxDetailTile {} ToolboxDetailTile {} } + */ } } diff --git a/resources/themes/cura-light/theme.json b/resources/themes/cura-light/theme.json index 7706b8081d..595c7307a9 100644 --- a/resources/themes/cura-light/theme.json +++ b/resources/themes/cura-light/theme.json @@ -442,7 +442,7 @@ "objects_menu_button": [0.3, 2.7], "toolbox_thumbnail_small": [6.0, 6.0], - "toolbox_thumbnail_medium": [9.0, 9.0], + "toolbox_thumbnail_medium": [8.0, 8.0], "toolbox_thumbnail_large": [12.0, 12.0] } }