3D-printing/Cura
1
0
Fork 0
mirror of https://github.com/Ultimaker/Cura.git synced 2025-07-15 18:57:52 -06:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

CURA-5035 More styling & layout

Browse source
This commit is contained in:
Ian Paschal 2018-04-10 16:07:39 +02:00
parent 7359554641
commit d4cc4659d8
11 changed files with 248 additions and 180 deletions
Download patch file Download diff file Expand all files Collapse all files

6
plugins/Toolbox/resources/qml/Toolbox.qml
View file

@ -17,10 +17,10 @@ Window
property bool dataReady: manager.dataReady
title: catalog.i18nc("@title:tab", "Toolbox");
modality: Qt.ApplicationModal
width: 960 * screenScaleFactor
width: 720 * screenScaleFactor
height: 640 * screenScaleFactor
minimumWidth: 960 * screenScaleFactor
maximumWidth: 960 * screenScaleFactor
minimumWidth: 720 * screenScaleFactor
maximumWidth: 720 * screenScaleFactor
minimumHeight: 350 * screenScaleFactor
color: UM.Theme.getColor("sidebar")
Item

138
plugins/Toolbox/resources/qml/ToolboxAuthorPage.qml
View file

@ -7,66 +7,15 @@ import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4
import UM 1.1 as UM
// TODO: Switch to QtQuick.Controls 2.x and remove QtQuick.Controls.Styles
Item
{
id: base
property var details: manager.authorsModel.items[0]
anchors.fill: parent
Item
ToolboxBackColumn
{
id: sidebar
height: parent.height
width: UM.Theme.getSize("base_unit").width * 6
anchors
{
top: parent.top
left: parent.left
topMargin: UM.Theme.getSize("double_margin").height
leftMargin: UM.Theme.getSize("default_margin").width
rightMargin: UM.Theme.getSize("default_margin").width
}
Button
{
text: "Back"
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.viewPage = "overview"
manager.filterPackages("type", manager.viewCategory)
}
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
@ -74,6 +23,7 @@ Item
{
left: sidebar.right
right: parent.right
rightMargin: UM.Theme.getSize("double_margin").width
}
height: UM.Theme.getSize("base_unit").height * 12
Image
@ -82,7 +32,7 @@ Item
width: UM.Theme.getSize("toolbox_thumbnail_medium").width
height: UM.Theme.getSize("toolbox_thumbnail_medium").height
fillMode: Image.PreserveAspectFit
source: manager.detailData["icon_url"] || "../images/logobot.svg"
source: details.icon_url || "../images/logobot.svg"
anchors
{
top: parent.top
@ -91,8 +41,10 @@ Item
topMargin: UM.Theme.getSize("double_margin").height
}
}
Column
Label
{
id: title
anchors
{
top: thumbnail.top
@ -100,39 +52,79 @@ Item
leftMargin: UM.Theme.getSize("default_margin").width
right: parent.right
rightMargin: UM.Theme.getSize("double_margin").width
bottomMargin: UM.Theme.getSize("default_margin").height
}
text: details.name
font: UM.Theme.getFont("large")
wrapMode: Text.WordWrap
width: parent.width
height: UM.Theme.getSize("base_unit") * 2
}
Column
{
id: properties
anchors
{
top: title.bottom
left: title.left
topMargin: UM.Theme.getSize("default_margin").height
}
spacing: Math.floor(UM.Theme.getSize("default_margin").height / 2)
width: childrenRect.width
Label
{
text: "Version:"
font: UM.Theme.getFont("very_small")
color: UM.Theme.getColor("text_medium")
}
Label
{
text: "Author:"
font: UM.Theme.getFont("very_small")
color: UM.Theme.getColor("text_medium")
}
}
Column
{
id: values
anchors
{
top: title.bottom
left: properties.right
leftMargin: UM.Theme.getSize("default_margin").width
topMargin: UM.Theme.getSize("default_margin").height
}
spacing: Math.floor(UM.Theme.getSize("default_margin").height/2)
width: UM.Theme.getSize("base_unit").width * 12
Label
{
text: manager.detailData["name"]
font: UM.Theme.getFont("large")
wrapMode: Text.WordWrap
width: parent.width
text: details.name
font: UM.Theme.getFont("very_small")
color: UM.Theme.getColor("text")
}
Label
{
text: "HELLO THIS IS AN AUTHOR PAGE"
font: UM.Theme.getFont("default")
wrapMode: Text.WordWrap
width: parent.width
}
Label
{
text: "Author: " + manager.detailData["author"]["name"]
font: UM.Theme.getFont("small")
wrapMode: Text.WordWrap
width: parent.width
// TODO: Add mail icon.
text: details.name
font: UM.Theme.getFont("very_small")
color: UM.Theme.getColor("text")
}
}
Rectangle
{
color: UM.Theme.getColor("text_medium")
width: parent.width
height: UM.Theme.getSize("default_lining").height
anchors.bottom: parent.bottom
}
}
ToolboxDetailList {
anchors
{
right: header.right
top: header.bottom
left: header.left
bottom: base.bottom
left: header.left
right: base.right
}
}
}

