GitHub-Proxy/Cura
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/Ultimaker/Cura synced 2025-08-15 21:26:06 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add shadow to ExpandableComponent

Browse Source
This commit is contained in:
Jaime van Kessel 2018-11-27 11:58:32 +01:00
parent 75b827d373
commit 44c415ff78
2 changed files with 23 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
resources/qml/ExpandableComponent.qml
View File

@ -4,6 +4,8 @@ import QtQuick.Controls 2.3
import UM 1.2 as UM import UM 1.2 as UM
import Cura 1.0 as Cura import Cura 1.0 as Cura
import QtGraphicalEffects 1.0 // For the dropshadow
// The expandable component has 3 major sub components: // The expandable component has 3 major sub components:
// * The headerItem; Always visible and should hold some info about what happens if the component is expanded // * The headerItem; Always visible and should hold some info about what happens if the component is expanded
// * The popupItem; The content that needs to be shown if the component is expanded. // * The popupItem; The content that needs to be shown if the component is expanded.
@ -58,6 +60,12 @@ Item
// On what side should the header corners be shown? 1 is down, 2 is left, 3 is up and 4 is right. // On what side should the header corners be shown? 1 is down, 2 is left, 3 is up and 4 is right.
property alias headerCornerSide: background.cornerSide property alias headerCornerSide: background.cornerSide
property alias headerShadowColor: shadow.color
property alias enableHeaderShadow: shadow.visible
property int shadowOffset: 2
function togglePopup() function togglePopup()
{ {
if(popup.visible) if(popup.visible)
@ -149,13 +157,26 @@ Item
onExited: background.color = headerBackgroundColor onExited: background.color = headerBackgroundColor
} }
} }
DropShadow
{
id: shadow
// Don't blur the shadow
radius: 0
anchors.fill: background
source: background
verticalOffset: base.shadowOffset
visible: true
color: UM.Theme.getColor("action_button_shadow")
// Should always be drawn behind the background.
z: background.z - 1
}
Popup Popup
{ {
id: popup id: popup
// Ensure that the popup is located directly below the headerItem // Ensure that the popup is located directly below the headerItem
y: headerItemLoader.height + 2 * background.padding y: headerItemLoader.height + 2 * background.padding + base.shadowOffset
// Make the popup aligned with the rest, using the property popupAlignment to decide whether is right or left. // Make the popup aligned with the rest, using the property popupAlignment 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. // In case of right alignment, the 3x padding is due to left, right and padding between the button & text.

2
resources/themes/cura-light/theme.json
View File

@ -178,7 +178,7 @@
"action_button_disabled": [245, 245, 245, 255], "action_button_disabled": [245, 245, 245, 255],
"action_button_disabled_text": [127, 127, 127, 255], "action_button_disabled_text": [127, 127, 127, 255],
"action_button_disabled_border": [245, 245, 245, 255], "action_button_disabled_border": [245, 245, 245, 255],
"action_button_shadow": [64, 47, 205, 255], "action_button_shadow": [223, 223, 223, 255],
"action_button_disabled_shadow": [228, 228, 228, 255], "action_button_disabled_shadow": [228, 228, 228, 255],
"scrollbar_background": [255, 255, 255, 255], "scrollbar_background": [255, 255, 255, 255],