improved desktop UI
[mardrone] / mardrone / imports / com / nokia / meego / Slider.qml
1 /****************************************************************************
2 **
3 ** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies).
4 ** All rights reserved.
5 ** Contact: Nokia Corporation (qt-info@nokia.com)
6 **
7 ** This file is part of the Qt Components project.
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.1
42 import "." 1.0
43 import Qt.labs.components 1.1
44 import "UIConstants.js" as UI
45
46 SliderTemplate {
47     id: slider
48
49     property Style platformStyle: SliderStyle{}
50
51     //Deprecated, TODO Remove this on w13
52     property alias style: slider.platformStyle
53
54     opacity: enabled ? UI.OPACITY_ENABLED : UI.OPACITY_DISABLED
55
56     __handleItem: Image {
57         source: pressed? platformStyle.handleBackgroundPressed : platformStyle.handleBackground;
58     }
59
60     __grooveItem: BorderImage {
61             source: platformStyle.grooveItemBackground
62             border { left: 6; top: 4; right: 6; bottom: 4 }
63             height: 10
64
65             anchors.verticalCenter: parent.verticalCenter
66             anchors.left: parent.left
67             anchors.right: parent.right
68     }
69
70     __valueTrackItem: BorderImage {
71         source: platformStyle.grooveItemElapsedBackground
72         border { left: 6; top: 4; right: 6; bottom: 4 }
73         height: 10
74
75         anchors.verticalCenter: parent.verticalCenter
76         anchors.left: parent.left
77         anchors.right: parent.right
78     }
79
80     __valueIndicatorItem: BorderImage {
81         id: indicatorBackground
82         source: platformStyle.valueBackground
83         border { left: 12; top: 12; right: 12; bottom: 12 }
84
85         width: label.width + 28
86         height: 40
87
88         Image {
89             id: arrow
90         }
91
92         state: slider.valueIndicatorPosition
93         states: [
94             State {
95                 name: "Top"
96                 PropertyChanges {
97                     target: arrow
98                     source: platformStyle.labelArrowDown
99                 }
100                 AnchorChanges {
101                     target: arrow
102                     anchors.top: parent.bottom
103                     anchors.horizontalCenter: parent.horizontalCenter
104                 }
105             },
106             State {
107                 name: "Bottom"
108                 PropertyChanges {
109                     target: arrow
110                     source: platformStyle.labelArrowUp
111                 }
112                 AnchorChanges {
113                     target: arrow
114                     anchors.bottom: parent.top
115                     anchors.horizontalCenter: parent.horizontalCenter
116                 }
117                 AnchorChanges {
118                     target: indicatorBackground
119 //                    anchors.
120                 }
121             },
122             State {
123                 name: "Left"
124                 PropertyChanges {
125                     target: arrow
126                     source: platformStyle.labelArrowLeft
127                 }
128                 AnchorChanges {
129                     target: arrow
130                     anchors.left: parent.right
131                     anchors.verticalCenter: parent.verticalCenter
132                 }
133             },
134             State {
135                 name: "Right"
136                 PropertyChanges {
137                     target: arrow
138                     source: platformStyle.labelArrowRight
139                 }
140                 AnchorChanges {
141                     target: arrow
142                     anchors.right: parent.left
143                     anchors.verticalCenter: parent.verticalCenter
144                 }
145             }
146         ]
147
148         Text {
149             id: label
150             anchors.centerIn: parent
151             text: slider.valueIndicatorText
152             color: slider.platformStyle.textColor
153             font.pixelSize: slider.platformStyle.fontPixelSize
154             font.family: slider.platformStyle.fontFamily
155         }
156
157         // Native libmeegotouch slider value indicator pops up 100ms after pressing
158         // the handle... but hiding happens without delay.
159         visible: slider.valueIndicatorVisible && slider.pressed
160         Behavior on visible {
161             enabled: !indicatorBackground.visible
162             PropertyAnimation {
163                 duration: 100
164             }
165         }
166     }
167 }