64
plugins/Toolbox/resources/qml/ToolboxBackColumn.qml Normal file
View file

@ -0,0 +1,64 @@
// Copyright (c) 2018 Ultimaker B.V.
// PluginBrowser is released under the terms of the LGPLv3 or higher.
import QtQuick 2.2
import QtQuick.Dialogs 1.1
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4
import UM 1.1 as UM
Item
{
id: sidebar
height: parent.height
width: UM.Theme.getSize("base_unit").width * 6
anchors
{
top: parent.top
left: parent.left
topMargin: UM.Theme.getSize("double_margin").height
leftMargin: UM.Theme.getSize("default_margin").width
rightMargin: UM.Theme.getSize("default_margin").width
}
Button
{
id: button
text: "Back"
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: button.hovered ? UM.Theme.getColor("primary") : 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.viewPage = "overview"
manager.filterPackages("type", manager.viewCategory)
}
style: ButtonStyle
{
background: Rectangle
{
color: "transparent"
}
label: Label
{
id: labelStyle
text: control.text
color: control.hovered ? UM.Theme.getColor("primary") : UM.Theme.getColor("text")
font: UM.Theme.getFont("default_bold")
horizontalAlignment: Text.AlignRight
width: control.width
}
}
}
}

14
plugins/Toolbox/resources/qml/ToolboxDetailList.qml
View file

@ -10,11 +10,6 @@ import UM 1.1 as UM
Item
{
id: base
anchors
{
topMargin: UM.Theme.getSize("double_margin").height
bottomMargin: UM.Theme.getSize("double_margin").height
}
ScrollView
{
frameVisible: false
@ -22,8 +17,13 @@ Item
style: UM.Theme.styles.scrollview
Column
{
anchors.right: base.right
anchors.rightMargin: UM.Theme.getSize("double_margin").width
anchors
{
right: base.right
topMargin: UM.Theme.getSize("double_margin").height
bottomMargin: UM.Theme.getSize("double_margin").height
top: parent.top
}
height: childrenRect.height
spacing: UM.Theme.getSize("default_margin").height
Repeater

74
plugins/Toolbox/resources/qml/ToolboxDetailPage.qml
View file

@ -7,67 +7,15 @@ import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4
import UM 1.1 as UM
// TODO: Switch to QtQuick.Controls 2.x and remove QtQuick.Controls.Styles
Item
{
property var details: manager.packagesModel.items[0]
id: base
property var details: manager.packagesModel.items[0]
anchors.fill: parent
Item
ToolboxBackColumn
{
id: sidebar
height: parent.height
width: UM.Theme.getSize("base_unit").width * 6
anchors
{
top: parent.top
left: parent.left
topMargin: UM.Theme.getSize("double_margin").height
leftMargin: UM.Theme.getSize("default_margin").width
rightMargin: UM.Theme.getSize("default_margin").width
}
Button
{
text: "Back"
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.viewPage = "overview"
manager.filterPackages("type", manager.viewCategory)
}
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
@ -75,6 +23,7 @@ Item
{
left: sidebar.right
right: parent.right
rightMargin: UM.Theme.getSize("double_margin").width
}
height: UM.Theme.getSize("base_unit").height * 12
Image
@ -119,6 +68,7 @@ Item
{
top: title.bottom
left: title.left
topMargin: UM.Theme.getSize("default_margin").height
}
spacing: Math.floor(UM.Theme.getSize("default_margin").height / 2)
width: childrenRect.width
@ -149,6 +99,7 @@ Item
top: title.bottom
left: properties.right
leftMargin: UM.Theme.getSize("default_margin").width
topMargin: UM.Theme.getSize("default_margin").height
}
spacing: Math.floor(UM.Theme.getSize("default_margin").height/2)
width: UM.Theme.getSize("base_unit").width * 12
@ -160,7 +111,7 @@ Item
}
Label
{
text: details.generated_time
text: Qt.formatDateTime(details.last_updated, "dd MMM yyyy")
font: UM.Theme.getFont("very_small")
color: UM.Theme.getColor("text")
}
@ -171,16 +122,21 @@ Item
color: UM.Theme.getColor("text")
}
}
Rectangle
{
color: UM.Theme.getColor("text_medium")
width: parent.width
height: UM.Theme.getSize("default_lining").height
anchors.bottom: parent.bottom
}
}
ToolboxDetailList {
anchors
{
right: header.right
top: header.bottom
left: header.left
bottom: base.bottom
left: header.left
right: base.right
}
}
}

