From c40ec7b2c6255c001e22891393da13ec1a9e338a Mon Sep 17 00:00:00 2001
From: Richard Barnes <rlb@ipv.sx>
Date: Mon, 15 Sep 2025 18:37:48 -1000
Subject: [PATCH 1/5] Use the ili9341 crate

---
 ui-stm32/Cargo.toml        |   4 ++
 ui-stm32/src/board/ev13.rs | 135 +++++++++++++++++++++++++++++++++++--
 2 files changed, 135 insertions(+), 4 deletions(-)

diff --git a/ui-stm32/Cargo.toml b/ui-stm32/Cargo.toml
index 6336fe8..b15edfa 100644
--- a/ui-stm32/Cargo.toml
+++ b/ui-stm32/Cargo.toml
@@ -29,6 +29,10 @@ hex = { version = "0.4.3", default-features = false }
 heapless = { version = "0.9.1", features = ["defmt"] }
 embedded-io-async = "0.6.1"
 embedded-io = { version = "0.6.1", default-features = false }
+ili9341 = "0.6.0"
+display-interface = "0.5.0"
+itertools = { version = "0.14.0", default-features = false }
+embedded-graphics-core = { version = "0.4.0", default-features = false }
 
 [profile.release]
 debug = 2
diff --git a/ui-stm32/src/board/ev13.rs b/ui-stm32/src/board/ev13.rs
index f7ee6af..88a1148 100644
--- a/ui-stm32/src/board/ev13.rs
+++ b/ui-stm32/src/board/ev13.rs
@@ -3,17 +3,102 @@ use embassy_stm32::{
     bind_interrupts,
     exti::ExtiInput,
     gpio::{Input, Level, Output, Pull, Speed},
-    mode::Async,
+    mode::{Async, Blocking},
     peripherals,
-    spi::Spi,
+    spi::{Spi, Word},
     usart::{self, UartRx, UartTx},
 };
+use embassy_time::Delay;
+use embedded_graphics_core::{pixelcolor::Rgb565, prelude::*, primitives::Rectangle};
+use ili9341::{Ili9341, Orientation};
+use itertools::Itertools;
 use ui_app::{Led, Outputs};
 
