← Back to branch summary

~ubuntu-branches/ubuntu/saucy/ubuntu-ui-toolkit/saucy

« back to all changes in this revision

Viewing changes to modules/Ubuntu/Components/Pickers/DialerHand.qml

  • Committer: Package Import Robot
  • Author(s): Ubuntu daily release, Timo Jyrinki, Christian Dywan, Zsombor Egri, Leo Arias, Nick Dedekind, Alberto Mardegan, Dennis O'Flaherty, tpeeters, Ubuntu daily release
  • Date: 2013-09-25 07:08:56 UTC
  • mfrom: (1.1.56)
  • Revision ID: package-import@ubuntu.com-20130925070856-2xfkzyjou81vb7m9
Tags: 0.1.46+13.10.20130925.1-0ubuntu1
https://launchpad.net/bugs/1229541
https://launchpad.net/bugs/1229541
https://launchpad.net/bugs/1226516
https://launchpad.net/bugs/1227355
https://launchpad.net/bugs/1226104
https://launchpad.net/bugs/1221707
[ Timo Jyrinki ]
* Temporarily disable the jokes example in order to not have
  qtmultimedia dependency from examples that is not used otherwise.
  This lessens the dependency chains of packages. It can be added back
  after Ubuntu 13.10.
* Fix regression in qmlscene usage (LP: #1229541). (LP: #1229541)

[ Christian Dywan ]
* Set QCoreApplication::applicationName based on MainView. (LP:
  #1197056, #1197051, #1224126)
* Include subfolders of Components in api check.

[ Zsombor Egri ]
* Organizer EDS (Evolution Data Server) integration.
* StateSaver attached component.
* Fix alarm status reporting, updating documentation on asynchronous
  behavior of save and cancel operations. Alarm status notification
  reports the operation the status refers to. (LP: #1226516)
* Dialer + DialerHand components required for TimePicker. .

[ Leo Arias ]
* Added UbuntuUIToolkitAppTestCase as a base test case for the
  autopilot tests. (LP: #1227355)
* Added the autopilot emulator for toggles.

[ Nick Dedekind ]
* Added clipping to tab bar. (LP: #1226104)

[ Alberto Mardegan ]
* Support re-attaching to a different QQuickView Make the plugin
  correctly handle the case when the QQuickView is destroyed and a new
  one is created: this is done by avoiding using static variables, and
  instead binding the data to the QQmlEngine, QQmlContext or QWindow
  as appropriate. . (LP: #1221707)

[ Dennis O'Flaherty ]
* Reword the description for easier reading.

[ tpeeters ]
* Fix warnings when running gallery-app autopilot tests. (LP:
  #1223329, #1223326)
* Smarter automatic updating of Panel's opened property. Panel.open()
  and Panel.close() should be used to open/close a Panel, or when
  using a toolbar with ToolbarItems from a Page, set Page.tools.opened
  to open/close the toolbar. No API or behavior changes since the
  panel-open-close branch. Toolbar behavior changes will be done in a
  following MR.

[ Ubuntu daily release ]
* Automatic snapshot from revision 765

Show diffs side-by-side

added added

removed removed

Lines of Context:
modules/Ubuntu/Components/Pickers/DialerHand.qml
 
1
/*
 
2
 * Copyright 2013 Canonical Ltd.
 
3
 *
 
4
 * This program is free software; you can redistribute it and/or modify
 
5
 * it under the terms of the GNU Lesser 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 Lesser General Public License for more details.
 
12
 *
 
13
 * You should have received a copy of the GNU Lesser General Public License
 
14
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
15
 */
 
16
 
 
17
import QtQuick 2.0
 
18
import "../" 0.1
 
19
 
 
20
/*!
 
21
    \qmltype DialerHand
 
22
    \inqmlmodule Ubuntu.Components.Pickers 0.1
 
23
    \ingroup ubuntu-pickers
 
24
    \brief DialerHand represents a value selector on a Dialer.
 
25
 
 
26
    DialerHand components have meaning only if those are placed inside Dialer
 
27
    components. The dialer hand presents a value selection from the given dialer's
 
28
    minimum and maximum values.
 
29
 
 
30
    By default all hands are placed on the dialer's hand space, on the outer dialer
 
31
    disk. By default all hands have teh same size, 0.5GU width and height same as
 
32
    the handSpace specified in \l Dialer, however themes can specify preset values
 
33
    for each hand.
 
34
 
 
35
    Hands can also be placed onto the inner disk by setting \a hand.toCenterItem
 
36
    property to true.
 
37
 
 
38
    \qml
 
39
    Dialer {
 
40
        DialerHand {
 
41
            // this dialer hand will take the space as defined by the theme.
 
42
        }
 
43
        DialerHand {
 
44
            hand.height: units.gu(3)
 
45
            // this hand will have its width as defined by the theme
 
46
            // but height as 3 GU
 
47
        }
 
48
    }
 
49
    \endqml
 
50
 
 
51
    Items declared as children will be placed over the hands. These items will not
 
52
    be rotated togehther with the hand, these will always be shown horizontally.
 
53
    The hand can be hidden by setting false to \a hand.visible property, but that
 
54
    does not hide the overlay content.
 
55
 
 
56
    The following example demonstrates how to create a hidden dialer hand having
 
57
    an overlay component on the hand.
 
58
    \qml
 
59
    Dialer {
 
60
        DialerHand {
 
61
            id: selector
 
62
            hand.visible: false
 
63
            Rectangle {
 
64
                anchors.centerIn: parent
 
65
                width: height
 
66
                height: units.gu(3)
 
67
                radius: width / 2
 
68
                color: Theme.palette.normal.background
 
69
                antialiasing: true
 
70
                Label {
 
71
                    text: Math.round(selector.value)
 
72
                    anchors.centerIn: parent
 
73
                }
 
74
            }
 
75
        }
 
76
    }
 
77
    \endqml
 
78
  */
 
79
StyledItem {
 
80
    id: dialerHand
 
81
 
 
82
    /*!
 
83
      The property holds the selected value the dialer hand points to.
 
84
      */
 
85
    property real value
 
86
 
 
87
    /*!
 
88
      \qmlproperty real hand.width
 
89
      \qmlproperty real hand.height
 
90
      \qmlproperty bool hand.draggable
 
91
      \qmlproperty bool hand.toCenterItem
 
92
      \qmlproperty bool hand.visible
 
93
 
 
94
      The \b hand.width and \b hand.height properties define the size of the hand.
 
95
      The height of the hand must be in the [0..dialer.handSpace] range in order
 
96
      to have the hand displayed in the hand area, however there is no restriction
 
97
      applied on the size of the dialer hand. If no value is set, the width and
 
98
      height will be defined by the style.
 
99
 
 
100
      \b draggable property specifies whether the hand is draggable or not. When set to not draggable,
 
101
      the hand is used only to indicate the given value. The default value is true.
 
102
 
 
103
      \b toCenterItem property specifies whether the hand should be placed on the hand space (on the outer disk
 
104
      - false) or onto the center disk (inner disk - true). The default value is false, meaning the hand will be placed onto the hand space disk.
 
105
 
 
106
      \b visible property specifies whether to show the hand marker or not. The default value is true.
 
107
      */
 
108
    property DialerHandGroup hand: DialerHandGroup {
 
109
        width: __styleInstance.handPreset(index, "width")
 
110
        height: __styleInstance.handPreset(index, "height")
 
111
        draggable: __styleInstance.handPreset(index, "draggable")
 
112
        visible: __styleInstance.handPreset(index, "visible")
 
113
        toCenterItem: __styleInstance.handPreset(index, "toCenterItem")
 
114
    }
 
115
 
 
116
    /*!
 
117
      The property holds the dialer instance the hand is assigned to. This is a
 
118
      helper property to enable access to the dialer component hosting the hand.
 
119
      */
 
120
    readonly property Dialer dialer: parent
 
121
 
 
122
    /*!
 
123
      \qmlproperty list<QtObject> overlay
 
124
      \default
 
125
      The property holds the items that can be added on top of the hand. Note that
 
126
      these items will not be rotated together with the hand pointer and pointer
 
127
      visibility does not affect the overlay items visibility.
 
128
      */
 
129
    default property alias overlay: contentItem.data
 
130
 
 
131
    /*!
 
132
      \qmlproperty int index
 
133
      \readonly
 
134
      The property holds the index of the hand. Note that this is not the child
 
135
      index of the dialer children, this represents the index of the DialerHand
 
136
      component added to the \l dialer.
 
137
      */
 
138
    readonly property alias index: grabber.index
 
139
 
 
140
    z: __styleInstance.handPreset(index, "z")
 
141
    anchors.centerIn: parent
 
142
    width: parent.width
 
143
    height: parent.height
 
144
    style: Theme.createStyleComponent("DialerHandStyle.qml", dialerHand)
 
145
 
 
146
    /*! \internal */
 
147
    onParentChanged: {
 
148
        if (dialer && !dialer.hasOwnProperty("handSpace")) {
 
149
            console.log("WARNING: DialerHand can be a child of Dialer only.");
 
150
        }
 
151
    }
 
152
 
 
153
    /*! \internal */
 
154
    onValueChanged: grabber.updateHand();
 
155
    /*! \internal */
 
156
    Component.onCompleted: grabber.updateHand();
 
157
 
 
158
    /*! \internal */
 
159
    property alias __grabber: grabber
 
160
    Item {
 
161
        id: grabber
 
162
        property int index: -1
 
163
        parent: __styleInstance.handPointer
 
164
        width: units.gu(4)
 
165
        height: parent.height
 
166
        anchors {
 
167
            top: parent.top
 
168
            horizontalCenter: parent.horizontalCenter
 
169
        }
 
170
        Item {
 
171
            id: contentItem
 
172
            anchors.fill: parent
 
173
            rotation: 360 - __styleInstance.rotation
 
174
        }
 
175
 
 
176
        function updateHand() {
 
177
            if (!dialer || !__styleInstance) return;
 
178
            __styleInstance.rotation =
 
179
                    MathUtils.projectValue(value,
 
180
                                           dialer.minimumValue, dialer.maximumValue,
 
181
                                           0.0, 360.0);
 
182
            dialer.handUpdated(dialerHand);
 
183
        }
 
184
 
 
185
        MouseArea{
 
186
            anchors.fill: parent;
 
187
            preventStealing: true;
 
188
            enabled: dialerHand.hand.draggable;
 
189
            property real centerX : dialerHand.width / 2
 
190
            property real centerY : dialerHand.height / 2
 
191
            property bool internalChange: false
 
192
 
 
193
            onPositionChanged:  {
 
194
                if (internalChange) return;
 
195
                internalChange = true;
 
196
                var point =  mapToItem (dialerHand, mouse.x, mouse.y);
 
197
                var diffX = (point.x - centerX);
 
198
                var diffY = -1 * (point.y - centerY);
 
199
                var rad = Math.atan (diffY / diffX);
 
200
                var deg = (rad * 180 / Math.PI);
 
201
 
 
202
                if (diffX > 0 && diffY > 0) {
 
203
                    __styleInstance.rotation = 90 - Math.abs (deg);
 
204
                }
 
205
                else if (diffX > 0 && diffY < 0) {
 
206
                    __styleInstance.rotation = 90 + Math.abs (deg);
 
207
                }
 
208
                else if (diffX < 0 && diffY > 0) {
 
209
                    __styleInstance.rotation = 270 + Math.abs (deg);
 
210
                }
 
211
                else if (diffX < 0 && diffY < 0) {
 
212
                    __styleInstance.rotation = 270 - Math.abs (deg);
 
213
                }
 
214
 
 
215
                dialerHand.value = MathUtils.projectValue(__styleInstance.rotation,
 
216
                                                    0.0, 360.0,
 
217
                                                    dialer.minimumValue, dialer.maximumValue);
 
218
                internalChange = false;
 
219
            }
 
220
        }
 
221
    }
 
222
}