mirror of
https://github.com/subsurface/subsurface.git
synced 2024-12-04 16:11:28 +00:00
235 lines
6.6 KiB
QML
235 lines
6.6 KiB
QML
|
/*
|
||
|
* Copyright 2012 Marco Martin <mart@kde.org>
|
||
|
*
|
||
|
* This program is free software; you can redistribute it and/or modify
|
||
|
* it under the terms of the GNU Library General Public License as
|
||
|
* published by the Free Software Foundation; either version 2, or
|
||
|
* (at your option) any later version.
|
||
|
*
|
||
|
* This program is distributed in the hope that it will be useful,
|
||
|
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||
|
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||
|
* GNU Library General Public License for more details
|
||
|
*
|
||
|
* You should have received a copy of the GNU Library General Public
|
||
|
* License along with this program; if not, write to the
|
||
|
* Free Software Foundation, Inc.,
|
||
|
* 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
|
||
|
*/
|
||
|
|
||
|
import QtQuick 2.1
|
||
|
import QtGraphicalEffects 1.0
|
||
|
import org.kde.plasma.mobilecomponents 0.2
|
||
|
import "private"
|
||
|
|
||
|
/**Documented API
|
||
|
Inherits:
|
||
|
Item
|
||
|
|
||
|
Imports:
|
||
|
QtQuick 2.1
|
||
|
|
||
|
Description:
|
||
|
Split Drawers are used to expose additional UI elements which are optional and can be used in conjunction with the main UI elements. For example the Resource Browser uses a Split Drawer to select different kinds of filters for the main view.
|
||
|
|
||
|
Properties:
|
||
|
bool open:
|
||
|
If true the drawer is open showing the contents of the "drawer" component.
|
||
|
|
||
|
Item page:
|
||
|
It's the default property. it's the main content of the drawer page, the part that is always shown
|
||
|
|
||
|
Item drawer:
|
||
|
It's the part that can be pulled in and out, will act as a sidebar.
|
||
|
|
||
|
int visibleDrawerWidth: the width of the visible portion of the drawer: it updates while dragging or animating
|
||
|
**/
|
||
|
AbstractDrawer {
|
||
|
id: root
|
||
|
anchors {
|
||
|
fill: parent
|
||
|
}
|
||
|
visible: true
|
||
|
|
||
|
default property alias page: mainPage.data
|
||
|
property Item contentItem
|
||
|
property alias opened: sidebar.open
|
||
|
property int visibleDrawerWidth: browserFrame.x
|
||
|
|
||
|
Component.onCompleted: {
|
||
|
mainPage.width = browserFrame.width
|
||
|
}
|
||
|
|
||
|
onContentItemChanged: contentItem.parent = drawerPage
|
||
|
MouseArea {
|
||
|
id: mouseEventListener
|
||
|
z: 200
|
||
|
drag.filterChildren: true
|
||
|
//drag.target: browserFrame
|
||
|
property int startMouseX
|
||
|
property int oldMouseX
|
||
|
property int startBrowserFrameX
|
||
|
property bool toggle: false
|
||
|
property string startState
|
||
|
|
||
|
anchors.fill: parent
|
||
|
|
||
|
onPressed: {
|
||
|
if (drawerPage.children.length == 0 || (browserFrame.state == "Closed" && mouse.x > Units.gridUnit) ||
|
||
|
mouse.x < browserFrame.x) {
|
||
|
mouse.accepted = false;
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
toggle = true;
|
||
|
startBrowserFrameX = browserFrame.x;
|
||
|
oldMouseX = startMouseX = mouse.x;
|
||
|
startState = browserFrame.state;
|
||
|
browserFrame.state = "Dragging";
|
||
|
browserFrame.x = startBrowserFrameX;
|
||
|
}
|
||
|
|
||
|
onPositionChanged: {
|
||
|
browserFrame.x = Math.max(0, browserFrame.x + mouse.x - oldMouseX);
|
||
|
oldMouseX = mouse.x;
|
||
|
if (Math.abs(mouse.x - startMouseX) > Units.gridUnit * 2) {
|
||
|
toggle = false;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
onReleased: {
|
||
|
if (toggle) {
|
||
|
browserFrame.state = startState == "Open" ? "Closed" : "Open"
|
||
|
} else if (browserFrame.x < sidebar.width / 2) {
|
||
|
browserFrame.state = "Closed";
|
||
|
} else {
|
||
|
browserFrame.state = "Open";
|
||
|
}
|
||
|
}
|
||
|
onClicked: root.clicked()
|
||
|
}
|
||
|
|
||
|
Rectangle {
|
||
|
id: browserFrame
|
||
|
z: 100
|
||
|
color: Theme.backgroundColor
|
||
|
state: "Closed"
|
||
|
onStateChanged: sidebar.open = (state != "Closed")
|
||
|
|
||
|
anchors {
|
||
|
top: parent.top
|
||
|
bottom: parent.bottom
|
||
|
}
|
||
|
width: root.width;
|
||
|
|
||
|
Item {
|
||
|
id: mainPage
|
||
|
onChildrenChanged: mainPage.children[0].anchors.fill = mainPage
|
||
|
|
||
|
anchors.fill: parent
|
||
|
}
|
||
|
|
||
|
Rectangle {
|
||
|
anchors.fill: parent
|
||
|
color: "black"
|
||
|
opacity: Math.min(0.4, 0.4 * (browserFrame.x / sidebar.width))
|
||
|
}
|
||
|
LinearGradient {
|
||
|
width: Units.gridUnit/2
|
||
|
anchors {
|
||
|
right: parent.left
|
||
|
top: parent.top
|
||
|
bottom: parent.bottom
|
||
|
rightMargin: -1
|
||
|
}
|
||
|
start: Qt.point(0, 0)
|
||
|
end: Qt.point(Units.gridUnit/2, 0)
|
||
|
gradient: Gradient {
|
||
|
GradientStop {
|
||
|
position: 0.0
|
||
|
color: "transparent"
|
||
|
}
|
||
|
GradientStop {
|
||
|
position: 0.7
|
||
|
color: Qt.rgba(0, 0, 0, 0.15)
|
||
|
}
|
||
|
GradientStop {
|
||
|
position: 1.0
|
||
|
color: Qt.rgba(0, 0, 0, 0.3)
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
states: [
|
||
|
State {
|
||
|
name: "Open"
|
||
|
PropertyChanges {
|
||
|
target: browserFrame
|
||
|
x: sidebar.width
|
||
|
}
|
||
|
|
||
|
},
|
||
|
State {
|
||
|
name: "Dragging"
|
||
|
PropertyChanges {
|
||
|
target: browserFrame
|
||
|
x: mouseEventListener.startBrowserFrameX
|
||
|
}
|
||
|
},
|
||
|
State {
|
||
|
name: "Closed"
|
||
|
PropertyChanges {
|
||
|
target: browserFrame
|
||
|
x: 0
|
||
|
}
|
||
|
}
|
||
|
]
|
||
|
|
||
|
transitions: [
|
||
|
Transition {
|
||
|
//Exclude Dragging
|
||
|
to: "Open,Closed,Hidden"
|
||
|
NumberAnimation {
|
||
|
properties: "x"
|
||
|
duration: Units.longDuration
|
||
|
easing.type: Easing.InOutQuad
|
||
|
}
|
||
|
}
|
||
|
]
|
||
|
}
|
||
|
|
||
|
|
||
|
Item {
|
||
|
id: sidebar
|
||
|
|
||
|
property bool open: false
|
||
|
onOpenChanged: {
|
||
|
if (drawerPage.children.length == 0) {
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
if (open) {
|
||
|
browserFrame.state = "Open";
|
||
|
} else {
|
||
|
browserFrame.state = "Closed";
|
||
|
}
|
||
|
}
|
||
|
|
||
|
width: Math.min(parent.width/4*3, Math.max(root.contentItem ? root.contentItem.implicitWidth : 0, parent.width/4))
|
||
|
|
||
|
anchors {
|
||
|
left: parent.left
|
||
|
top: parent.top
|
||
|
bottom: parent.bottom
|
||
|
}
|
||
|
|
||
|
Item {
|
||
|
id: drawerPage
|
||
|
anchors.fill: parent
|
||
|
clip: false
|
||
|
onChildrenChanged: drawerPage.children[0].anchors.fill = drawerPage
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|