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

Make the expandable content header to be a common header for every expandable component.

Browse source 
Contributes to CURA-5941.
This commit is contained in:
Diego Prado Gesto 2018-12-10 13:36:06 +01:00
parent dff364ee30
commit af37f51cf8
7 changed files with 64 additions and 101 deletions
Download patch file Download diff file Expand all files Collapse all files

1
plugins/SimulationView/SimulationViewMenuComponent.qml
View file

@ -16,6 +16,7 @@ Cura.ExpandableComponent
id: base
width: UM.Theme.getSize("layerview_menu_size").width
contentHeaderTitle: catalog.i18nc("@label", "Color scheme")
Connections
{

68
resources/qml/ExpandableComponent.qml
View file

@ -1,3 +1,6 @@
// Copyright (c) 2018 Ultimaker B.V.
// Cura is released under the terms of the LGPLv3 or higher.
import QtQuick 2.7
import QtQuick.Controls 2.3
@ -40,6 +43,9 @@ Item
// How much spacing is needed around the contentItem
property alias contentPadding: content.padding
// Adds a title to the content item
property alias contentHeaderTitle: contentHeader.headerTitle
// How much spacing is needed for the contentItem by Y coordinate
property var contentSpacingY: UM.Theme.getSize("narrow_margin").width
@ -55,7 +61,7 @@ Item
property alias iconSize: collapseButton.height
// Is the "drawer" open?
readonly property alias expanded: content.visible
readonly property alias expanded: contentContainer.visible
// What should the radius of the header be. This is also influenced by the headerCornerSide
property alias headerRadius: background.radius
@ -71,7 +77,7 @@ Item
function toggleContent()
{
content.visible = !expanded
contentContainer.visible = !expanded
}
// Add this binding since the background color is not updated otherwise
@ -147,10 +153,13 @@ Item
z: background.z - 1
}
Control
Cura.RoundedRectangle
{
id: content
id: contentContainer
visible: false
width: childrenRect.width
height: childrenRect.height
// Ensure that the content is located directly below the headerItem
y: background.height + base.shadowOffset + base.contentSpacingY
@ -158,25 +167,42 @@ Item
// Make the content aligned with the rest, using the property contentAlignment to decide whether is right or left.
// In case of right alignment, the 3x padding is due to left, right and padding between the button & text.
x: contentAlignment == ExpandableComponent.ContentAlignment.AlignRight ? -width + collapseButton.width + headerItemLoader.width + 3 * background.padding : 0
padding: UM.Theme.getSize("default_margin").width
background: Cura.RoundedRectangle
cornerSide: Cura.RoundedRectangle.Direction.All
color: contentBackgroundColor
border.width: UM.Theme.getSize("default_lining").width
border.color: UM.Theme.getColor("lining")
radius: UM.Theme.getSize("default_radius").width
ExpandableComponentHeader
{
cornerSide: Cura.RoundedRectangle.Direction.All
color: contentBackgroundColor
border.width: UM.Theme.getSize("default_lining").width
border.color: UM.Theme.getColor("lining")
radius: UM.Theme.getSize("default_radius").width
id: contentHeader
headerTitle: ""
anchors
{
top: parent.top
right: parent.right
left: parent.left
}
}
contentItem: Item {}
onContentItemChanged:
Control
{
// Since we want the size of the content to be set by the size of the content,
// we need to do it like this.
content.width = contentItem.width + 2 * content.padding
content.height = contentItem.height + 2 * content.padding
id: content
anchors.top: contentHeader.bottom
padding: UM.Theme.getSize("default_margin").width
contentItem: Item {}
onContentItemChanged:
{
// Since we want the size of the content to be set by the size of the content,
// we need to do it like this.
content.width = contentItem.width + 2 * content.padding
content.height = contentItem.height + 2 * content.padding
}
}
}
@ -187,6 +213,10 @@ Item
// Since it could be that the content is dynamically populated, we should also take these changes into account.
target: content.contentItem
onWidthChanged: content.width = content.contentItem.width + 2 * content.padding
onHeightChanged: content.height = content.contentItem.height + 2 * content.padding
onHeightChanged:
{
content.height = content.contentItem.height + 2 * content.padding
contentContainer.height = contentHeader.height + content.height
}
}
}

3
resources/qml/ExpandablePopup.qml
View file