+struct NoopScreen;
+
+impl ui_app::Screen for NoopScreen {
+    fn width(&self) -> usize {
+        320
+    }
+
+    fn height(&self) -> usize {
+        240
+    }
+
+    fn fill(&mut self, color: u16) {}
+
+    fn draw(&mut self, left: usize, right: usize, top: usize, bottom: usize, data: &[u16]) {}
+}
+
+use display_interface::{DataFormat, DisplayError, WriteOnlyDataCommand};
+
+struct DisplayData {
+    data_command: Output<'static>,
+    spi: Spi<'static, Blocking>,
+}
+
+impl DisplayData {
+    fn write(&mut self, data: DataFormat<'_>) -> Result<(), DisplayError> {
+        use DataFormat::*;
+        match data {
+            U8(slice) => self.write_slice(slice),
+            U16(slice) => self.write_slice(slice),
+            U16BE(slice) => self.write_slice(slice),
+            U16LE(slice) => self.write_slice(slice),
+            U8Iter(iter) => self.write_iter(iter),
+            U16BEIter(iter) => self.write_iter(iter),
+            U16LEIter(iter) => self.write_iter(iter),
+            _ => unreachable!(),
+        }
+    }
+
+    fn write_slice<W: Word>(&mut self, data: &[W]) -> Result<(), DisplayError> {
+        self.spi.blocking_write(data).unwrap();
+        Ok(())
+    }
+
+    fn write_iter<W: Word>(
+        &mut self,
+        iter: &mut dyn Iterator<Item = W>,
+    ) -> Result<(), DisplayError> {
+        const CHUNK_SIZE: usize = 128;
+
+        // XXX(RLB) Very C-style iteration, could probably write this in a way that would optimize
+        // better.
+        let mut data = [W::default(); CHUNK_SIZE];
+        let mut n = 0;
+        for (i, x) in iter.enumerate() {
+            data[i % CHUNK_SIZE] = x;
+            n = i + 1;
+
+            if n > 0 && n % CHUNK_SIZE == 0 {
+                self.spi.blocking_write(&data).unwrap();
+                n = 0;
+            }
+        }
+
+        self.spi.blocking_write(&data[..n]).unwrap();
+        Ok(())
+    }
+}
+
+impl WriteOnlyDataCommand for DisplayData {
+    fn send_commands(&mut self, cmd: DataFormat<'_>) -> Result<(), DisplayError> {
+        self.data_command.set_low();
+        self.write(cmd)
+    }
+
+    fn send_data(&mut self, buf: DataFormat<'_>) -> Result<(), DisplayError> {
+        self.data_command.set_high();
+        self.write(buf)
+    }
+}
+
 pub struct Board {
     status_led: StatusLed,
-    screen: Screen,
+    screen: NoopScreen,
     net_tx: NetTx<UartTx<'static, Async>>,
+    display: Ili9341<DisplayData, Output<'static>>,
     pub button_a: Option<Button>,
     pub button_b: Option<Button>,
     pub keyboard: Option<Keyboard>,
@@ -88,6 +173,7 @@ impl Board {
         let keyboard = Keyboard::new(cols, rows);
 
         // Screen
+        /*
         let chip_select = Output::new(p.PB8, Level::Low, Speed::Low);
         let data_command = Output::new(p.PB9, Level::Low, Speed::Low);
         let reset = Output::new(p.PC13, Level::Low, Speed::Low);
@@ -103,6 +189,46 @@ impl Board {
         };
         let spi1 = Spi::new_blocking_txonly(p.SPI1, p.PA5, p.PA7, config);
         let screen = Screen::new(chip_select, data_command, reset, backlight, spi1).await;
+        */
+
+        let chip_select = Output::new(p.PB8, Level::Low, Speed::Low);
+        let reset = Output::new(p.PC13, Level::Low, Speed::Low);
+        let data_command = Output::new(p.PB9, Level::Low, Speed::Low);
+        let mut backlight = Output::new(p.PC14, Level::Low, Speed::Low);
+
+        let config = {
+            use embassy_stm32::spi::*;
+            let mut config = Config::default();
+            config.mode.polarity = Polarity::IdleLow;
+            config.mode.phase = Phase::CaptureOnFirstTransition;
+            config.bit_order = BitOrder::MsbFirst;
+            config
+        };
+        let spi = Spi::new_blocking_txonly(p.SPI1, p.PA5, p.PA7, config);
+
+        let display_data = DisplayData { data_command, spi };
+
+        let mut display = Ili9341::new(
+            display_data,
+            reset,
+            &mut Delay,
+            Orientation::Portrait,
+            ili9341::DisplaySize240x320,
+        )
+        .unwrap();
+
+        display
+            .fill_solid(
+                &Rectangle {
+                    top_left: Point { x: 10, y: 10 },
+                    size: Size {
+                        width: 10,
+                        height: 10,
+                    },
+                },
+                Rgb565::new(0xbb, 0x00, 0xbb),
+            )
+            .unwrap();
 
         // NET UART
         let net_uart = {
@@ -121,8 +247,9 @@ impl Board {
 
         Self {
             status_led,
-            screen,
+            screen: NoopScreen,
             net_tx,
+            display,
             button_a: Some(button_a),
             button_b: Some(button_b),
             keyboard: Some(keyboard),

From 01753a2cea120525ba4f1bbd87b03b01b713d67f Mon Sep 17 00:00:00 2001
From: Richard Barnes <rlb@ipv.sx>
Date: Tue, 16 Sep 2025 07:09:15 -1000
Subject: [PATCH 2/5] Make ui-app use embedded-graphics

---
 ui-app/Cargo.toml            |   3 +
 ui-app/src/lib.rs            | 126 +++++++++++++++-----------
 ui-stm32/Cargo.toml          |   3 +-
 ui-stm32/src/board/ev12.rs   | 110 +++++++++++++++++++++--
 ui-stm32/src/board/ev13.rs   |  91 +++++++------------
 ui-stm32/src/board/mod.rs    |   3 -
 ui-stm32/src/board/screen.rs | 165 -----------------------------------
 7 files changed, 215 insertions(+), 286 deletions(-)
 delete mode 100644 ui-stm32/src/board/screen.rs

diff --git a/ui-app/Cargo.toml b/ui-app/Cargo.toml
index 857b768..4464129 100644
--- a/ui-app/Cargo.toml
+++ b/ui-app/Cargo.toml
@@ -4,5 +4,8 @@ version = "0.1.0"
 edition = "2024"
 
 [dependencies]
+bitmap-font = "0.3.0"
 defmt = { version = "1.0.1", default-features = false }
+embedded-graphics = "0.8.1"
+embedded-graphics-core = { version = "0.4.0", default-features = false }
 heapless = "0.9.1"
diff --git a/ui-app/src/lib.rs b/ui-app/src/lib.rs
index 108dee2..16612ef 100644
--- a/ui-app/src/lib.rs
+++ b/ui-app/src/lib.rs
@@ -1,6 +1,15 @@
 #![no_std]
 
+use bitmap_font::{tamzen::FONT_14x26, TextStyle};
 use defmt::Format;
+use embedded_graphics::{
+    draw_target::DrawTarget,
+    geometry::Dimensions,
+    pixelcolor::{BinaryColor, Rgb565},
+    prelude::*,
+    primitives::{Circle, PrimitiveStyle, Rectangle},
+    text::Text,
+};
 
 #[derive(Copy, Clone, Debug, PartialEq, Format)]
 pub enum Key {
@@ -130,16 +139,50 @@ pub trait Led {
     }
 }
 
-fn rgb565(r: u8, g: u8, b: u8) -> u16 {
-    // Discard the low-order bits of the colors
-    (((r as u16) >> 3) << 11) | (((g as u16) >> 2) << 5) | ((b as u16) >> 3)
+struct BinaryDisplay<'a, C, D> {
+    foreground: C,
+    background: C,
+    display: &'a mut D,
 }
 
-pub trait Screen {
-    fn width(&self) -> usize;
-    fn height(&self) -> usize;
-    fn fill(&mut self, color: u16);
-    fn draw(&mut self, left: usize, right: usize, top: usize, bottom: usize, data: &[u16]);
+impl<'a, C, D> BinaryDisplay<'a, C, D> {
+    fn new(foreground: C, background: C, display: &'a mut D) -> Self {
+        Self {
+            foreground,
+            background,
+            display,
+        }
+    }
+}
+
+impl<'a, C, D> Dimensions for BinaryDisplay<'a, C, D>
+where
+    D: Dimensions,
+{
+    fn bounding_box(&self) -> Rectangle {
+        self.display.bounding_box()
+    }
+}
+
+impl<'a, C, D> DrawTarget for BinaryDisplay<'a, C, D>
+where
+    C: PixelColor,
+    D: DrawTarget<Color = C>,
+{
+    type Color = BinaryColor;
+    type Error = D::Error;
+
+    // Required method
+    fn draw_iter<I>(&mut self, pixels: I) -> Result<(), Self::Error>
+    where
+        I: IntoIterator<Item = Pixel<Self::Color>>,
+    {
+        let rgb = pixels.into_iter().map(|Pixel(point, color)| match color {
+            BinaryColor::On => Pixel(point, self.foreground),
+            BinaryColor::Off => Pixel(point, self.background),
+        });
+        self.display.draw_iter(rgb)
+    }
 }
 
 pub trait NetTx {
@@ -148,7 +191,7 @@ pub trait NetTx {
 
 pub trait Outputs {
     fn status_led(&mut self) -> &mut impl Led;
-    fn screen(&mut self) -> &mut impl Screen;
+    fn screen(&mut self) -> &mut impl DrawTarget<Color = Rgb565>;
     fn net_tx(&mut self) -> &mut impl NetTx;
     fn log(&mut self, message: &str);
 }
@@ -173,47 +216,32 @@ impl App {
         out.status_led().set_color(Color::Black);
 
         // Draw a test pattern to the screen
-        const SIZE: usize = 10;
-        let screen = out.screen();
-        let mut data = [0_u16; SIZE * SIZE];
-
-        // Background
-        screen.fill(rgb565(0x88, 0x88, 0x88));
-
-        // Upper left = R
-        let (x0, x1, y0, y1) = (SIZE, SIZE + SIZE, SIZE, SIZE + SIZE);
-        data.fill(rgb565(0xFF, 0x00, 0x00));
-        screen.draw(x0, x1, y0, y1, &data);
-
-        // Upper right = G
-        let (x0, x1, y0, y1) = (
-            screen.width() - SIZE - SIZE,
-            screen.width() - SIZE,
-            SIZE,
-            SIZE + SIZE,
-        );
-        data.fill(rgb565(0x00, 0xFF, 0x00));
-        screen.draw(x0, x1, y0, y1, &data);
-
-        // Lower left = B
-        let (x0, x1, y0, y1) = (
-            SIZE,
-            SIZE + SIZE,
-            screen.height() - SIZE - SIZE,
-            screen.height() - SIZE,
-        );
-        data.fill(rgb565(0x00, 0x00, 0xFF));
-        screen.draw(x0, x1, y0, y1, &data);
-
-        // Lower right = Y
-        let (x0, x1, y0, y1) = (
-            screen.width() - SIZE - SIZE,
-            screen.width() - SIZE,
-            screen.height() - SIZE - SIZE,
-            screen.height() - SIZE,
+        let rect = out.screen().bounding_box();
+
+        rect.into_styled(PrimitiveStyle::with_fill(Rgb565::new(0x88, 0x88, 0x88)))
+            .draw(out.screen())
+            .unwrap_or_else(|_| panic!("graphics error"));
+
+        let mut dot = |left, top, color| {
+            Circle::new(Point::new(left, top), 20)
+                .into_styled(PrimitiveStyle::with_fill(color))
+                .draw(out.screen())
+                .unwrap_or_else(|_| panic!("graphics error"));
+        };
+
+        dot(10, 10, Rgb565::RED);
+        dot(210, 10, Rgb565::GREEN);
+        dot(10, 290, Rgb565::BLUE);
+        dot(210, 290, Rgb565::YELLOW);
+
+        let text = Text::new(
+            "Hello World!",
+            Point { x: 10, y: 30 },
+            TextStyle::new(&FONT_14x26, BinaryColor::On),
         );
-        data.fill(rgb565(0xFF, 0xFF, 0x00));
-        screen.draw(x0, x1, y0, y1, &data);
+        let mut binary_display = BinaryDisplay::new(Rgb565::WHITE, Rgb565::BLACK, out.screen());
+        text.draw(&mut binary_display)
+            .unwrap_or_else(|_| panic!("graphics error"));
     }
 
     pub fn handle(&mut self, event: Event, out: &mut impl Outputs) {
diff --git a/ui-stm32/Cargo.toml b/ui-stm32/Cargo.toml
index b15edfa..62f416e 100644
--- a/ui-stm32/Cargo.toml
+++ b/ui-stm32/Cargo.toml
@@ -31,8 +31,9 @@ embedded-io-async = "0.6.1"
 embedded-io = { version = "0.6.1", default-features = false }
 ili9341 = "0.6.0"
 display-interface = "0.5.0"
-itertools = { version = "0.14.0", default-features = false }
 embedded-graphics-core = { version = "0.4.0", default-features = false }
+bitmap-font = "0.3.0"
+embedded-graphics = "0.8.1"
 
 [profile.release]
 debug = 2
diff --git a/ui-stm32/src/board/ev12.rs b/ui-stm32/src/board/ev12.rs
index 30ddaf8..48f79a2 100644
--- a/ui-stm32/src/board/ev12.rs
+++ b/ui-stm32/src/board/ev12.rs
@@ -1,18 +1,106 @@
-use super::{Button, Keyboard, NetTx, Screen, StatusLed};
+use super::{Button, Keyboard, NetTx, StatusLed};
+use display_interface::{DataFormat, DisplayError, WriteOnlyDataCommand};
 use embassy_stm32::{
     bind_interrupts,
     exti::ExtiInput,
     gpio::{Input, Level, Output, Pull, Speed},
-    mode::Async,
+    mode::{Async, Blocking},
     peripherals,
-    spi::Spi,
+    spi::{Spi, Word},
     usart::{self, UartRx, UartTx},
 };
+use embassy_time::Delay;
+use embedded_graphics::{pixelcolor::Rgb565, prelude::*};
+use ili9341::{Ili9341, Orientation};
 use ui_app::{Led, Outputs};
 
+struct DisplayData {
+    // These fields are not used, but we need to keep them alive so that the chip select output is
+    // held low and the backlight output is held high.
+    _chip_select: Output<'static>,
+    _backlight: Output<'static>,
+
+    data_command: Output<'static>,
+    spi: Spi<'static, Blocking>,
+}
+
+impl DisplayData {
+    fn new(
+        mut backlight: Output<'static>,
+        mut chip_select: Output<'static>,
+        data_command: Output<'static>,
+        spi: Spi<'static, Blocking>,
+    ) -> Self {
+        backlight.set_high();
+        chip_select.set_low();
+
+        Self {
+            _backlight: backlight,
+            _chip_select: chip_select,
+            data_command,
+            spi,
+        }
+    }
+
+    fn write(&mut self, data: DataFormat<'_>) -> Result<(), DisplayError> {
+        use DataFormat::*;
+        match data {
+            U8(slice) => self.write_slice(slice),
+            U16(slice) => self.write_slice(slice),
+            U16BE(slice) => self.write_slice(slice),
+            U16LE(slice) => self.write_slice(slice),
+            U8Iter(iter) => self.write_iter(iter),
+            U16BEIter(iter) => self.write_iter(iter),
+            U16LEIter(iter) => self.write_iter(iter),
+            _ => unreachable!(),
+        }
+    }
+
+    fn write_slice<W: Word>(&mut self, data: &[W]) -> Result<(), DisplayError> {
+        self.spi.blocking_write(data).unwrap();
+        Ok(())
+    }
+
+    fn write_iter<W: Word>(
+        &mut self,
+        iter: &mut dyn Iterator<Item = W>,
+    ) -> Result<(), DisplayError> {
+        const CHUNK_SIZE: usize = 128;
+
+        // XXX(RLB) Very C-style iteration, could probably write this in a way that would optimize
+        // better.
+        let mut data = [W::default(); CHUNK_SIZE];
+        let mut n = 0;
+        for (i, x) in iter.enumerate() {
+            data[i % CHUNK_SIZE] = x;
+            n = i + 1;
+
+            if n > 0 && n % CHUNK_SIZE == 0 {
+                self.spi.blocking_write(&data).unwrap();
+                n = 0;
+            }
+        }
+
+        self.spi.blocking_write(&data[..n]).unwrap();
+        Ok(())
+    }
+}
+
+impl WriteOnlyDataCommand for DisplayData {
+    fn send_commands(&mut self, cmd: DataFormat<'_>) -> Result<(), DisplayError> {
+        self.data_command.set_low();
+        self.write(cmd)
+    }
+
+    fn send_data(&mut self, buf: DataFormat<'_>) -> Result<(), DisplayError> {
+        self.data_command.set_high();
+        self.write(buf)
+    }
+}
+
 pub struct Board {
     status_led: StatusLed,
-    screen: Screen,
+    screen: Ili9341<DisplayData, Output<'static>>,
     net_tx: NetTx<UartTx<'static, Async>>,
     pub button_a: Option<Button>,
     pub button_b: Option<Button>,
@@ -101,8 +189,16 @@ impl Board {
             config.bit_order = BitOrder::MsbFirst;
             config
         };
-        let spi1 = Spi::new_blocking_txonly(p.SPI1, p.PA5, p.PA7, config);
-        let screen = Screen::new(chip_select, data_command, reset, backlight, spi1).await;
+        let spi = Spi::new_blocking_txonly(p.SPI1, p.PA5, p.PA7, config);
+
+        let screen = Ili9341::new(
+            DisplayData::new(backlight, chip_select, data_command, spi),
+            reset,
+            &mut Delay,
+            Orientation::Portrait,
+            ili9341::DisplaySize240x320,
+        )
+        .unwrap();
 
         // NET UART
         let net_uart = {
@@ -136,7 +232,7 @@ impl Outputs for Board {
         &mut self.status_led
     }
 
-    fn screen(&mut self) -> &mut impl ui_app::Screen {
+    fn screen(&mut self) -> &mut impl DrawTarget<Color = Rgb565> {
         &mut self.screen
     }
 
diff --git a/ui-stm32/src/board/ev13.rs b/ui-stm32/src/board/ev13.rs
index 88a1148..670c262 100644
--- a/ui-stm32/src/board/ev13.rs
+++ b/ui-stm32/src/board/ev13.rs
@@ -1,4 +1,5 @@
-use super::{Button, Keyboard, NetTx, Screen, StatusLed};
+use super::{Button, Keyboard, NetTx, StatusLed};
+use display_interface::{DataFormat, DisplayError, WriteOnlyDataCommand};
 use embassy_stm32::{
     bind_interrupts,
     exti::ExtiInput,
@@ -9,35 +10,38 @@ use embassy_stm32::{
     usart::{self, UartRx, UartTx},
 };
 use embassy_time::Delay;
-use embedded_graphics_core::{pixelcolor::Rgb565, prelude::*, primitives::Rectangle};
+use embedded_graphics::{pixelcolor::Rgb565, prelude::*};
 use ili9341::{Ili9341, Orientation};
-use itertools::Itertools;
 use ui_app::{Led, Outputs};
 
-struct NoopScreen;
-
-impl ui_app::Screen for NoopScreen {
-    fn width(&self) -> usize {
-        320
-    }
-
-    fn height(&self) -> usize {
-        240
-    }
-
-    fn fill(&mut self, color: u16) {}
-
-    fn draw(&mut self, left: usize, right: usize, top: usize, bottom: usize, data: &[u16]) {}
-}
-
-use display_interface::{DataFormat, DisplayError, WriteOnlyDataCommand};
-
 struct DisplayData {
+    // These fields are not used, but we need to keep them alive so that the chip select output is
+    // held low and the backlight output is held high.
+    _chip_select: Output<'static>,
+    _backlight: Output<'static>,
+
     data_command: Output<'static>,
     spi: Spi<'static, Blocking>,
 }
 
 impl DisplayData {
+    fn new(
+        mut backlight: Output<'static>,
+        mut chip_select: Output<'static>,
+        data_command: Output<'static>,
+        spi: Spi<'static, Blocking>,
+    ) -> Self {
+        backlight.set_high();
+        chip_select.set_low();
+
+        Self {
+            _backlight: backlight,
+            _chip_select: chip_select,
+            data_command,
+            spi,
+        }
+    }
+
     fn write(&mut self, data: DataFormat<'_>) -> Result<(), DisplayError> {
         use DataFormat::*;
         match data {
@@ -96,9 +100,8 @@ impl WriteOnlyDataCommand for DisplayData {
 
 pub struct Board {
     status_led: StatusLed,
-    screen: NoopScreen,
+    screen: Ili9341<DisplayData, Output<'static>>,
     net_tx: NetTx<UartTx<'static, Async>>,
-    display: Ili9341<DisplayData, Output<'static>>,
     pub button_a: Option<Button>,
     pub button_b: Option<Button>,
     pub keyboard: Option<Keyboard>,
@@ -173,29 +176,11 @@ impl Board {
         let keyboard = Keyboard::new(cols, rows);
 
         // Screen
-        /*
         let chip_select = Output::new(p.PB8, Level::Low, Speed::Low);
         let data_command = Output::new(p.PB9, Level::Low, Speed::Low);
         let reset = Output::new(p.PC13, Level::Low, Speed::Low);
         let backlight = Output::new(p.PC14, Level::Low, Speed::Low);
 
-        let config = {
-            use embassy_stm32::spi::*;
-            let mut config = Config::default();
-            config.mode.polarity = Polarity::IdleLow;
-            config.mode.phase = Phase::CaptureOnFirstTransition;
-            config.bit_order = BitOrder::MsbFirst;
-            config
-        };
-        let spi1 = Spi::new_blocking_txonly(p.SPI1, p.PA5, p.PA7, config);
-        let screen = Screen::new(chip_select, data_command, reset, backlight, spi1).await;
-        */
-
-        let chip_select = Output::new(p.PB8, Level::Low, Speed::Low);
-        let reset = Output::new(p.PC13, Level::Low, Speed::Low);
-        let data_command = Output::new(p.PB9, Level::Low, Speed::Low);
-        let mut backlight = Output::new(p.PC14, Level::Low, Speed::Low);
-
         let config = {
             use embassy_stm32::spi::*;
             let mut config = Config::default();
@@ -206,10 +191,8 @@ impl Board {
         };
         let spi = Spi::new_blocking_txonly(p.SPI1, p.PA5, p.PA7, config);
 
-        let display_data = DisplayData { data_command, spi };
-
-        let mut display = Ili9341::new(
-            display_data,
+        let screen = Ili9341::new(
+            DisplayData::new(backlight, chip_select, data_command, spi),
             reset,
             &mut Delay,
             Orientation::Portrait,
@@ -217,19 +200,6 @@ impl Board {
         )
         .unwrap();
 
-        display
-            .fill_solid(
-                &Rectangle {
-                    top_left: Point { x: 10, y: 10 },
-                    size: Size {
-                        width: 10,
-                        height: 10,
-                    },
-                },
-                Rgb565::new(0xbb, 0x00, 0xbb),
-            )
-            .unwrap();
-
         // NET UART
         let net_uart = {
             use embassy_stm32::usart::*;
@@ -247,9 +217,8 @@ impl Board {
 
         Self {
             status_led,
-            screen: NoopScreen,
+            screen,
             net_tx,
-            display,
             button_a: Some(button_a),
             button_b: Some(button_b),
             keyboard: Some(keyboard),
@@ -263,7 +232,7 @@ impl Outputs for Board {
         &mut self.status_led
     }
 
-    fn screen(&mut self) -> &mut impl ui_app::Screen {
+    fn screen(&mut self) -> &mut impl DrawTarget<Color = Rgb565> {
         &mut self.screen
     }
 
diff --git a/ui-stm32/src/board/mod.rs b/ui-stm32/src/board/mod.rs
index 0dde2fe..668f5cd 100644
--- a/ui-stm32/src/board/mod.rs
+++ b/ui-stm32/src/board/mod.rs
@@ -27,9 +27,6 @@ use ui_app::Led;
 mod keyboard;
 pub use keyboard::Keyboard;
 
-mod screen;
-pub use screen::Screen;
-
 mod net;
 pub use net::{NetRx, NetTx};
 
diff --git a/ui-stm32/src/board/screen.rs b/ui-stm32/src/board/screen.rs
deleted file mode 100644
index 7ec1cb6..0000000
--- a/ui-stm32/src/board/screen.rs
+++ /dev/null
@@ -1,165 +0,0 @@
-use embassy_stm32::{
-    gpio::Output,
-    mode::Blocking,
-    spi::{Spi, Word},
-};
-use embassy_time::Timer;
-use num_enum::IntoPrimitive;
-
-pub struct Screen {
-    chip_select: Output<'static>,
-    data_command: Output<'static>,
-    reset: Output<'static>,
-    backlight: Output<'static>,
-    spi: Spi<'static, Blocking>,
-}
-
-impl ui_app::Screen for Screen {
-    fn width(&self) -> usize {
-        Self::WIDTH
-    }
-
-    fn height(&self) -> usize {
-        Self::HEIGHT
-    }
-
-    fn fill(&mut self, color: u16) {
-        let row = [color; Self::WIDTH];
-
-        self.set_window(0, 0, Self::WIDTH, Self::HEIGHT);
-        self.send_command(Command::WriteMemory, &[]);
-        for _ in 0..Self::HEIGHT {
-            self.spi.blocking_write(&row).unwrap();
-        }
-    }
-
-    fn draw(&mut self, left: usize, right: usize, top: usize, bottom: usize, data: &[u16]) {
-        self.set_window(left, right, top, bottom);
-        self.send_command(Command::WriteMemory, &[]);
-        self.send_data(data);
-    }
-}
-
-impl Screen {
-    const WIDTH: usize = 240;
-    const HEIGHT: usize = 320;
-
-    // Initial command sequence borrowed from
-    //
-    // https://github.com/yuri91/ili9341-rs/blob/master/src/lib.rs#L139
-    pub async fn new(
-        chip_select: Output<'static>,
-        data_command: Output<'static>,
-        reset: Output<'static>,
-        backlight: Output<'static>,
-        spi: Spi<'static, Blocking>,
-    ) -> Self {
-        let mut screen = Self {
-            chip_select,
-            data_command,
-            reset,
-            backlight,
-            spi,
-        };
-
-        // Chip select pin is always held low
-        screen.chip_select.set_low();
-
-        // Do hardware reset by holding reset low for at least 10us, then wait 5ms for the reset to
-        // occur before sending more commands.
-        screen.reset.set_low();
-        Timer::after_millis(200).await;
-        screen.reset.set_high();
-        Timer::after_millis(200).await;
-
-        // Do hardware reset, then wait 120ms for the reset to occur before sending more commands.
-        screen.send_command(Command::SoftwareReset, &[]);
-        Timer::after_millis(200).await;
-
-        // Set portrait orientation
-        screen.send_command(
-            Command::MemoryAccessControl,
-            &[u8::from(Orientation::Portrait)],
-        );
-
-        // Set the pixel format to rgb565
-        screen.send_command(Command::SetPixelFormat, &[0x55]);
-
-        // Have the display emerge from sleep, then wait 5ms for it to wake up
-        screen.send_command(Command::SleepModeOff, &[]);
-        Timer::after_millis(200).await;
-
-        // Turn the display on
-        screen.send_command(Command::DisplayOn, &[]);
-
-        // Turn on the backlight
-        screen.set_backlight(true);
-
-        screen
-    }
-
-    fn set_window(&mut self, x0: usize, x1: usize, y0: usize, y1: usize) {
-        let mut x_data = [0u8; 4];
-        x_data[..2].copy_from_slice(&(x0 as u16).to_be_bytes());
-        x_data[2..].copy_from_slice(&(x1 as u16).to_be_bytes());
-
-        let mut y_data = [0u8; 4];
-        y_data[..2].copy_from_slice(&(y0 as u16).to_be_bytes());
-        y_data[2..].copy_from_slice(&(y1 as u16).to_be_bytes());
-
-        self.send_command(Command::SetColumnAddress, &x_data);
-        self.send_command(Command::SetPageAddress, &y_data);
-    }
-
-    fn send_command(&mut self, cmd: Command, data: &[u8]) {
-        self.data_command.set_low();
-        self.spi.blocking_write(&[u8::from(cmd)]).unwrap();
-
-        self.send_data(data);
-    }
-
-    fn send_data<W: Word>(&mut self, data: &[W]) {
-        self.data_command.set_high();
-        self.spi.blocking_write(data).unwrap();
-    }
-
-    pub fn set_backlight(&mut self, on: bool) {
-        self.backlight.set_level(on.into());
-    }
-}
-
-#[allow(dead_code)]
-#[derive(Copy, Clone, IntoPrimitive)]
-#[repr(u8)]
-enum Command {
-    SetColumnAddress = 0x2a,
-    ContentAdaptiveBrightness = 0x55,
-    DisplayOff = 0x28,
-    DisplayOn = 0x29,
-    IdleModeFrameRate = 0xb2,
-    IdleModeOff = 0x38,
-    IdleModeOn = 0x39,
-    InvertOff = 0x20,
-    InvertOn = 0x21,
-    MemoryAccessControl = 0x36,
-    WriteMemory = 0x2c,
-    NormalModeFrameRate = 0xb1,
-    SetPageAddress = 0x2b,
-    SetPixelFormat = 0x3a,
-    SetBrightness = 0x51,
-    SleepModeOff = 0x11,
-    SleepModeOn = 0x10,
-    SoftwareReset = 0x01,
-    VerticalScrollAddr = 0x37,
-    DefineVerticalScroll = 0x33,
-}
-
-#[allow(dead_code)]
-#[derive(Copy, Clone, IntoPrimitive)]
-#[repr(u8)]
-enum Orientation {
-    Portrait = 0x40 | 0x08,
-    Landscape = 0x20 | 0x08,
-    PortraitFlipped = 0x80 | 0x08,
-    LandscapeFlipped = 0x40 | 0x80 | 0x20 | 0x08,
-}

From b387a52663db02bfdf4e2b121499cec319504291 Mon Sep 17 00:00:00 2001
From: Richard Barnes <rlb@ipv.sx>
Date: Tue, 16 Sep 2025 08:45:36 -1000
Subject: [PATCH 3/5] Implement new graphics framework in Tauri

---
 ui-app/src/lib.rs                  |  19 ++++--
 ui-tauri/src-tauri/Cargo.toml      |   1 +
 ui-tauri/src-tauri/src/lib.rs      | 101 +++++++++++++----------------
 ui-tauri/src-tauri/tauri.conf.json |   2 +-
 ui-tauri/src/index.html            |   2 +-
 ui-tauri/src/main.js               |  25 +++----
 ui-tauri/src/styles.css            |   6 +-
 7 files changed, 75 insertions(+), 81 deletions(-)

diff --git a/ui-app/src/lib.rs b/ui-app/src/lib.rs
index 16612ef..1d2dbc9 100644
--- a/ui-app/src/lib.rs
+++ b/ui-app/src/lib.rs
@@ -222,17 +222,26 @@ impl App {
             .draw(out.screen())
             .unwrap_or_else(|_| panic!("graphics error"));
 
+        let pad: u32 = 10;
+        let diameter: u32 = 20;
+        let width = rect.size.width;
+        let height = rect.size.height;
+
         let mut dot = |left, top, color| {
-            Circle::new(Point::new(left, top), 20)
+            Circle::new(Point::new(left as i32, top as i32), diameter)
                 .into_styled(PrimitiveStyle::with_fill(color))
                 .draw(out.screen())
                 .unwrap_or_else(|_| panic!("graphics error"));
         };
 
-        dot(10, 10, Rgb565::RED);
-        dot(210, 10, Rgb565::GREEN);
-        dot(10, 290, Rgb565::BLUE);
-        dot(210, 290, Rgb565::YELLOW);
+        dot(pad, pad, Rgb565::RED);
+        dot(width - pad - diameter, pad, Rgb565::GREEN);
+        dot(pad, height - pad - diameter, Rgb565::BLUE);
+        dot(
+            width - pad - diameter,
+            height - pad - diameter,
+            Rgb565::YELLOW,
+        );
 
         let text = Text::new(
             "Hello World!",
diff --git a/ui-tauri/src-tauri/Cargo.toml b/ui-tauri/src-tauri/Cargo.toml
index 42eae79..7ec388c 100644
--- a/ui-tauri/src-tauri/Cargo.toml
+++ b/ui-tauri/src-tauri/Cargo.toml
@@ -28,4 +28,5 @@ chrono = "0.4.39"
 serde_derive = "1.0.217"
 rand = "0.9.0"
 ui-app = { version = "0.1.0", path = "../../ui-app" }
+embedded-graphics = { version = "0.8.1", default-features = false }
 
diff --git a/ui-tauri/src-tauri/src/lib.rs b/ui-tauri/src-tauri/src/lib.rs
index afab3bd..a1e36b2 100644
--- a/ui-tauri/src-tauri/src/lib.rs
+++ b/ui-tauri/src-tauri/src/lib.rs
@@ -2,10 +2,16 @@
 #![cfg_attr(not(debug_assertions), windows_subsystem = "windows")]
 
 use core::ops::DerefMut;
+use embedded_graphics::{
+    draw_target::DrawTarget,
+    pixelcolor::{Rgb565, Rgb888},
+    prelude::*,
+    primitives::Rectangle,
+};
 use once_cell::sync::OnceCell;
 use std::sync::{mpsc, Mutex};
 use tauri::Emitter;
-use ui_app::{App, Button, Event, FromNet, Key, KeyValue, Led, NetTx, Outputs, Screen, ToNet};
+use ui_app::{App, Button, Event, FromNet, Key, KeyValue, Led, NetTx, Outputs, ToNet};
 
 mod hactar_vaporwave;
 
@@ -21,14 +27,17 @@ mod cmd {
     }
 
     #[derive(Clone, Serialize)]
-    pub struct Draw<'a> {
-        pub left: usize,
-        pub right: usize,
-        pub top: usize,
-        pub bottom: usize,
-
-        /// Data in <canvas> RGBA format
-        pub data: &'a [u8],
+    pub struct Pixel {
+        pub x: usize,
+        pub y: usize,
+        pub r: u8,
+        pub g: u8,
+        pub b: u8,
+    }
+
+    #[derive(Clone, Serialize)]
+    pub struct Pixels {
+        pub pixels: Vec<Pixel>,
     }
 }
 
@@ -59,57 +68,39 @@ impl Led for Board {
     }
 }
 
-impl Screen for Board {
-    fn width(&self) -> usize {
-        320
-    }
-
-    fn height(&self) -> usize {
-        240
-    }
-
-    fn fill(&mut self, color: u16) {
-        let data = [color; 320 * 240];
-        self.draw(0, self.width(), 0, self.height(), &data);
+impl Dimensions for Board {
+    fn bounding_box(&self) -> Rectangle {
+        Rectangle::new(Point::new(0, 0), Size::new(240, 320))
     }
+}
 
-    fn draw(&mut self, left: usize, right: usize, top: usize, bottom: usize, data: &[u16]) {
-        println!(
-            "draw {} {} {} {} ({} x {} == {}? {})",
-            left,
-            right,
-            top,
-            bottom,
-            (right - left),
-            (bottom - top),
-            data.len(),
-            data.len() == (right - left) * (bottom - top)
-        );
-
-        // Unpack the rgb565 values to RGBA tuples
-        let data: Vec<u8> = data
-            .iter()
-            .map(|rgb565| {
-                [
-                    (((rgb565 & 0b11111_000000_00000) >> 11) << 3) as u8, // R
-                    (((rgb565 & 0b00000_111111_00000) >> 5) << 2) as u8,  // G
-                    (((rgb565 & 0b00000_000000_11111) >> 0) << 3) as u8,  // B
-                    (0xff as u8),                                         // A
-                ]
+impl DrawTarget for Board {
+    type Color = Rgb565;
+    type Error = String;
+
+    // Required method
+    fn draw_iter<I>(&mut self, pixels: I) -> Result<(), Self::Error>
+    where
+        I: IntoIterator<Item = Pixel<Self::Color>>,
+    {
+        let pixels = pixels
+            .into_iter()
+            .map(|Pixel(point, color)| {
+                let rgb = Rgb888::from(color);
+                cmd::Pixel {
+                    x: point.x as usize,
+                    y: point.y as usize,
+                    r: rgb.r(),
+                    g: rgb.g(),
+                    b: rgb.b(),
+                }
             })
-            .flatten()
             .collect();
 
-        // Send the draw command to the UI
-        let cmd = cmd::Draw {
-            left,
-            right,
-            top,
-            bottom,
-            data: data.as_slice(),
-        };
+        let cmd = cmd::Pixels { pixels };
 
-        self.app.emit("Screen", cmd).unwrap();
+        self.app.emit("Pixels", cmd).unwrap();
+        Ok(())
     }
 }
 
@@ -124,7 +115,7 @@ impl Outputs for Board {
         self
     }
 
-    fn screen(&mut self) -> &mut impl Screen {
+    fn screen(&mut self) -> &mut impl DrawTarget<Color = Rgb565> {
         self
     }
 
diff --git a/ui-tauri/src-tauri/tauri.conf.json b/ui-tauri/src-tauri/tauri.conf.json
index 31f96ac..a4bcdad 100644
--- a/ui-tauri/src-tauri/tauri.conf.json
+++ b/ui-tauri/src-tauri/tauri.conf.json
@@ -12,7 +12,7 @@
       {
         "title": "Hactar",
         "width": 400,
-        "height": 600
+        "height": 640
       }
     ],
     "security": {
diff --git a/ui-tauri/src/index.html b/ui-tauri/src/index.html
index 973177e..8286384 100644
--- a/ui-tauri/src/index.html
+++ b/ui-tauri/src/index.html
@@ -16,7 +16,7 @@
         <span class="led" id="led-ui">UI</span>
         <span class="led" id="led-net">NET</span>
       </div>
-      <canvas id="screen" width="320" height="240"></canvas> 
+      <canvas id="screen" width="240" height="320"></canvas> 
       <div id="buttons">
         <button id="button-a">A</button>
         <button id="button-b">B</button>
diff --git a/ui-tauri/src/main.js b/ui-tauri/src/main.js
index 3b3ffa8..8f47950 100644
--- a/ui-tauri/src/main.js
+++ b/ui-tauri/src/main.js
@@ -67,26 +67,19 @@ async function handle_ptt(e) {
   }
 }
 
-async function handle_screen(e) {
-  let { left, right, top, bottom, data } = e.payload;
+async function handle_pixels(e) {
+  let { pixels } = e.payload;
 
   const screen = document.getElementById("screen");
   const ctx = screen.getContext("2d");
 
-  const width = right - left;
-  const height = bottom - top;
-  const imageData = ctx.createImageData(width, height);
+  const imageData = ctx.createImageData(1, 1);
+  for (let pixel of pixels) {
+    const { x, y, r, g, b } = pixel;
 
-  if (data.length != imageData.data.length) {
-    console.log(`malformed command ${data.length} != ${imageData.data.length}`);
-    return;
+    ctx.fillStyle = `rgb(${r}, ${g}, ${b}, 1)`;
+    ctx.fillRect( x, y, 1, 1 );
   }
-
-  for (let i = 0; i < imageData.data.length; i ++) {
-    imageData.data[i] = data[i];
-  }
-  
-  ctx.putImageData(imageData, left, top);
 }
 
 async function handle_led(e) {
@@ -100,9 +93,9 @@ async function handle_led(e) {
 
 async function handle_events() {
   const ptt_state = listen('PttState', handle_ptt);
-  const screen = listen('Screen', handle_screen);
+  const pixels = listen('Pixels', handle_pixels);
   const led = listen('LED', handle_led);
-  return Promise.all([ptt_state, screen, led])
+  return Promise.all([ptt_state, pixels, led])
 }
 
 window.addEventListener("DOMContentLoaded", async () => {
diff --git a/ui-tauri/src/styles.css b/ui-tauri/src/styles.css
index 2081606..8b13ddf 100644
--- a/ui-tauri/src/styles.css
+++ b/ui-tauri/src/styles.css
@@ -37,7 +37,7 @@ body {
 
 .container {
   margin: 0;
-  padding-top: 5vh;
+  padding-top: 2vh;
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -46,8 +46,8 @@ body {
 
 #screen {
   background: #999;
-  width: 320px;
-  height: 240px;
+  width: 240px;
+  height: 320px;
   margin: 1em auto;
 }
 

From 46ccb4fe98bdd3e7d46c1ecd123cd00ed98c7305 Mon Sep 17 00:00:00 2001
From: Richard Barnes <rlb@ipv.sx>
Date: Tue, 16 Sep 2025 08:49:52 -1000
Subject: [PATCH 4/5] Update ui-app tests

---
 ui-app/src/lib.rs             |  1 -
 ui-app/tests/integration.rs   | 31 ++++++++++++++++++-------------
 ui-tauri/src-tauri/src/lib.rs |  1 -
 3 files changed, 18 insertions(+), 15 deletions(-)

diff --git a/ui-app/src/lib.rs b/ui-app/src/lib.rs
index 1d2dbc9..07a699e 100644
--- a/ui-app/src/lib.rs
+++ b/ui-app/src/lib.rs
@@ -172,7 +172,6 @@ where
     type Color = BinaryColor;
     type Error = D::Error;
 
-    // Required method
     fn draw_iter<I>(&mut self, pixels: I) -> Result<(), Self::Error>
     where
         I: IntoIterator<Item = Pixel<Self::Color>>,
diff --git a/ui-app/tests/integration.rs b/ui-app/tests/integration.rs
index f627372..aa2b5d4 100644
--- a/ui-app/tests/integration.rs
+++ b/ui-app/tests/integration.rs
@@ -1,5 +1,9 @@
 use ui_app::*;
 
+use embedded_graphics::{
+    draw_target::DrawTarget, pixelcolor::Rgb565, prelude::*, primitives::Rectangle,
+};
+
 #[derive(Default)]
 struct MockLed {
     color: Option<Color>,
@@ -15,21 +19,22 @@ impl Led for MockLed {
 #[derive(Default)]
 struct MockScreen;
 
-impl Screen for MockScreen {
-    fn width(&self) -> usize {
-        240
-    }
-
-    fn height(&self) -> usize {
-        320
+impl Dimensions for MockScreen {
+    fn bounding_box(&self) -> Rectangle {
+        Rectangle::new(Point::new(0, 0), Size::new(240, 320))
     }
+}
 
-    fn fill(&mut self, _color: u16) {
-        // TODO: Store pixels
-    }
+impl DrawTarget for MockScreen {
+    type Color = Rgb565;
+    type Error = String;
 
-    fn draw(&mut self, _left: usize, _right: usize, _top: usize, _bottom: usize, _data: &[u16]) {
-        // TODO: Store pixels
+    fn draw_iter<I>(&mut self, _pixels: I) -> Result<(), Self::Error>
+    where
+        I: IntoIterator<Item = Pixel<Self::Color>>,
+    {
+        // TODO(RLB) Store pixels
+        Ok(())
     }
 }
 
@@ -57,7 +62,7 @@ impl Outputs for MockOutputs {
         &mut self.status_led
     }
 
-    fn screen(&mut self) -> &mut impl Screen {
+    fn screen(&mut self) -> &mut impl DrawTarget<Color = Rgb565> {
         &mut self.screen
     }
 
diff --git a/ui-tauri/src-tauri/src/lib.rs b/ui-tauri/src-tauri/src/lib.rs
index a1e36b2..18fc8aa 100644
--- a/ui-tauri/src-tauri/src/lib.rs
+++ b/ui-tauri/src-tauri/src/lib.rs
@@ -78,7 +78,6 @@ impl DrawTarget for Board {
     type Color = Rgb565;
     type Error = String;
 
-    // Required method
     fn draw_iter<I>(&mut self, pixels: I) -> Result<(), Self::Error>
     where
         I: IntoIterator<Item = Pixel<Self::Color>>,

From 4ff537d4ca9ce3e48762f1dec7edb546c0e693ed Mon Sep 17 00:00:00 2001
From: Richard Barnes <rlb@ipv.sx>
Date: Tue, 16 Sep 2025 08:54:38 -1000
Subject: [PATCH 5/5] Fix formatting

---
 ui-app/src/lib.rs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ui-app/src/lib.rs b/ui-app/src/lib.rs
index 07a699e..7711a94 100644
--- a/ui-app/src/lib.rs
+++ b/ui-app/src/lib.rs
@@ -1,6 +1,6 @@
 #![no_std]
 
-use bitmap_font::{tamzen::FONT_14x26, TextStyle};
+use bitmap_font::{TextStyle, tamzen::FONT_14x26};
 use defmt::Format;
 use embedded_graphics::{
     draw_target::DrawTarget,