1 | /****************************************************************************
|
---|
2 | **
|
---|
3 | ** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies).
|
---|
4 | ** All rights reserved.
|
---|
5 | ** Contact: Nokia Corporation ([email protected])
|
---|
6 | **
|
---|
7 | ** This file is part of the QtDeclarative module of the Qt Toolkit.
|
---|
8 | **
|
---|
9 | ** $QT_BEGIN_LICENSE:BSD$
|
---|
10 | ** You may use this file under the terms of the BSD license as follows:
|
---|
11 | **
|
---|
12 | ** "Redistribution and use in source and binary forms, with or without
|
---|
13 | ** modification, are permitted provided that the following conditions are
|
---|
14 | ** met:
|
---|
15 | ** * Redistributions of source code must retain the above copyright
|
---|
16 | ** notice, this list of conditions and the following disclaimer.
|
---|
17 | ** * Redistributions in binary form must reproduce the above copyright
|
---|
18 | ** notice, this list of conditions and the following disclaimer in
|
---|
19 | ** the documentation and/or other materials provided with the
|
---|
20 | ** distribution.
|
---|
21 | ** * Neither the name of Nokia Corporation and its Subsidiary(-ies) nor
|
---|
22 | ** the names of its contributors may be used to endorse or promote
|
---|
23 | ** products derived from this software without specific prior written
|
---|
24 | ** permission.
|
---|
25 | **
|
---|
26 | ** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
|
---|
27 | ** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
|
---|
28 | ** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
|
---|
29 | ** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
|
---|
30 | ** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
|
---|
31 | ** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
|
---|
32 | ** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
|
---|
33 | ** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
|
---|
34 | ** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
|
---|
35 | ** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
|
---|
36 | ** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
|
---|
37 | ** $QT_END_LICENSE$
|
---|
38 | **
|
---|
39 | ****************************************************************************/
|
---|
40 |
|
---|
41 | import QtQuick 1.0
|
---|
42 | import "core"
|
---|
43 |
|
---|
44 | Rectangle {
|
---|
45 | id: screen
|
---|
46 | width: 1000; height: 1000
|
---|
47 | property int partition: height/3
|
---|
48 | border { width: 1; color: "#DCDCCC"}
|
---|
49 | state: "DRAWER_CLOSED"
|
---|
50 |
|
---|
51 | //Item 1: MenuBar on the top portion of the screen
|
---|
52 | MenuBar {
|
---|
53 | id:menuBar
|
---|
54 | height: screen.partition; width: screen.width
|
---|
55 | z: 1
|
---|
56 | }
|
---|
57 |
|
---|
58 | //Item 2: The editable text area
|
---|
59 | TextArea {
|
---|
60 | id: textArea
|
---|
61 | y: drawer.height
|
---|
62 | color: "#3F3F3F"
|
---|
63 | fontColor: "#DCDCCC"
|
---|
64 | height: partition*2; width:parent.width
|
---|
65 | }
|
---|
66 |
|
---|
67 | //Item 3: The drawer handle
|
---|
68 | Rectangle {
|
---|
69 | id: drawer
|
---|
70 | height: 15; width: parent.width
|
---|
71 | border { color : "#6A6D6A"; width: 1 }
|
---|
72 | z: 1
|
---|
73 | gradient: Gradient {
|
---|
74 | GradientStop { position: 0.0; color: "#8C8F8C" }
|
---|
75 | GradientStop { position: 0.17; color: "#6A6D6A" }
|
---|
76 | GradientStop { position: 0.77; color: "#3F3F3F" }
|
---|
77 | GradientStop { position: 1.0; color: "#6A6D6A" }
|
---|
78 | }
|
---|
79 | Image {
|
---|
80 | id: arrowIcon
|
---|
81 | source: "images/arrow.png"
|
---|
82 | anchors.horizontalCenter: parent.horizontalCenter
|
---|
83 | Behavior{ NumberAnimation { property: "rotation"; easing.type: Easing.OutExpo } }
|
---|
84 | }
|
---|
85 |
|
---|
86 | MouseArea {
|
---|
87 | id: drawerMouseArea
|
---|
88 | anchors.fill: parent
|
---|
89 | hoverEnabled: true
|
---|
90 | onEntered: parent.border.color = Qt.lighter("#6A6D6A")
|
---|
91 | onExited: parent.border.color = "#6A6D6A"
|
---|
92 | onClicked: {
|
---|
93 | if (screen.state == "DRAWER_CLOSED") {
|
---|
94 | screen.state = "DRAWER_OPEN"
|
---|
95 | }
|
---|
96 | else if (screen.state == "DRAWER_OPEN"){
|
---|
97 | screen.state = "DRAWER_CLOSED"
|
---|
98 | }
|
---|
99 | }
|
---|
100 | }
|
---|
101 | }
|
---|
102 |
|
---|
103 | //! [states]
|
---|
104 | states:[
|
---|
105 | State {
|
---|
106 | name: "DRAWER_OPEN"
|
---|
107 | PropertyChanges { target: menuBar; y: 0}
|
---|
108 | PropertyChanges { target: textArea; y: partition + drawer.height}
|
---|
109 | PropertyChanges { target: drawer; y: partition}
|
---|
110 | PropertyChanges { target: arrowIcon; rotation: 180}
|
---|
111 | },
|
---|
112 | State {
|
---|
113 | name: "DRAWER_CLOSED"
|
---|
114 | PropertyChanges { target: menuBar; y:-height; }
|
---|
115 | PropertyChanges { target: textArea; y: drawer.height; height: screen.height - drawer.height }
|
---|
116 | PropertyChanges { target: drawer; y: 0 }
|
---|
117 | PropertyChanges { target: arrowIcon; rotation: 0 }
|
---|
118 | }
|
---|
119 | ]
|
---|
120 | //! [states]
|
---|
121 |
|
---|
122 | //! [transitions]
|
---|
123 | transitions: [
|
---|
124 | Transition {
|
---|
125 | to: "*"
|
---|
126 | NumberAnimation { target: textArea; properties: "y, height"; duration: 100; easing.type:Easing.OutExpo }
|
---|
127 | NumberAnimation { target: menuBar; properties: "y"; duration: 100; easing.type: Easing.OutExpo }
|
---|
128 | NumberAnimation { target: drawer; properties: "y"; duration: 100; easing.type: Easing.OutExpo }
|
---|
129 | }
|
---|
130 | ]
|
---|
131 | //! [transitions]
|
---|
132 | }
|
---|