Arduino 1.3" I2C White OLED Display Project | Details

Sponsor Link:

It is a trustworthy website for ordering electronic components with cheap price and excellent quality.

Mounting the circuit

Note: Look at the pinout of the OLED display in the diagram and of your OLED display. It may be different like in this case, as the pictures above and the diagram above has different pinout orders from the left. You can follow the schematics for pin-to-pin wiring.

Since this i2c OLED display runs on the i2c protocol, it only require a simple, four connection wiring. This wiring could be used in, practically any i2c device as it all follows the same interface. Before starting, remove any power sources going through the Arduino and the circuit, as it can be a safety hazard. Let's now get started by using the Male to Female jumper wires for the connections because no breadboards are needed. First, use one of the wires to connect GND (-) on the OLED to anyone of your Arduino's GND (-) pins. Secondly, connect the VCC (+) pin of your 1.3" OLED to the 5v (+5 volts) pin on your Arduino. Consecutively, connect the SCL (serial clock) pin from the display to A5 (analog pin 5) on your Arduino, as well as connecting the SDA (serial data) pin to A4 (analog pin 4) on your Arduino. That wraps up your wiring for this module!

Arduino 1.3" i2c White OLED Display Project Code

#include "U8glib.h"
U8GLIB_SH1106_128X64 u8g(U8G_I2C_OPT_NONE);

void draw(void) {
  u8g.setFont(u8g_font_profont12);
  u8g.setPrintPos(0, 10);
  u8g.print("This is the 1.3\"");
  u8g.setPrintPos(0, 25);
  u8g.print("White i2c OLED from");
  u8g.setPrintPos(0, 40);
  u8g.print("ICStation.com.");
}

void draw2(void) {
  u8g.setFont(u8g_font_profont12);
  u8g.setPrintPos(0, 10);
  u8g.print("Check out the project");
  u8g.setPrintPos(0, 25);
  u8g.print("and review on");
  u8g.setPrintPos(0, 40);
  u8g.setFont(u8g_font_profont10);
  u8g.print("electorials.weebly.com.");
}

void setup(void) {
}

void loop(void) {
  u8g.firstPage();
  do {
    draw();
  } while (u8g.nextPage() );
  delay(3500);
  u8g.firstPage();
  do {
    draw2();
  } while (u8g.nextPage());
  delay(3500);
}

About the code

At first glance, this code may seem complex and difficult for some, but, after we break it down into smaller parts and we really get to understand the code functions, it won't seem so intimidating anymore. First, this code starts with declaring a library we will be using, the U8glib library, which helps us to operate the OLED being used. The U8glib library supports many display types, with different resolutions and drivers, like the SH1106 driver or the SSD1306 driver. After that line of code, a constructor is outlined where it defines the OLED used. The constructor, word-by-word in this case, means that it uses the U8glib library, runs on the SH1106 driver, has a 128x64 pixel resolution, and it doesn't require an optimisation. The constructors (which you can take from the library page) must match your display. Moving on, we now declare a void statement, a section which we can execute to the display later. This section is named draw. In this statement, the font for the OLED text is assigned which is the profont12 font. The types of fonts can be found in the U8glib home page. After that, the position for the text is set, which is (0, 10) on the pixel display with dimensions of 128 pixels and 64 pixels. Then, the text is written, in order for it to be displayed. This same concept of declaring the position of the text and printing the text is repeated twice with the text being varied in this void block. The repeated lines now end this void statement. The following block of code (void draw2) follows the exact same concept mentioned above, except, the name of the block is changed and we add in another line of code which changes the font for one string we want to print. We change the font to a smaller font, profont10, and it only applies to the next string (u8g.print("electorials.weebly.com.");) as we change it back to profont12 in the loop of the void statement because of the redeclaration of the font. Next up comes the void setup of the sketch, where nothing is done because no necessary, additional setup is needed to this program. Finally, the void loop arrives, as the last section to this code. There is a small declaration of the phrase u8g.firstPage(); and we assign it to the void draw statement earlier. That will be printed while we get ready for the next, incoming page with u8g.nextPage(); under a while function. So when the first page is being printed, the next page will get ready after the 3500 millisecond delay in the delay function. This idea is also followed next with the printing of the void draw2 statement instead followed by a 3500 millisecond delay for each phrase. That is it for this long; yet simple piece of code!

Amazing opportunities

Also, be sure to check out PCBWay, a leading manufacturer and distributor in PCB design and manufacturing. They have amazing prices and excellent quality in their services, so don't miss out on them! Plus, PCBWay has an amazing website, online Gerber viewer function and a gift shop so make sure to check out their links below:

PCBWay Free Online Gerber Viewer Function: https://www.pcbway.com/project/OnlineGerberViewer.html

PCBWay Gift Shop: https://www.pcbway.com/projects/gifts.html

Make sure you check out the review for this module by clicking here.

Enjoy! Contact us for any inquiries!

Project Details