Unity 8
TutorialBottom.qml
1 /*
2  * Copyright (C) 2014 Canonical, Ltd.
3  *
4  * This program is free software; you can redistribute it and/or modify
5  * it under the terms of the GNU General Public License as published by
6  * the Free Software Foundation; version 3.
7  *
8  * This program is distributed in the hope that it will be useful,
9  * but WITHOUT ANY WARRANTY; without even the implied warranty of
10  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11  * GNU General Public License for more details.
12  *
13  * You should have received a copy of the GNU General Public License
14  * along with this program. If not, see <http://www.gnu.org/licenses/>.
15  */
16 
17 import QtQuick 2.4
18 import Ubuntu.Components 1.3
19 import Ubuntu.Gestures 0.1
20 import "../Components"
21 import "." as LocalComponents
22 
23 TutorialPage {
24  id: root
25 
26  property alias edgeSize: dragArea.height
27 
28  title: i18n.tr("Open special menus")
29  text: i18n.tr("Swipe up from the bottom edge.")
30  fullTextWidth: true
31 
32  SequentialAnimation {
33  id: teaseAnimation
34  paused: running && root.paused
35  running: !dragArea.useTouchY && slider.dragOffset === 0
36  loops: Animation.Infinite
37 
38  UbuntuNumberAnimation {
39  target: slider
40  property: "teaseOffset"
41  to: units.gu(1)
42  duration: UbuntuAnimation.SleepyDuration
43  }
44  UbuntuNumberAnimation {
45  target: slider
46  property: "teaseOffset"
47  to: 0
48  duration: UbuntuAnimation.SleepyDuration
49  }
50  }
51 
52  foreground {
53  children: [
54  LocalComponents.Slider {
55  id: slider
56  anchors {
57  bottom: parent.bottom
58  bottomMargin: width / 2 - height / 2
59  horizontalCenter: parent.horizontalCenter
60  }
61  rotation: -90
62  offset: teaseOffset + dragOffset
63  active: dragArea.dragging
64 
65  property real teaseOffset
66  property real dragOffset: dragArea.useTouchY ? -dragArea.touchY : 0
67 
68  Behavior on dragOffset {
69  id: offsetAnimation
70  UbuntuNumberAnimation {}
71  }
72  }
73  ]
74  }
75 
76  DirectionalDragArea {
77  id: dragArea
78  direction: Direction.Upwards
79  anchors {
80  bottom: parent.bottom
81  left: parent.left
82  right: parent.right
83  }
84 
85  property bool useTouchY
86 
87  onDraggingChanged: {
88  if (!dragging) {
89  if (slider.percent >= 0.85) {
90  root.hide();
91  } else if (slider.percent >= 0.15) {
92  root.showError();
93  }
94  }
95 
96  // We use a separate vars here rather than just directly looking at
97  // 'dragging' because we want to preserve our 'slider.offset'
98  // value during the above percent check. Now that we made it,
99  // we can have 'slider.offset' go back to zero.
100  offsetAnimation.enabled = !dragging;
101  useTouchY = dragging;
102  }
103  }
104 }