Cura/resources/qml/WelcomePages/DropDownWidget.qml
Ghostkeeper fa2fbb99c7
Fix height and scrolling of add printer menus
This fixes the irritating scrolling behaviour of the local printer menu, as well as the disappearing items (former issue which had a workaround) and makes it use a styled scroll bar.

Contributes to issue CURA-8686.
2022-01-19 16:26:48 +01:00

101 lines
3.3 KiB
QML

// Copyright (c) 2022 Ultimaker B.V.
// Cura is released under the terms of the LGPLv3 or higher.
import QtQuick 2.10
import QtQuick.Controls 2.3
import UM 1.5 as UM
import Cura 1.1 as Cura
//
// This is the dropdown list widget in the welcome wizard. The dropdown list has a header bar which is always present,
// and its content whose visibility can be toggled by clicking on the header bar. The content is displayed as an
// expandable dropdown box that will appear below the header bar.
//
// The content is configurable via the property "contentComponent", which will be loaded by a Loader when set.
//
Item
{
UM.I18nCatalog { id: catalog; name: "cura" }
id: base
implicitWidth: 200 * screenScaleFactor
height: header.contentShown ? (header.height + contentRectangle.height) : header.height
property var contentComponent: null
property alias contentItem: contentLoader.item
property alias title: header.title
property bool contentShown: false // indicates if this dropdown widget is expanded to show its content
signal clicked()
Connections
{
target: header
function onClicked()
{
base.contentShown = !base.contentShown
clicked()
}
}
DropDownHeader
{
id: header
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
height: UM.Theme.getSize("expandable_component_content_header").height
rightIconSource: contentShown ? UM.Theme.getIcon("ChevronSingleDown") : UM.Theme.getIcon("ChevronSingleLeft")
contentShown: base.contentShown
}
Cura.RoundedRectangle
{
id: contentRectangle
// Move up a bit (exactly the width of the border) to avoid double line
y: header.height - UM.Theme.getSize("default_lining").width
anchors.left: header.left
anchors.right: header.right
// Add 2x lining, because it needs a bit of space on the top and the bottom.
height: contentLoader.item ? contentLoader.item.height + 2 * UM.Theme.getSize("thick_lining").height : 0
border.width: UM.Theme.getSize("default_lining").width
border.color: UM.Theme.getColor("lining")
color: UM.Theme.getColor("main_background")
radius: UM.Theme.getSize("default_radius").width
visible: base.contentShown
cornerSide: Cura.RoundedRectangle.Direction.Down
Loader
{
id: contentLoader
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
// Keep a small margin with the Rectangle container so its content will not overlap with the Rectangle
// border.
anchors.margins: UM.Theme.getSize("default_lining").width
sourceComponent: base.contentComponent != null ? base.contentComponent : emptyComponent
}
// This is the empty component/placeholder that will be shown when the widget gets expanded.
// It contains a text line "Empty"
Component
{
id: emptyComponent
UM.Label
{
text: catalog.i18nc("@label", "Empty")
height: UM.Theme.getSize("action_button").height
horizontalAlignment: Text.AlignHCenter
font: UM.Theme.getFont("medium")
}
}
}
}