Building a Simple Menu UI on an SSD1306 Display

The cheapest way to add a display with more than two lines to a microcontroller is to go for SSD13xx or ST77XX displays. Even though SSD displays look worse in price/performance compared to ST at first glance… BUT with a different perspective, all the disadvantages of SSD vs ST can start to look like advantages.

• -Black and white colors? Don’t you know B&W is trendy.
• -Slow I2C, but only two wires.
• -Limited libraries, but everything you need is built on top of framebuf, especially for text.

So anyway, I bought both. When I saw how tiny the SSD display is and how easy it is to display something on it, I got an idea: what about building a small, old mobile-style menu app?

With the Pi Pico already installed on a breadboard from my last project, it was an easy choice — especially because I’m starting to like MicroPython.

In the past, I thought the right approach was to put buttons on interrupts and handle them that way… but this always rubbed me the wrong way. To keep things simple, I decided to make a Button class, hook it up with a pull-up resistor, and add a tiny sleep for debouncing.

I’m sure this would be much harder if I wanted to build a bigger project. The logic is to store the current state in a variable and control re-rendering of the menu based on that state. The ssd.text() function makes this extremely simple — just give it a string and the x,y coordinates where it should be placed. That’s it, baby.

Thanks to framebuf, you can create a FrameBuffer from a bytearray representing an icon and then use .blit() in the same way as .text().

This wasn’t the first time I saw Tsoding explain how to render a 3D object on a 2D screen using a simple formula. But it was the first time I watched him explain it with so much finesse and clarity that I felt motivated to do it on the Pico as well.

It doesn’t matter if you’re watching a 5-minute video or a 2-hour recreation coding session. Tsoding’s videos are mesmerizing! Love that guy!