Simple OLED + ESP32 + RTC Module + Rotary Encoder Setup
If you’re doing a project that has a screen and requires displaying custom UI/UX, here’s a simple example of that.
List of materials:
- 0.96 inch OLED I2C
- ESP32
- RTC Module (e.g. DS3231)
- Rotary Encoder Module (e.g. KY-040)
- Female to Female Wires, Female to Male Wires, Breadboard.
I’m currently making an autonomous dog feeder, here’s an overview sketch of what it looks like:
As you can see, I need a screen to display DateTime (this is what an RTC module does), and custom logic where the user can play around with the settings and make scheduled meals for their dog(s); This is where the ESP32 (custom logic) and Rotary Encoder (that knob to traverse the settings and it is also a push button to select an option on screen).
Get John Elisa’s stories in your inbox
Join Medium for free to get updates from this writer.
Wiring Diagram:
I connected this with a breadboard. The connections are very simple:
- Connect ESP32 to Laptop/PC via USB-C
- ESP32 3V3 Pin → All Modules VCC. This is the DC power supply railway that powers all the modules.
- ESP32 D21 Pin → OLED AND DS3231/RTC Module SDA Pin
- ESP32 D22 Pin → OLED and DS3231/RTC Module SCL Pin
SDA AND SCL Pins are the communication pins for a protocol called I2C. Smart digital components that need to transfer complex data (e.g. custom messages, datetime) use this I2C protocol; It also allows multiple components to share the same two pins which saves a lot of room and complexity.
- ESP32 D25, D26, D27 → Rotary Encoder Module SW, DT, CLK Pin.
Unlike the OLED and RTC module, the rotary encoder is simply a switch/button that allows the user to move around the main menu; It doesn’t require any data transferring and only outputs raw voltage changes so it uses SW, DT, CLK pins instead of I2C SDA, SCL pins.
The SW Pin connects to the ESP32 to establish the push button, CLK establishes a clockwise rotation and DT establishes a counterclockwise rotation for the ESP32 to read the voltage changes.
Finally, you can write your own custom code that incorporates these connected pins above to make something like this:
