Merge pull request #5667 from Ultimaker/CURA-6478_drag_expandable_component

Make Expandable Components Draggable [CURA-6478]
This commit is contained in:
Jaime van Kessel 2019-04-26 11:03:52 +02:00 committed by GitHub
commit ac8cca31d1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 147 additions and 16 deletions

View file

@ -78,11 +78,19 @@ Item
property int shadowOffset: 2
// Prefix used for the dragged position preferences. Preferences not used if empty. Don't translate!
property string dragPreferencesNamePrefix: ""
function toggleContent()
{
contentContainer.visible = !expanded
}
function updateDragPosition()
{
contentContainer.trySetPosition(contentContainer.x, contentContainer.y);
}
// Add this binding since the background color is not updated otherwise
Binding
{
@ -102,7 +110,8 @@ Item
{
if (!base.enabled && expanded)
{
toggleContent()
toggleContent();
updateDragPosition();
}
}
}
@ -196,17 +205,19 @@ Item
Cura.RoundedRectangle
{
id: contentContainer
property string dragPreferencesNameX: "_xpos"
property string dragPreferencesNameY: "_ypos"
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
y: dragPreferencesNamePrefix === "" ? (background.height + base.shadowOffset + base.contentSpacingY) : UM.Preferences.getValue(dragPreferencesNamePrefix + dragPreferencesNameY)
// 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
x: dragPreferencesNamePrefix === "" ? (contentAlignment == ExpandableComponent.ContentAlignment.AlignRight ? -width + collapseButton.width + headerItemLoader.width + 3 * background.padding : 0) : UM.Preferences.getValue(dragPreferencesNamePrefix + dragPreferencesNameX)
cornerSide: Cura.RoundedRectangle.Direction.All
color: contentBackgroundColor
@ -214,6 +225,25 @@ Item
border.color: UM.Theme.getColor("lining")
radius: UM.Theme.getSize("default_radius").width
function trySetPosition(posNewX, posNewY)
{
var margin = UM.Theme.getSize("narrow_margin");
var minPt = base.mapFromItem(null, margin.width, margin.height);
var maxPt = base.mapFromItem(null,
CuraApplication.appWidth() - (contentContainer.width + margin.width),
CuraApplication.appHeight() - (contentContainer.height + margin.height));
var initialY = background.height + base.shadowOffset + margin.height;
contentContainer.x = Math.max(minPt.x, Math.min(maxPt.x, posNewX));
contentContainer.y = Math.max(initialY, Math.min(maxPt.y, posNewY));
if (dragPreferencesNamePrefix !== "")
{
UM.Preferences.setValue(dragPreferencesNamePrefix + dragPreferencesNameX, contentContainer.x);
UM.Preferences.setValue(dragPreferencesNamePrefix + dragPreferencesNameY, contentContainer.y);
}
}
ExpandableComponentHeader
{
id: contentHeader
@ -225,6 +255,55 @@ Item
left: parent.left
}
MouseArea
{
id: dragRegion
anchors
{
top: parent.top
bottom: parent.bottom
left: parent.left
right: contentHeader.xPosCloseButton
}
property var clickPos: Qt.point(0, 0)
onPressed:
{
clickPos = Qt.point(mouse.x, mouse.y);
}
onPositionChanged:
{
var delta = Qt.point(mouse.x - clickPos.x, mouse.y - clickPos.y);
if (delta.x !== 0 || delta.y !== 0)
{
contentContainer.trySetPosition(contentContainer.x + delta.x, contentContainer.y + delta.y);
}
}
onDoubleClicked:
{
contentContainer.trySetPosition(0, 0);
}
Connections
{
target: UM.Preferences
onPreferenceChanged:
{
if
(
preference !== "general/window_height" &&
preference !== "general/window_width" &&
preference !== "general/window_state"
)
{
return;
}
contentContainer.trySetPosition(contentContainer.x, contentContainer.y);
}
}
}
}
Control

View file

@ -13,6 +13,7 @@ Cura.RoundedRectangle
id: header
property alias headerTitle: headerLabel.text
property alias xPosCloseButton: closeButton.left
height: UM.Theme.getSize("expandable_component_content_header").height
color: UM.Theme.getColor("secondary")

View file

@ -11,6 +11,8 @@ Cura.ExpandableComponent
{
id: printSetupSelector
dragPreferencesNamePrefix: "view/settings"
property bool preSlicedData: PrintInformation.preSliced
contentPadding: UM.Theme.getSize("default_lining").width

View file

@ -14,6 +14,8 @@ Item
{
id: content
property int absoluteMinimumHeight: 200 * screenScaleFactor
width: UM.Theme.getSize("print_setup_widget").width - 2 * UM.Theme.getSize("default_margin").width
height: contents.height + buttonRow.height
@ -86,8 +88,14 @@ Item
Math.min
(
UM.Preferences.getValue("view/settings_list_height"),
base.height - (customPrintSetup.mapToItem(null, 0, 0).y + buttonRow.height + UM.Theme.getSize("default_margin").height)
Math.max
(
absoluteMinimumHeight,
base.height - (customPrintSetup.mapToItem(null, 0, 0).y + buttonRow.height + UM.Theme.getSize("default_margin").height)
)
);
updateDragPosition();
}
}
visible: currentModeIndex == PrintSetupSelectorContents.Mode.Custom
@ -143,7 +151,11 @@ Item
iconSource: UM.Theme.getIcon("arrow_right")
isIconOnRightSide: true
visible: currentModeIndex == PrintSetupSelectorContents.Mode.Recommended
onClicked: currentModeIndex = PrintSetupSelectorContents.Mode.Custom
onClicked:
{
currentModeIndex = PrintSetupSelectorContents.Mode.Custom
updateDragPosition();
}
}
//Invisible area at the bottom with which you can resize the panel.
@ -171,9 +183,9 @@ Item
// position of mouse relative to dropdown align vertical centre of mouse area to cursor
// v------------------------------v v------------v
var h = mouseY + buttonRow.y + content.y - height / 2 | 0;
if(h < 200 * screenScaleFactor) //Enforce a minimum size.
if(h < absoluteMinimumHeight) //Enforce a minimum size.
{
h = 200 * screenScaleFactor;
h = absoluteMinimumHeight;
}
//Absolute mouse Y position in the window, to prevent it from going outside the window.