Kirigami2

OverlayDrawer.qml
1 /*
2  * SPDX-FileCopyrightText: 2016 Marco Martin <[email protected]>
3  *
4  * SPDX-License-Identifier: LGPL-2.0-or-later
5  */
6 
7 import QtQuick 2.1
8 import QtQuick.Templates 2.0 as T2
9 import org.kde.kirigami 2.15 as Kirigami
10 import "private" as P
11 import "templates" as T
12 
13 /**
14  * Overlay Drawers are used to expose additional UI elements needed for
15  * small secondary tasks for which the main UI elements are not needed.
16  * For example in Okular Mobile, an Overlay Drawer is used to display
17  * thumbnails of all pages within a document along with a search field.
18  * This is used for the distinct task of navigating to another page.
19  *
20  * @inherit org::kde::kirigami::templates::OverlayDrawer
21  */
22 T.OverlayDrawer {
23  id: root
24 
25 //BEGIN Properties
26  focus: false
27  modal: true
28  drawerOpen: !modal
29  closePolicy: modal ? T2.Popup.CloseOnEscape | T2.Popup.CloseOnReleaseOutside : T2.Popup.CloseOnEscape
30  handleVisible: interactive && (modal || !drawerOpen) && (typeof(applicationWindow)===typeof(Function) && applicationWindow() ? applicationWindow().controlsVisible : true)
31 
32  // FIXME: set to false when it does not lead to blocking closePolicy.
33  // See Kirigami bug: 454119
34  interactive: true
35 
36  onPositionChanged: {
37  if (!modal && !root.peeking && !root.animating) {
38  position = 1;
39  }
40  }
41 
42  background: Rectangle {
43  color: Kirigami.Theme.backgroundColor
44 
45  Item {
46  parent: root.handle
47  anchors.fill: parent
48 
49  Kirigami.ShadowedRectangle {
50  id: handleGraphics
51  anchors.centerIn: parent
52 
53  Kirigami.Theme.colorSet: parent.parent.handleAnchor && parent.parent.handleAnchor.visible ? parent.parent.handleAnchor.Kirigami.Theme.colorSet : Kirigami.Theme.Button
54 
55  Kirigami.Theme.backgroundColor: parent.parent.handleAnchor && parent.parent.handleAnchor.visible ? parent.parent.handleAnchor.Kirigami.Theme.backgroundColor : undefined
56 
57  Kirigami.Theme.textColor: parent.parent.handleAnchor && parent.parent.handleAnchor.visible ? parent.parent.handleAnchor.Kirigami.Theme.textColor : undefined
58 
59  Kirigami.Theme.inherit: false
60  color: root.handle.pressed ? Kirigami.Theme.highlightColor : Kirigami.Theme.backgroundColor
61 
62  visible: !parent.parent.handleAnchor || !parent.parent.handleAnchor.visible || root.handle.pressed || (root.modal && root.position > 0)
63 
64  shadow.color: Qt.rgba(0, 0, 0, root.handle.pressed ? 0.6 : 0.4)
65  shadow.yOffset: 1
66  shadow.size: Kirigami.Units.gridUnit / 2
67 
68  width: Kirigami.Units.iconSizes.smallMedium + Kirigami.Units.smallSpacing * 2
69  height: width
70  radius: 2
71  Behavior on color {
72  ColorAnimation {
73  duration: Kirigami.Units.longDuration
74  easing.type: Easing.InOutQuad
75  }
76  }
77  }
78  Loader {
79  anchors.centerIn: handleGraphics
80  width: height
81  height: Kirigami.Units.iconSizes.smallMedium
82 
83  Kirigami.Theme.colorSet: handleGraphics.Kirigami.Theme.colorSet
84  Kirigami.Theme.backgroundColor: handleGraphics.Kirigami.Theme.backgroundColor
85  Kirigami.Theme.textColor: handleGraphics.Kirigami.Theme.textColor
86 
87  asynchronous: true
88 
89  source: {
90  let edge = root.edge;
91  if (Qt.application.layoutDirection === Qt.RightToLeft) {
92  if (edge === Qt.LeftEdge) {
93  edge = Qt.RightEdge;
94  } else {
95  edge = Qt.LeftEdge;
96  }
97  }
98 
99  if ((root.handleClosedIcon.source || root.handleClosedIcon.name)
100  && (root.handleOpenIcon.source || root.handleOpenIcon.name)) {
101  return Qt.resolvedUrl("templates/private/GenericDrawerIcon.qml");
102  } else if (edge === Qt.LeftEdge ) {
103  return Qt.resolvedUrl("templates/private/MenuIcon.qml");
104  } else if(edge === Qt.RightEdge && root.hasOwnProperty("actions")) {
105  return Qt.resolvedUrl("templates/private/ContextIcon.qml");
106  } else {
107  return "";
108  }
109  }
110  onItemChanged: {
111  if (item) {
112  item.drawer = Qt.binding(function(){return root});
113  item.color = Qt.binding(function(){return root.handle.pressed ? Kirigami.Theme.highlightedTextColor : Kirigami.Theme.textColor});
114  }
115  }
116  }
117  }
118 
119  Kirigami.Separator {
120  LayoutMirroring.enabled: false
121  // LayoutMirroring.childrenInherit: true
122  anchors {
123  right: root.edge === Qt.RightEdge ? parent.left : (root.edge === Qt.LeftEdge ? undefined : parent.right)
124  left: root.edge === Qt.LeftEdge ? parent.right : (root.edge === Qt.RightEdge ? undefined : parent.left)
125  top: root.edge === Qt.TopEdge ? parent.bottom : (root.edge === Qt.BottomEdge ? undefined : parent.top)
126  bottom: root.edge === Qt.BottomEdge ? parent.top : (root.edge === Qt.TopEdge ? undefined : parent.bottom)
127  }
128  visible: !root.modal
129  }
130  P.EdgeShadow {
131  z: -2
132  visible: root.modal
133  edge: root.edge
134  anchors {
135  right: root.edge === Qt.RightEdge ? parent.left : (root.edge === Qt.LeftEdge ? undefined : parent.right)
136  left: root.edge === Qt.LeftEdge ? parent.right : (root.edge === Qt.RightEdge ? undefined : parent.left)
137  top: root.edge === Qt.TopEdge ? parent.bottom : (root.edge === Qt.BottomEdge ? undefined : parent.top)
138  bottom: root.edge === Qt.BottomEdge ? parent.top : (root.edge === Qt.TopEdge ? undefined : parent.bottom)
139  }
140 
141  opacity: root.position === 0 ? 0 : 1
142 
143  Behavior on opacity {
144  NumberAnimation {
145  duration: Kirigami.Units.longDuration
146  easing.type: Easing.InOutQuad
147  }
148  }
149  }
150  }
151 }
This file is part of the KDE documentation.
Documentation copyright © 1996-2023 The KDE developers.
Generated on Sun Jan 29 2023 04:11:03 by doxygen 1.8.17 written by Dimitri van Heesch, © 1997-2006

KDE's Doxygen guidelines are available online.