← Back to branch summary

~nik90/ubuntu-clock-app/new-timer-design

« back to all changes in this revision

Viewing changes to stopwatch/AnalogStopwatch.qml

  • Committer: Nekhelesh Ramananthan
  • Date: 2013-06-21 22:06:05 UTC
  • Revision ID: krnekhelesh@gmail.com-20130621220605-jp20fhwnvez1ncg3
Basic working implementation of new visual design

Show diffs side-by-side

added added

removed removed

Lines of Context:
stopwatch/AnalogStopwatch.qml
39
39
    property int milliseconds: 0;
40
40
 
41
41
    property int decimalgradient: 0;
42
 
    property int minuteHandValue: minutes;
43
 
    property int secondHandValue: seconds;
 
42
 
 
43
    signal clicked(var mouse)
44
44
 
45
45
    // Sets the location and visible (bool) values of the blip (small circle visible when the lap button is pressed)
46
46
    property alias blipLocation: blipFist.location;
48
48
 
49
49
    // Retrieves the status of the stopwatch timer
50
50
    property bool timerStatus: stopwatchUIUpdate.running
 
51
    property alias innerDimension: innerCircle.width;
51
52
 
52
53
    function reset() {
53
54
        decimalgradient = totalTime = milliseconds = seconds = minutes = hours = 0
56
57
        flag = true;
57
58
    }
58
59
 
59
 
    function start() {        
 
60
    function start() {
60
61
        stopwatchUIUpdate.start()
61
62
    }
62
63
 
77
78
            minutes = SScript.deltaTime[1];
78
79
            seconds = SScript.deltaTime[2];
79
80
            milliseconds = SScript.deltaTime[3];
80
 
            decimalgradient++;
 
81
            decimalgradient = minutes * 10;
81
82
        }
82
83
    }
83
84
 
89
90
    // This component draws the trailing shadow of the second hand.
90
91
    HandGradient {
91
92
        id: gradientSecond
92
 
        rotationAngle: secondHandValue * 6
 
93
        rotationAngle: minutes * 6
93
94
        decimalGradient: decimalgradient
94
 
    }    
 
95
    }
 
96
 
 
97
    Rectangle {
 
98
        id: innerCircle;
 
99
 
 
100
        z: parent.z + 1;
 
101
        height: units.gu(19); width: units.gu(19);
 
102
        radius: width / 2;
 
103
        anchors.centerIn: parent;
 
104
        color: Constants.coolGrey;
 
105
        antialiasing: true;
 
106
 
 
107
        MouseArea {
 
108
            anchors.fill: parent
 
109
            onClicked: analogStopwatch.clicked(mouse)
 
110
        }
 
111
    }
95
112
 
96
113
    Repeater {
97
114
        id:stopwatchMarkers
98
115
        
99
 
        model: ["1", "2", "4", "5", "7", "8", "10", "11"]
 
116
        model: ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23"]
100
117
        
101
118
        delegate: AnalogClockMarker {
102
119
            number: modelData
 
120
            perAngle: 15;
 
121
            total: 24;
103
122
            size: 0.5
104
 
            color: Constants.pitchBlack
105
 
        }
106
 
    }
107
 
 
108
 
    Repeater {
109
 
        model: ["15", "30", "45", "60"]
110
 
 
111
 
        delegate: AnalogClockMarker {
112
 
            number: modelData
113
 
            textDisplay: true
114
 
        }
115
 
    }
116
 
 
117
 
    // Draws the second and minute hand.
118
 
    AnalogHand {
 
123
            distance: 0.32
 
124
            color: Constants.coolGrey
 
125
        }
 
126
    }
 
127
 
 
128
    AnalogClockHand {
 
129
        id: hourHand
 
130
 
 
131
        z: parent.z
 
132
        height: units.gu(12.5); width: units.gu(1);
 
133
        rotationAngle: hours * 15;
 
134
        antialiasing: true;
 
135
    }
 
136
 
 
137
    AnalogClockHand {
 
138
        id: minuteHand
 
139
 
 
140
        z: parent.z
 
141
        height: units.gu(14.5); width: units.gu(0.5);
 
142
        rotationAngle: minutes * 6;
 
143
        antialiasing: true;
 
144
    }
 
145
 
 
146
    AnalogClockHand {
119
147
        id: secondHand
120
 
        
121
 
        rotationAngle: secondHandValue * 6
122
 
        widthhand: units.gu(0.5); heighthand: units.gu(17); heighttop: units.gu(5)
123
 
        colorhand: Constants.brightWhite
124
 
        colortop: Constants.ubuntuOrange
125
 
    }
126
 
 
127
 
    AnalogHand {
128
 
        id: minuteHand
129
 
 
130
 
        rotationAngle: minuteHandValue * 6
131
 
        widthhand: units.gu(0.5); heighthand: units.gu(6); heighttop: units.gu(0)
132
 
        z: circleMinutes.z + 1
133
 
        colorhand: Constants.pitchBlack
134
 
        colortop: Constants.ubuntuOrange
135
 
    }
136
 
    
137
 
    Rectangle {
138
 
        id: circleMinutes
139
 
        
140
 
        width: units.gu(15); height: units.gu(15)
141
 
        anchors.centerIn: parent
142
 
        color: Constants.normalGrey
143
 
        radius: width / 2
144
 
        z: parent.z + 1
145
 
        antialiasing: true
 
148
 
 
149
        z: parent.z - 1;
 
150
        height: units.gu(17); width:  units.gu(0.5)
 
151
        rotationAngle: seconds * 6;
 
152
        antialiasing: true;
146
153
    }
147
154
}