OLED Screen Graphics (I2C)

OLED Screen Graphics

IMG_9092

describe in one slide image vs canvas size

Screen Parameters

  • OLED screen consists of 64 (W) x 48 (H) pixels (3,072 total pixels)
  • 3,072 pixels means 3,072 bits (ON or OFF) are needed to display a full image
    • 3,072 bits is 384 bytes (8 bits = 1 byte)
  • Each pixel is either ON (HIGH) or OFF (LOW) because there is only one color
  • We can display images on the screen in a bitmap format

Pixels

Original Image Image Closeup to Show Pixels
image-20200330213307376 image-20200330213239875

Bitmap

  • Bitmaps are stored as large arrays of bytes
  • In a monochrome image, there is one bit per pixel
    • 64 pixel x 48 pixel images = 3,072 bits = 384 bytes
  • Ex:
const uint8_t heart_bmp[] = { 
  0x00, 0x00, 0x00, 0x00, 
  0x00, 0x00, 0x00, 0x80, 
  0xe0, 0xf0, 0xf8, 0xfc, 
  ... };

Creating Bitmaps

  • Use a tool to convert image to byte array
  • Color Restrictions
    • Each image to be converted should be black and white
    • Color and greyscale can work but not well
  • Image Size
    • Use small or actual size images for better conversion to bitmap

      Example Images

Original Black/White Image Bitmap on OLED
trojan trojan_cropped
  • Color white is what will be displayed on OLED

Output Restrictions

  • For SparkFun OLED, draw mode is vertical - 1 byte per pixel
  • Sparkfun library requires that each bitmap be specified as 64x48 pixels or 384 bytes (canvas size)
    • This applies even if parts of the image is blank

Ex: Converting Image with Image2CPP

image-20200317223318751

##

image-20200317223350648

##

image-20200317223446692

##

image-20200317223504443

Storing Byte Array

  • Create a const uint8_t array (byte array)
const uint8_t heart_bmp[] = { 
  0x00, 0x00, 0x00, 0x00, 
  0x00, 0x00, 0x00, 0x80, 
  0xe0, 0xf0, 0xf8, 0xfc, 
  ... };
  • Use library to display bitmap

Lab

  • Convert itp348.jpg to bitmap and load as startup graphic (image is in the starting folder)
  • Using the ultrasonic distance sensor, display graphics and distance measurement on the OLED
    • Large error graphic when out of range
    • Small warning message when less than 5 inches
    • Small graphics and distance message otherwise
  • Bitmaps are provided in starting project folder

Photo Mar 30, 10 21 05 PM Photo Mar 30, 10 21 24 PM Photo Mar 30, 10 20 59 PM

Wiring Diagram

Sensor Argon Function
GND GND Ground
VCC VUSB Power (requires 5v, but will work with 3.7V LiPo battery)
TRIG D6 start output pulse sequence
ECHO D5 receive reflection response
OLED Argon Function
GND GND Ground
3V3 3V3 Power
SDA (Blue) SDA Data
SCL (Yellow) SCL Clock

</span>

Tools for converting images to bitmaps

Updated: