kriss/garmin-padel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: refine watch UI — arc HR gauge, proper padel court, spacing

Browse Source 
- HR shown as a top arc gauge in Garmin zone colors (grey/blue/green/
  orange/red) with a marker on the current zone and the bpm number below
- Redraw court to a proper padel layout: net centered, service lines at
  the 3m-from-back-wall proportion, center line only between service lines
- Wider court with a configurable blue surface (bgColor param on
  CourtRenderer, ready for the future settings screen)
- Serve ball marks the back zone (farthest from the net) of the server
- Roomier score spacing; games column white, sets accent green; "Pts"
- HR + time on a matched FONT_MEDIUM

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Kriss Vila
2026-07-04 16:42:33 +02:00
parent 33d3f4f08e
commit 926f876a6e
2 changed files with 81 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
source/CourtRenderer.mc
View File

@@ -5,26 +5,34 @@ import Toybox.Graphics;
// in the given quadrant. Half-width HW and half-height HH keep it inside the
// central band of the round screen.
class CourtRenderer {
private const HW = 60; // half court width (px)
private const HH = 78; // half court height (px)
private const BALL_R = 6;
private const HW = 92; // half court width (px)
private const HH = 95; // half court height (px)
private const BALL_R = 7;
// bgColor fills the court surface (blue for now; a future settings screen
// will drive it via RulesConfig).
public function draw(dc as Graphics.Dc, cx as Number, cy as Number,
quadrant as Number, showBall as Boolean) as Void {
quadrant as Number, showBall as Boolean,
bgColor as Number) as Void {
var left = cx - HW;
var top = cy - HH;
// Service line sits 3m from the back wall (7m from the net) on a 10m
// half, i.e. 0.7 of the way from the net to the back boundary.
var sl = (7 * HH) / 10;
dc.setColor(bgColor, Graphics.COLOR_TRANSPARENT);
dc.fillRectangle(left, top, 2 * HW, 2 * HH); // court surface
dc.setColor(Graphics.COLOR_WHITE, Graphics.COLOR_TRANSPARENT);
dc.setPenWidth(2);
dc.drawRectangle(left, top, 2 * HW, 2 * HH); // outer court
dc.drawLine(cx, top, cx, cy + HH); // center service line
dc.drawRectangle(left, top, 2 * HW, 2 * HH); // outer boundary
dc.drawLine(left, cy - sl, left + 2 * HW, cy - sl); // upper service line
dc.drawLine(left, cy + sl, left + 2 * HW, cy + sl); // lower service line
dc.drawLine(cx, cy - sl, cx, cy + sl); // center line (between service lines only)
dc.setPenWidth(1);
dc.drawLine(left, cy - HH / 2, left + 2 * HW, cy - HH / 2); // upper service line
dc.drawLine(left, cy + HH / 2, left + 2 * HW, cy + HH / 2); // lower service line
dc.setPenWidth(3);
dc.drawLine(left, cy, left + 2 * HW, cy); // net
dc.setPenWidth(4);
dc.drawLine(left, cy, left + 2 * HW, cy); // net (boldest)
if (showBall) {
var pos = _ballPos(quadrant, cx, cy);
@@ -35,7 +43,7 @@ class CourtRenderer {
private function _ballPos(quadrant as Number, cx as Number, cy as Number) as Array<Number> {
var dx = HW / 2;
var dy = HH / 2;
var dy = (17 * HH) / 20; // centered in the back zone, farthest from the net
if (quadrant == QUAD_BOTTOM_RIGHT) { return [cx + dx, cy + dy]; }
if (quadrant == QUAD_BOTTOM_LEFT) { return [cx - dx, cy + dy]; }
if (quadrant == QUAD_UPPER_LEFT) { return [cx - dx, cy - dy]; }