widgets: Spinner: Add a simple spinner widget

We are able to add this to the self tests without having to create a
special page. Instead we can modify the existing notifications test
to utilize the spinner.

Signed-off-by: Daniel Thompson <daniel@redfelineninja.org.uk>

wasp/apps/testapp.py

@@ -8,6 +8,7 @@
 import wasp
 
 import gc
+import fonts
 import icons
 import machine
 
@@ -30,12 +31,12 @@ class TestApp():
         self.scroll = wasp.widgets.ScrollIndicator()
 
         self._checkbox = wasp.widgets.Checkbox(4, 104, 'Check me')
-
         self._sliders = (
                 wasp.widgets.Slider(32, 10, 90, 0xf800),
                 wasp.widgets.Slider(64, 10, 140, 0x27e4),
                 wasp.widgets.Slider(32, 10, 190, 0x211f),
         )
+        self._spinner = wasp.widgets.Spinner(90, 60, 0, 99)
 
     def foreground(self):
         """Activate the application."""
@@ -86,18 +87,19 @@ class TestApp():
         elif self.test.startswith('Fill'):
             self._benchmark_fill()
         elif self.test == 'Notifications':
-            if event[1] < 120:
+            if self._spinner.touch(event):
-                wasp.system.notify(wasp.watch.rtc.get_uptime_ms(),
+                notifications = wasp.system.notifications
-                    {
+
-                        "src":"Hangouts",
+                if len(notifications) > self._spinner.value:
-                        "title":"A Name",
-                        "body":"message contents"
-                    })
-            else:
-                if wasp.system.notifications:
                     wasp.system.unnotify(
-                            next(iter(wasp.system.notifications.keys())))
+                            next(iter(notifications.keys())))
-            self._update_notifications()
+                else:
+                    wasp.system.notify(wasp.watch.rtc.get_uptime_ms(),
+                        {
+                            "src":"Hangouts",
+                            "title":"A Name",
+                            "body":"message contents"
+                        })
         elif self.test == 'RLE':
             self._benchmark_rle()
         elif self.test == 'String':
@@ -219,6 +221,7 @@ class TestApp():
         wasp.watch.display.mute(True)
         draw = wasp.watch.drawable
         draw.fill()
+        draw.set_font(fonts.sans24)
         draw.string('{} test'.format(self.test),
                 0, 6, width=240)
 
@@ -244,9 +247,8 @@ class TestApp():
             else:
                 draw.string("Not supported", 12, 4*24)
         elif self.test == 'Notifications':
-            draw.string('+', 24, 100)
+            self._spinner.value = len(wasp.system.notifications)
-            draw.string('-', 210, 100)
+            self._spinner.draw()
-            self._update_notifications()
         elif self.test == 'RLE':
             draw.blit(self.ICON, 120-48, 120-32)
 
@@ -262,6 +264,3 @@ class TestApp():
 
         draw.string('RGB565 #{:04x}'.format(rgb), 0, 6, width=240)
         draw.fill(rgb, 60, 35, 120, 50)
-
-    def _update_notifications(self):
-        wasp.watch.drawable.string(str(len(wasp.system.notifications)), 0, 140, 240)

wasp/widgets.py

@@ -226,6 +226,7 @@ class Checkbox():
         draw = wasp.watch.drawable
         im = self._im
         if im[2]:
+            draw.set_font(fonts.sans24)
             draw.string(im[2], im[0], im[1]+6)
         self.update()
 
@@ -248,7 +249,7 @@ class Checkbox():
 
     def touch(self, event):
         """Handle touch events."""
-        y = event[2] + 4
+        y = event[2]
         im = self._im
         if y >= im[1] and y < im[1]+40:
             self.state = not self.state
@@ -329,6 +330,53 @@ class Slider():
             v = self._steps - 1
         self.value = v
 
+class Spinner():
+    """A simple Spinner widget.
+
+    In order to have large enough hit boxes the spinner is a fairly large
+    widget and requires 60x120 px.
+    """
+    def __init__(self, x, y, mn, mx, field=1):
+        self._im = (x, y, mn, mx, field)
+        self.value = mn
+
+    def draw(self):
+        """Draw the slider."""
+        draw = watch.drawable
+        im = self._im
+        fg = draw.lighten(wasp.system.theme('slider-default'), 15)
+        draw.blit(icons.up_arrow, im[0]+30-8, im[1]+20, fg)
+        draw.blit(icons.down_arrow, im[0]+30-8, im[1]+120-20-9, fg)
+        self.update()
+
+    def update(self):
+        """Update the spinner value."""
+        draw = watch.drawable
+        im = self._im
+        draw.set_font(fonts.sans28)
+        s = str(self.value)
+        if len(s) < im[4]:
+            s = '0' * (im[4] - len(s)) + s
+        draw.string(s, im[0], im[1]+60-14, width=60)
+
+    def touch(self, event):
+        x = event[1]
+        y = event[2]
+        im = self._im
+        if x >= im[0] and x < im[0]+60 and y >= im[1] and y < im[1]+120:
+            if y < im[1] + 60:
+                self.value += 1
+                if self.value > im[3]:
+                    self.value = im[2]
+            else:
+                self.value -= 1
+                if self.value < im[2]:
+                    self.value = im[3] - 1
+
+            self.update()
+            return True
+
+        return False
 
 _message_string_x_coord = const(0)
 _message_string_y_coord = const(60)