@ -1,3 +1,6 @@
// Copyright (c) 2018 Ultimaker B.V.
// Cura is released under the terms of the LGPLv3 or higher.
import QtQuick 2.7
import QtQuick.Controls 2.3

10
resources/qml/PrintSetupSelector/PrintSetupSelector.qml
View file

@ -11,10 +11,11 @@ Cura.ExpandableComponent
{
id: printSetupSelector
property string enabledText: catalog.i18nc("@label:Should be short", "On")
property string disabledText: catalog.i18nc("@label:Should be short", "Off")
property bool preSlicedData: PrintInformation.preSliced
contentPadding: UM.Theme.getSize("default_lining").width
contentHeaderTitle: catalog.i18nc("@label", "Print settings")
enabled: !preSlicedData
UM.I18nCatalog
{
@ -22,10 +23,7 @@ Cura.ExpandableComponent
name: "cura"
}
headerItem: PrintSetupSelectorHeader
{
anchors.fill: parent
}
headerItem: PrintSetupSelectorHeader {}
Cura.ExtrudersModel
{

77
resources/qml/PrintSetupSelector/PrintSetupSelectorContents.qml
View file

@ -12,7 +12,7 @@ import "Custom"
Item
{
id: popup
id: content
width: UM.Theme.getSize("print_setup_widget").width - 2 * UM.Theme.getSize("default_margin").width
height: childrenRect.height
@ -36,79 +36,6 @@ Item
}
onCurrentModeIndexChanged: UM.Preferences.setValue("cura/active_mode", currentModeIndex)
// Header of the popup
Cura.RoundedRectangle
{
id: header
height: UM.Theme.getSize("print_setup_widget_header").height
color: UM.Theme.getColor("secondary")
cornerSide: Cura.RoundedRectangle.Direction.Up
radius: UM.Theme.getSize("default_radius").width
anchors
{
top: parent.top
right: parent.right
left: parent.left
}
Label
{
id: headerLabel
text: catalog.i18nc("@label", "Print settings")
font: UM.Theme.getFont("default")
renderType: Text.NativeRendering
verticalAlignment: Text.AlignVCenter
color: UM.Theme.getColor("text")
height: parent.height
anchors
{
topMargin: UM.Theme.getSize("default_margin").height
left: parent.left
leftMargin: UM.Theme.getSize("default_margin").height
}
}
Button
{
id: closeButton
width: UM.Theme.getSize("message_close").width
height: UM.Theme.getSize("message_close").height
hoverEnabled: true
anchors
{
right: parent.right
rightMargin: UM.Theme.getSize("default_margin").width
verticalCenter: parent.verticalCenter
}
contentItem: UM.RecolorImage
{
anchors.fill: parent
sourceSize.width: width
color: closeButton.hovered ? UM.Theme.getColor("small_button_text_hover") : UM.Theme.getColor("small_button_text")
source: UM.Theme.getIcon("cross1")
}
background: Item {}
onClicked: toggleContent() // Will hide the popup item
}
}
Rectangle
{
id: topSeparator
anchors.bottom: header.bottom
width: parent.width
height: UM.Theme.getSize("default_lining").height
color: UM.Theme.getColor("lining")
}
Item
{
id: contents
@ -118,7 +45,7 @@ Item
anchors
{
top: header.bottom
top: parent.top
left: parent.left
right: parent.right
}

3
resources/qml/PrintSetupSelector/PrintSetupSelectorHeader.qml
View file

@ -10,6 +10,9 @@ import Cura 1.0 as Cura
RowLayout
{
property string enabledText: catalog.i18nc("@label:Should be short", "On")
property string disabledText: catalog.i18nc("@label:Should be short", "Off")
Cura.IconWithText
{
source: UM.Theme.getIcon("category_layer_height")

3
resources/themes/cura-light/theme.json
View file

@ -362,13 +362,14 @@
"print_setup_mode_toggle": [0.0, 2.0],
"print_setup_item": [0.0, 2.0],
"print_setup_extruder_box": [0.0, 6.0],
"print_setup_widget_header": [0.0, 3.0],
"print_setup_slider_groove": [0.16, 0.16],
"print_setup_slider_handle": [1.0, 1.0],
"print_setup_slider_tickmarks": [0.32, 0.32],
"print_setup_big_item": [28, 2.5],
"print_setup_icon": [1.2, 1.2],
"expandable_component_content_header": [0.0, 3.0],
"configuration_selector_mode_tabs": [0.0, 3.0],
"action_panel_widget": [25.0, 0.0],