From 298ed17d1450b3590d3702e446c5f61aca9fa6b0 Mon Sep 17 00:00:00 2001 From: Arseniy Movshev Date: Fri, 24 Nov 2023 17:13:46 +0000 Subject: Compass: add text heading and stop cardinal directions spinning. - adds a heading (eg. NE, NNW) below the numeric bearing. This may be useful for reading the bearing if looking at the watch off-axis. - removes counter-rotation from cardinal directions. This change is made with the intention of improving accessibility - I personally believe that the counter-rotating letters were distracting and visually noisy, and weren't helpful if looking at the watch off-axis. --- src/Compass.qml | 27 ++++++++++++++++++++++----- 1 file changed, 22 insertions(+), 5 deletions(-) (limited to 'src') diff --git a/src/Compass.qml b/src/Compass.qml index 48e9557..040824a 100644 --- a/src/Compass.qml +++ b/src/Compass.qml @@ -1,5 +1,6 @@ /* - * Copyright (C) 2022 - Darrel Griët + * Copyright (C) 2023 - Arseniy Movshev + * 2022 - Darrel Griët * 2017 - Florent Revest * - Niels Tholenaar * @@ -53,10 +54,11 @@ Item { anchors.fill: parent Label { id: magneticRotation - anchors.centerIn: parent + anchors.horizontalCenter: parent.horizontalCenter + anchors.bottom: parent.verticalCenter text: compassRoot.rotation font { - pixelSize: parent.height / 4 + pixelSize: parent.height / 6 capitalization: Font.Capitalize styleName: "SemiCondensed" kerning: true @@ -69,7 +71,21 @@ Item { anchors.left: magneticRotation.right text: "°" font { - pixelSize: parent.height / 4 + pixelSize: parent.height / 6 + capitalization: Font.Capitalize + styleName: "SemiCondensed" + kerning: true + preferShaping: true + } + } + Label { + id: letterHeading + anchors.horizontalCenter: parent.horizontalCenter + anchors.top: magneticRotation.bottom + property var cardinalDirectionsExt: ["N", "NNE", "NE", "ENE", "E", "ESE", "SE", "SSE", "S", "SSW", "SW", "WSW", "W", "WNW", "NW", "NNW"] + text: cardinalDirectionsExt[Math.floor((compassRoot.rotation+11.25)/22.5)] + font { + pixelSize: parent.height / 6 capitalization: Font.Capitalize styleName: "SemiCondensed" kerning: true @@ -96,7 +112,7 @@ Item { Label { property var angle: (index / outerRing.count) * 2 * Math.PI property var cardinalDirections: ["N", "NE", "E", "SE", "S", "SW", "W", "NW"] - rotation: compassRoot.rotation + rotation: index*45 color: index == 0 ? "#c2620c" : "white" text: cardinalDirections[index] anchors { @@ -116,3 +132,4 @@ Item { } } } + -- cgit v1.2.3-54-g00ecf