15
plugins/Toolbox/resources/qml/ToolboxDetailTile.qml
View file

@ -20,7 +20,6 @@ Rectangle
right: controls.left
rightMargin: UM.Theme.getSize("default_margin").width
top: parent.top
topMargin: UM.Theme.getSize("default_margin").height
}
Label
{
@ -45,7 +44,6 @@ Rectangle
id: controls
anchors.right: parent.right
anchors.top: parent.top
anchors.topMargin: UM.Theme.getSize("default_margin").height
width: childrenRect.width
Button {
id: installButton
@ -54,7 +52,7 @@ Rectangle
{
if ( manager.isDownloading )
{
return pluginList.activePlugin == model ? true : false
return manager.activePackage == model ? true : false
}
else
{
@ -79,19 +77,20 @@ Rectangle
}
onClicked:
{
if ( manager.isDownloading && pluginList.activePlugin == model )
console.log( "MODEL", model.download_url )
if ( manager.isDownloading && manager.activePackage == model )
{
manager.cancelDownload();
}
else
{
pluginList.activePlugin = model;
// manager.activePackage = model;
if ( model.can_upgrade )
{
manager.downloadAndInstallPlugin( model.update_url );
// manager.downloadAndInstallPlugin( model.update_url );
}
else {
manager.downloadAndInstallPlugin( model.file_location );
manager.startDownload( model.download_url );
}
}
}
@ -102,6 +101,6 @@ Rectangle
color: UM.Theme.getColor("text_medium")
width: parent.width
height: UM.Theme.getSize("default_lining").height
anchors.top: parent.top
anchors.bottom: parent.bottom
}
}

2
plugins/Toolbox/resources/qml/ToolboxDownloadsGrid.qml
View file

@ -28,7 +28,7 @@ Column
{
id: grid
width: parent.width
columns: 3
columns: 2
columnSpacing: UM.Theme.getSize("base_unit").width
rowSpacing: UM.Theme.getSize("base_unit").height

23
plugins/Toolbox/resources/qml/ToolboxDownloadsGridTile.qml
View file

@ -14,6 +14,13 @@ Item
id: base
height: childrenRect.height
Layout.alignment: Qt.AlignTop | Qt.AlignLeft
Rectangle
{
id: highlight
anchors.fill: parent
opacity: 0.0
color: UM.Theme.getColor("primary")
}
Row
{
width: parent.width
@ -68,17 +75,31 @@ Item
MouseArea
{
anchors.fill: parent
onClicked: {
hoverEnabled: true
onEntered:
{
thumbnail.border.color = UM.Theme.getColor("primary")
highlight.opacity = 0.1
}
onExited:
{
thumbnail.border.color = UM.Theme.getColor("text")
highlight.opacity = 0.0
}
onClicked:
{
if ( manager.viewCategory == "material" )
{
manager.viewSelection = model.name
manager.viewPage = "author"
manager.filterAuthors("name", model.name)
manager.filterPackages("author_name", model.name)
}
else
{
manager.viewSelection = model.id
manager.viewPage = "detail"
manager.filterAuthors("name", model.author_name)
manager.filterPackages("id", model.id)
}
}

2
plugins/Toolbox/resources/qml/ToolboxDownloadsShowcaseTile.qml
View file

@ -55,12 +55,14 @@ Item
{
manager.viewSelection = model.name
manager.viewPage = "author"
manager.filterAuthors("name", model.name)
manager.filterPackages("author_name", model.name)
}
else
{
manager.viewSelection = model.id
manager.viewPage = "detail"
manager.filterAuthors("name", model.author_name)
manager.filterPackages("id", model.id)
}
}