Start implementing new Cura design

This commit is contained in:
Arjen Hiemstra 2015-03-26 14:33:10 +01:00
parent 89a035bab4
commit fb580627fb
10 changed files with 544 additions and 218 deletions

View file

@ -8,18 +8,31 @@ import UM 1.0 as UM
Rectangle {
id: base;
color: UM.Styles.primaryColor;
border.width: 1;
border.color: UM.Styles.borderColor;
color: UM.Theme.colors.primary;
signal saveRequested();
signal saveToSDRequested();
Image {
id: icon;
anchors.left: parent.left;
anchors.top: parent.top;
anchors.bottom: parent.bottom;
width: height;
sourceSize.width: width;
sourceSize.height: height;
source: UM.Theme.icons.save;
}
Label {
id: label;
anchors.verticalCenter: parent.verticalCenter;
anchors.left: parent.left;
anchors.right: icon.left;
anchors.left: icon.left;
anchors.right: parent.right;
horizontalAlignment: Text.AlignHCenter;
font.pointSize: UM.Styles.largeTextSize;
color: "white";
@ -28,27 +41,6 @@ Rectangle {
text: qsTr("Save");
}
Rectangle {
id: icon;
anchors.right: parent.right;
anchors.top: parent.top;
anchors.bottom: parent.bottom;
anchors.margins: 1;
color: "white";
width: height;
Rectangle {
anchors { left: parent.left; top: parent.top; bottom: parent.bottom; }
width: 1;
color: UM.Styles.borderColor;
}
UM.RecolorImage { id: iconImage; anchors.centerIn: parent; width: 32; height: 32; source: UM.Resources.getIcon('save.png'); color: '#000'; }
}
MouseArea {
anchors.fill: parent;

View file

@ -68,9 +68,8 @@ UM.MainWindow {
MenuSeparator { }
MenuItem { action: actions.addMachine; }
MenuItem { action: actions.settings; }
MenuItem { action: actions.configureMachines; }
}
Menu {
@ -117,70 +116,20 @@ UM.MainWindow {
}
}
PrinterToolbar {
id: toolbar;
Sidebar {
id: sidebar;
anchors {
left: parent.left;
right: parent.right;
top: parent.top;
bottom: parent.bottom;
right: parent.right;
rightMargin: UM.Theme.sizes.window_margin.width;
}
undo: actions.undo;
redo: actions.redo;
settings: actions.settings;
}
width: UM.Theme.sizes.panel.width;
FilePane {
id: files;
anchors.left: parent.left;
anchors.leftMargin: UM.Styles.windowLeftMargin;
anchors.top: toolbar.bottom;
anchors.topMargin: -1;
border.width: 1;
border.color: UM.Styles.borderColor;
width: UM.Styles.panelWidth;
height: base.height / 2 - UM.Styles.toolbarHeight;
onRequestOpenFile: actions.open.trigger();
onOpenFile: UM.Controller.addMesh(file);
}
SettingsPane {
id: settings;
anchors.right: parent.right;
anchors.rightMargin: UM.Styles.windowRightMargin;
anchors.top: toolbar.bottom;
anchors.topMargin: -1;
border.width: 1;
border.color: UM.Styles.borderColor;
width: UM.Styles.panelWidth;
expandedHeight: base.height;
onShowDescription: {
descriptionPane.show(text, x, y - contentItem.y);
}
}
OutputGCodeButton {
anchors.right: parent.right;
anchors.rightMargin: UM.Styles.windowRightMargin;
anchors.bottom: parent.bottom;
anchors.bottomMargin: -1;
width: UM.Styles.panelWidth;
height: 40;
onSaveRequested: actions.save.trigger();
onSaveToSDRequested: Printer.saveToSD()
addMachineAction: actions.addMachine;
configureMachinesAction: actions.configureMachines;
}
UM.MessageStack {
@ -194,6 +143,61 @@ UM.MainWindow {
id: descriptionPane;
anchors.right: settings.left;
}
PrinterButton {
id: openFileButton;
iconSource: UM.Theme.icons.open;
anchors {
top: parent.top;
topMargin: UM.Theme.sizes.window_margin.height;
left: parent.left;
leftMargin: UM.Theme.sizes.window_margin.width;
}
action: actions.open;
}
PrinterButton {
anchors {
top: parent.top;
topMargin: UM.Theme.sizes.window_margin.height;
right: sidebar.left;
rightMargin: UM.Theme.sizes.window_margin.width;
}
//: View Mode toolbar button
text: qsTr("View Mode");
iconSource: UM.Theme.icons.viewmode;
menu: Menu {
id: viewMenu;
Instantiator {
model: UM.Models.viewModel;
MenuItem {
text: model.name;
checkable: true;
checked: model.active;
exclusiveGroup: viewMenuGroup;
onTriggered: UM.Controller.setActiveView(model.id);
}
onObjectAdded: viewMenu.insertItem(index, object)
onObjectRemoved: viewMenu.removeItem(object)
}
ExclusiveGroup { id: viewMenuGroup; }
}
}
PrinterToolbar {
anchors {
left: parent.left;
leftMargin: UM.Theme.sizes.window_margin.width;
bottom: parent.bottom;
bottomMargin: UM.Theme.sizes.window_margin.height;
}
}
}
}
@ -249,7 +253,7 @@ UM.MainWindow {
addMachine.onTriggered: addMachine.visible = true;
preferences.onTriggered: preferences.visible = true;
settings.onTriggered: { preferences.visible = true; preferences.setPage(1); }
configureMachines.onTriggered: { preferences.visible = true; preferences.setPage(1); }
}
Menu {

View file

@ -22,7 +22,7 @@ Item {
property alias resetAll: resetAllAction;
property alias addMachine: addMachineAction;
property alias settings: settingsAction;
property alias configureMachines: settingsAction;
property alias preferences: preferencesAction;
property alias help: helpAction;

10
qml/PrinterButton.qml Normal file
View file

@ -0,0 +1,10 @@
import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Controls.Styles 1.1
import QtQuick.Layouts 1.1
import UM 1.0 as UM
Button {
style: UM.Theme.styles.tool_button;
}

View file

@ -5,44 +5,19 @@ import QtQuick.Layouts 1.1
import UM 1.0 as UM
UM.Toolbar {
RowLayout {
id: base;
property Action undo;
property Action redo;
property Action settings;
Item { width: UM.Styles.windowLeftMargin; }
Item {
width: UM.Styles.panelWidth;
Image { anchors.centerIn: parent; source: UM.Resources.getIcon("cura_logo.png"); }
}
Item { width: UM.Styles.toolbarSpacing; }
ToolButton { style: UM.ToolbarButtonStyle { } action: base.undo; iconSource: UM.Resources.getIcon('undo.png'); }
ToolButton { style: UM.ToolbarButtonStyle { } action: base.redo; iconSource: UM.Resources.getIcon('redo.png'); }
// Item { width: 10; }
// ToolButton { text: "3D"; onClicked: UM.Scene.setActiveCamera('3d'); }
// ToolButton { text: "Left"; onClicked: UM.Scene.setActiveCamera('left'); }
// ToolButton { text: "Top"; onClicked: UM.Scene.setActiveCamera('top'); }
// ToolButton { text: "Front"; onClicked: UM.Scene.setActiveCamera('front'); }
Item { Layout.fillWidth: true; }
spacing: UM.Theme.sizes.default_margin.width * 2;
Repeater {
id: repeat
model: UM.Models.toolModel
ToolButton {
style: UM.ToolbarButtonStyle { }
PrinterButton {
text: model.name;
iconSource: UM.Resources.getIcon(model.icon);
iconSource: UM.Theme.icons[model.icon];
tooltip: model.description;
checkable: true;
@ -56,105 +31,4 @@ UM.Toolbar {
}
}
}
Item { Layout.fillWidth: true; }
ToolButton {
//: View Mode toolbar button
text: qsTr("View Mode");
iconSource: UM.Resources.getIcon("viewmode.png");
style: UM.ToolbarButtonStyle { }
menu: Menu {
id: viewMenu;
Instantiator {
model: UM.Models.viewModel;
MenuItem {
text: model.name;
checkable: true;
checked: model.active;
exclusiveGroup: viewMenuGroup;
onTriggered: UM.Controller.setActiveView(model.id);
}
onObjectAdded: viewMenu.insertItem(index, object)
onObjectRemoved: viewMenu.removeItem(object)
}
ExclusiveGroup { id: viewMenuGroup; }
}
}
Item { width: UM.Styles.toolbarSpacing; }
ToolButton {
id: machineButton;
width: UM.Styles.panelWidth - UM.Styles.toolbarButtonWidth - 1;
height: UM.Styles.toolbarButtonHeight;
text: UM.Application.machineName;
style: UM.ToolbarButtonStyle {
backgroundColor: "white";
backgroundHighlightColor: "#eee";
label: Item {
anchors.fill: parent;
Label {
anchors {
top: parent.top;
topMargin: 2;
left: parent.left;
right: parent.right;
}
text: control.text;
elide: Text.ElideRight;
fontSizeMode: Text.HorizontalFit;
minimumPointSize: UM.Styles.smallTextSize;
font.pointSize: UM.Styles.largeTextSize;
verticalAlignment: Text.AlignBottom;
}
Label {
anchors.bottom: parent.bottom;
anchors.bottomMargin: 2;
anchors.left: parent.left;
//: Machine toolbar button
text: qsTr("Machine");
font.pointSize: UM.Styles.tinyTextSize;
font.capitalization: Font.AllUppercase;
}
}
}
menu: Menu {
id: machineMenu;
Instantiator {
model: UM.Models.machinesModel
MenuItem {
text: model.name;
checkable: true;
checked: model.active;
exclusiveGroup: machineMenuGroup;
onTriggered: UM.Models.machinesModel.setActive(index)
}
onObjectAdded: machineMenu.insertItem(index, object)
onObjectRemoved: machineMenu.removeItem(object)
}
ExclusiveGroup { id: machineMenuGroup; }
}
}
ToolButton {
style: UM.ToolbarButtonStyle {
backgroundColor: "white";
foregroundColor: "black";
backgroundHighlightColor: "#eee";
foregroundHighlightColor: "black";
}
action: base.settings;
iconSource: UM.Resources.getIcon("settings.png");
}
Item { width: UM.Styles.windowRightMargin; }
}

54
qml/Sidebar.qml Normal file
View file

@ -0,0 +1,54 @@
import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Controls.Styles 1.1
import QtQuick.Layouts 1.1
import UM 1.0 as UM
Rectangle {
id: base;
property Action addMachineAction;
property Action configureMachinesAction;
MouseArea {
anchors.fill: parent
acceptedButtons: Qt.AllButtons;
onWheel: {
wheel.accepted = true;
}
}
ColumnLayout {
anchors.fill: parent;
anchors.topMargin: UM.Theme.sizes.default_margin.height;
anchors.bottomMargin: UM.Theme.sizes.default_margin.height;
spacing: UM.Theme.sizes.default_margin.height;
SidebarHeader {
id: header;
Layout.fillWidth: true;
addMachineAction: base.addMachineAction;
configureMachinesAction: base.configureMachinesAction;
}
Loader {
id: sidebarContents;
Layout.fillWidth: true;
Layout.fillHeight: true;
source: header.currentModeFile;
}
OutputGCodeButton {
Layout.preferredWidth: base.width - UM.Theme.sizes.default_margin.width * 2;
Layout.preferredHeight: UM.Theme.sizes.section.height;
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter;
}
}
}

186
qml/SidebarAdvanced.qml Normal file
View file

@ -0,0 +1,186 @@
import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Controls.Styles 1.1
import QtQuick.Layouts 1.1
import UM 1.0 as UM
UM.SettingsView {
id: settingsView;
onShowDescription: base.showDescription(text, x, y);
}
//
// Rectangle {
// id: base;
//
// height: childrenRect.height;
//
// signal showDescription(string text, real x, real y);
//
//
//
// Column {
// id: contents;
//
// anchors {
// left: parent.left;
// leftMargin: UM.Theme.defaultMargin;
// right: parent.right;
// rightMargin: UM.Theme.defaultMargin;
// }
//
// //: Print Settings panel title
// Label { text: qsTr("Print Settings"); width: parent.width; font.capitalization: Font.AllUppercase; font.pointSize: UM.Theme.smallTextSize; }
//
// Item {
// width: parent.width;
// height: 24;
//
// Row {
// anchors.fill: parent;
// spacing: UM.Theme.defaultMargin;
//
// //: Material selection combo box label
// Label { text: qsTr("Material"); horizontalAlignment: Text.AlignRight; width: base.width * 0.5; }
// ComboBox {
// width: parent.width * 0.35;
// model: ListModel {
// ListElement { text: "PLA"; }
// ListElement { text: "ABS"; }
// }
// style: ComboBoxStyle { }
// }
// }
// }
//
// Item {
// width: parent.width;
// height: 24;
//
// Row {
// anchors.fill: parent;
// spacing: UM.Theme.defaultMargin;
// //: Time display label
// Label { text: qsTr("Time"); width: base.width * 0.5; horizontalAlignment: Text.AlignRight; }
// Label { text: Qt.formatTime(new Date(timeSlider.value * 60000)); width: base.width * 0.35; horizontalAlignment: Text.AlignLeft; }
// }
// }
//
// Rectangle { color: "black"; height: 1; width: parent.width; }
//
// Item {
// id: speedSlider;
//
// width: parent.width;
// height: 60;
//
// Slider {
// id: timeSlider;
// anchors.left: parent.left;
// anchors.right: parent.right;
// height: 20;
//
// minimumValue: 60;
// maximumValue: 600;
// stepSize: 10;
//
// style: SliderStyle {
// groove: Rectangle {
// height: 1;
// color: "black";
//
// Rectangle {
// anchors.left: parent.left;
// anchors.verticalCenter: parent.verticalCenter;
// width: 1;
// height: control.height;
// color: "black";
// }
// Rectangle {
// anchors.right: parent.right;
// anchors.verticalCenter: parent.verticalCenter;
// width: 1;
// height: control.height;
// color: "black";
// }
// }
// handle: Rectangle { width: 5; height: control.height; color: UM.Theme.primaryColor; }
// }
// }
//
// Column {
// anchors.left: parent.left;
// anchors.bottom: parent.bottom;
//
// Label { text: Qt.formatTime(new Date(timeSlider.minimumValue * 60000)); }
// //: Low quality display label
// Label { text: qsTr("Low Quality"); }
// }
//
// Column {
// anchors.right: parent.right;
// anchors.bottom: parent.bottom;
//
// Label { text: Qt.formatTime(new Date(timeSlider.maximumValue * 60000)); anchors.right: parent.right; }
// //: High quality display label
// Label { text: qsTr("High Quality"); }
// }
// }
//
// UM.SettingsView {
// id: settingsView;
//
// width: parent.width;
// height: 0;
// opacity: 0;
// visible: false;
//
// onShowDescription: base.showDescription(text, x, y);
// }
//
// Rectangle { color: "black"; height: 1; width: parent.width; }
//
// Item {
// Layout.columnSpan: 2;
// height: childrenRect.height;
// width: parent.width;
//
// ToolButton {
// anchors.horizontalCenter: parent.horizontalCenter;
// iconSource: UM.Resources.getIcon('expand.png');
// onClicked: base.collapsed = !base.collapsed
// }
// }
// }
//
// states: [
// State {
// name: 'expanded';
// when: !base.collapsed;
//
// PropertyChanges { target: speedSlider; opacity: 0; height: 0; visible: false; }
// PropertyChanges {
// target: settingsView;
// opacity: 1;
// height: Math.min(settingsView.listHeight, base.expandedHeight * 0.6);
// visible: true;
// }
// }
// ]
//
// transitions: [
// Transition {
// to: 'expanded';
// reversible: true;
// SequentialAnimation {
// NumberAnimation { target: speedSlider; property: 'opacity'; duration: 100; }
// PropertyAction { target: settingsView; property: 'visible'; }
// NumberAnimation { property: 'height'; duration: 200; }
// PropertyAction { target: speedSlider; property: 'visible'; }
// NumberAnimation { target: settingsView; property: 'opacity'; duration: 100; }
// }
// }
// ]
// }
//

View file

@ -0,0 +1,46 @@
import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Controls.Styles 1.1
import QtQuick.Layouts 1.1
import UM 1.0 as UM
Rectangle {
Layout.preferredHeight: UM.Theme.sizes.section.height;
Layout.preferredWidth: UM.Theme.sizes.section.width;
color: UM.Theme.colors.primary;
property alias icon: iconImage.source;
property alias text: label.text;
Image {
id: iconImage;
anchors {
left: parent.left;
leftMargin: UM.Theme.sizes.default_margin.width;
verticalCenter: parent.verticalCenter;
}
width: UM.Theme.sizes.section_icon.width;
height: UM.Theme.sizes.section_icon.width;
sourceSize.width: width;
sourceSize.height: height;
}
Label {
id: label
anchors {
left: iconImage.right;
leftMargin: UM.Theme.sizes.default_margin.width;
right: parent.right;
rightMargin: UM.Theme.sizes.default_margin.width;
verticalCenter: parent.verticalCenter;
}
font: UM.Theme.fonts.large;
color: UM.Theme.colors.primary_text;
}
}

117
qml/SidebarHeader.qml Normal file
View file

@ -0,0 +1,117 @@
import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Controls.Styles 1.1
import QtQuick.Layouts 1.1
import UM 1.0 as UM
Column {
id: base;
property string currentModeFile: modeModel.get(modeMenu.currentIndex).file;
property Action addMachineAction;
property Action configureMachinesAction;
spacing: UM.Theme.sizes.default_margin.height;
RowLayout {
anchors.horizontalCenter: parent.horizontalCenter;
width: parent.width - UM.Theme.sizes.default_margin.width * 2;
height: UM.Theme.sizes.line.height;
Label {
text: qsTr("Mode:");
font: UM.Theme.fonts.sidebar_header;
color: UM.Theme.colors.text_inactive;
}
ToolButton {
text: qsTr(modeModel.get(modeMenu.currentIndex).text);
style: UM.Theme.styles.sidebar_header_button;
Layout.preferredWidth: base.width * 0.25;
menu: Menu {
id: modeMenu;
property int currentIndex: 0;
Instantiator {
model: ListModel {
id: modeModel;
ListElement { text: QT_TR_NOOP("Simple"); file: "SidebarSimple.qml" }
ListElement { text: QT_TR_NOOP("Advanced"); file: "SidebarAdvanced.qml" }
}
MenuItem {
text: qsTr(model.text);
checkable: true;
checked: modeMenu.currentIndex == index;
exclusiveGroup: modeMenuGroup;
onTriggered: modeMenu.currentIndex = index;
}
onObjectAdded: modeMenu.insertItem(index, object)
onObjectRemoved: modeMenu.removeItem(object)
}
ExclusiveGroup { id: modeMenuGroup; }
}
}
Rectangle {
width: 1;
height: parent.height;
color: UM.Theme.colors.border;
}
Label {
text: qsTr("Printer:");
font: UM.Theme.fonts.sidebar_header;
color: UM.Theme.colors.text_inactive;
}
ToolButton {
id: machineButton;
text: UM.Application.machineName;
style: UM.Theme.styles.sidebar_header_button;
Layout.fillWidth: true;
menu: Menu {
id: machineMenu;
Instantiator {
model: UM.Models.machinesModel
MenuItem {
text: model.name;
checkable: true;
checked: model.active;
exclusiveGroup: machineMenuGroup;
onTriggered: UM.Models.machinesModel.setActive(index)
}
onObjectAdded: machineMenu.insertItem(index, object)
onObjectRemoved: machineMenu.removeItem(object)
}
ExclusiveGroup { id: machineMenuGroup; }
MenuSeparator { }
MenuItem { action: base.addMachineAction; }
MenuItem { action: base.configureMachinesAction; }
}
}
}
SidebarCategoryHeader {
width: parent.width;
height: UM.Theme.sizes.section.height;
icon: UM.Theme.icons.printsetup;
text: qsTr("Print Setup");
}
}

43
qml/SidebarSimple.qml Normal file
View file

@ -0,0 +1,43 @@
import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Controls.Styles 1.1
import QtQuick.Layouts 1.1
import UM 1.0 as UM
Item {
anchors.fill: parent;
anchors.leftMargin: UM.Theme.sizes.default_margin.width;
anchors.rightMargin: UM.Theme.sizes.default_margin.width;
ColumnLayout {
anchors.fill: parent;
RowLayout {
Layout.fillWidth: true;
Label { text: "00:00"; }
Item { Layout.fillWidth: true; }
Label { text: "Estimated Print Time"; }
Item { Layout.fillWidth: true; }
Label { text: "21:00"; }
}
Slider {
Layout.fillWidth: true;
style: SliderStyle { }
}
RowLayout {
Layout.fillWidth: true;
Label { text: "Minimum"; }
Item { Layout.fillWidth: true; }
Label { text: "Maximum"; }
}
CheckBox { text: "Auto Support"; style: CheckBoxStyle { } }
Item { Layout.fillWidth: true; Layout.fillHeight: true; }
}
}