ESP32 Challenge #6: BMP 280 Sensor X OLED Display

5 min readMar 6, 2021

Selamat datang di challenge ke-6! Pada dua challenge sebelumnya kita sudah bermain dengan BMP 280 Sensor dan OLED Display. Nah, di challenge ini kita akan menyatukan kedua komponen tersebut. Yuk, kita mulai!

Jika kalian belum mencoba dengan dua komponen tersebut sebelumnya, silahkan langsung cek caranya disini:

Nah, di challenge ini kita akan menampilkan temperatur dan tekanan yang dibaca oleh BMP 280 Sensor pada OLED Display. Menarik banget, kan?

—

DAFTAR KOMPONEN DAN PERANGKAT

Komponen dan perangkat yang harus disiapkan sebagai berikut:

ESP32 Development Board (1 buah)
Breadboard (1 buah bread board 830 titik dan 2 buah breadboard 400 titik) — bisa menyesuaikan, ya!
BMP 280 Sensor (1 buah)
OLED Display (1 buah)
Kabel male to male (10 buah)
Micro USB Cable (1 buah)
Laptop/komputer yang terdapat Aplikasi Arduino IDE (sudah terinstall package board ESP32)

Jika belum menginstall dan melakukan setting Aplikasi Arduino IDE, silahkan cek caranya disini.

—

DIAGRAM SKEMA

Pada skema di atas, keterhubungan kabel sama seperti saat kita menggunakan sensor BMP 280/OLED Display. Namun, disini kita menggunakan GPIO 21 untuk SDA pada sensor BMP 280 dan OLED Display serta GPIO 22 untuk SCL pada sensor BMP 280 dan OLED Display. Oleh karena itu, kita menghubungkan SCL OLED dengan SCL sensor BMP 280, SDA OLED dengan SDA sensor BMP 280. Lalu, dihubungkan ke ESP32 dengan SDA dihubungkan ke GPIO 21 (D21) dengan kabel male to male orange dan SCL dihubungkan ke GPIO 22 (D22) dengan kabel male to male putih.

Pada bagian pinggir breadboard terdapat jalur berwarna merah (positif) dan biru (negatif). VCC OLED dan VCC sensor BMP 280 dihubungkan ke jalur warna biru, sedangkan GND OLED dan GND sensor BMP 280 dihubungkan ke jalur warna merah seperti yang bisa dilihat pada Gambar 1. Selanjutnya, 3V3 ESP32 dihubungkan ke jalur warna biru dan GND ESP32 dihubungkan ke jalur warna merah.

—

KODE PROGRAM

/*
 Rui Santos
 Complete project details at https://RandomNerdTutorials.com/esp32-i2c-communication-arduino-ide/
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files.
 
 The above copyright notice and this permission notice shall be included in all
 copies or substantial portions of the Software.
*/#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>
#include <Adafruit_Sensor.h>
#include <Adafruit_BMP280.h>#define SCREEN_WIDTH 128 // OLED display width, in pixels
#define SCREEN_HEIGHT 64 // OLED display height, in pixelsAdafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, -1);Adafruit_BMP280 bmp;void setup() {
 Serial.begin(115200);if(!display.begin(SSD1306_SWITCHCAPVCC, 0x3C)) {
 Serial.println(F(“SSD1306 allocation failed”));
 for(;;);
 }
 
 bool status = bmp.begin(0x76); 
 if (!status) {
 Serial.println(“Could not find a valid BMP280 sensor, check wiring!”);
 while (1);
 }
 
 delay(2000);
 display.clearDisplay();
 display.setTextColor(WHITE);
}void loop() {
 display.clearDisplay();
 // display temperature
 display.setTextSize(1);
 display.setCursor(0,0);
 display.print(“Temperature: “);
 display.setTextSize(2);
 display.setCursor(0,10);
 display.print(String(bmp.readTemperature()));
 display.print(“ “);
 display.setTextSize(2);
 display.cp437(true);
 display.write(167);
 display.setTextSize(2);
 display.print(“C”);
 
 // display pressure
 display.setTextSize(1);
 display.setCursor(0, 35);
 display.print(“Pressure: “);
 display.setTextSize(1.8);
 display.setCursor(0, 45);
 display.print(String(bmp.readPressure()));
 display.print(“ “);
 display.setTextSize(1.8);
 display.print(“ hPa”); 
 
 display.display();delay(1000);
}

Keterangan program:

Seperti awal program biasanya, kita harus menginclude library dan define ukuran OLED Display.

void setup() {
 Serial.begin(115200);

Pada setup, kita hubungkan ke serial monitor dengan menggunakan instruksi Serial.begin dan diset kecepatan 115200 baud.

if(!display.begin(SSD1306_SWITCHCAPVCC, 0x3C)) {
 Serial.println(F(“SSD1306 allocation failed”));
 for(;;);
 }
 
 bool status = bmp.begin(0x76); 
 if (!status) {
 Serial.println(“Could not find a valid BMP280 sensor, check wiring!”);
 while (1);
 }

Setelah itu, jika OLED dan sensor BMP 280 tidak terbaca akan muncul error message.

delay(2000);
 display.clearDisplay();
 display.setTextColor(WHITE);
}

Selanjutnya, kita set delay selama 2 s.

Dengan fungsi clearDisplay() akan membersihkan tampilan pada layar. Lalu, kita melakukan set warna tulisan dengan warna putih. Tetapi jika OLED yang dibeli hanya memiliki warna tertentu (Blue/Yellow Blue) maka hanya warna tersebut yang dapat ditampilkan.

void loop() {
 display.clearDisplay();
 // display temperature
 display.setTextSize(1);
 display.setCursor(0,0);
 display.print(“Temperature: “);
 display.setTextSize(2);
 display.setCursor(0,10);
 display.print(String(bmp.readTemperature()));
 display.print(“ “);
 display.setTextSize(2);
 display.cp437(true);
 display.write(167);
 display.setTextSize(2);
 display.print(“C”);
 
 // display pressure
 display.setTextSize(1);
 display.setCursor(0, 35);
 display.print(“Pressure: “);
 display.setTextSize(1.8);
 display.setCursor(0, 45);
 display.print(String(bmp.readPressure()));
 display.print(“ “);
 display.setTextSize(1.8);
 display.print(“ hPa”); 
 
 display.display();delay(1000);
}

Pada bagian loop, akan ditampilkan nilai temperature dan nilai tekanan/pressure.

Cara menampilkan nilai temperature dan nilai tekanan/pressure dari pembacaan sensor BMP 280 adalah dengan memanggil fungsi readTemperature() untuk membaca temperatur dan readPressure() untuk membaca tekanan.

Serta fungsi yang digunakan untuk menampilkan text:

setTextSize(n): berfungsi untuk mengatur ukuran tulisan (antara 1 hingga 8)
setCursor(x,y): berfungsi untuk mengatur posisi tampilan pada koordinat (x, y)
setTextColor(color): berfungsi untuk mengatur warna tulisan dan background (WHITE/BLACK)
print(“message“): berfungsi untuk menampilkan tulisan ke layar
display(): berfungsi untuk menampilkan pada layar OLED
cp437(bool): berfungsi untuk menggunakan font ‘Code Page 437’
write(): berfungsi untuk menampilkan karakter tertentu.

Pada program menggunakan write(167) berarti menampilkan simbol º.

—

EKSPERIMEN DAN DEMO

Ketika melakukan eksperimen, rangkaian dan program dapat berjalan dengan baik.

Untuk mengetes apakah sensor membaca temperatur dengan baik, aku mencoba menghembuskan nafas di dekat sensor dan terjadi kenaikan suhu yang terlihat pada Gambar 3.

—

ANALISIS DAN HASIL EKSPERIMEN

Sensor BMP 280 dapat membaca temperatur dan tekanan lalu hasil pembacaan tersebut dapat ditampilkan pada OLED Display dengan menggunakan fungsi pada library yang digunakan. Pada saat menghubungkan rangkaian, kita harus berhati-hati dalam menghubungkan bagian OLED, sensor BMP 280, dan ESP32, jangan sampai salah menghubungkan karena dapat merusak komponen. Eksperimen dapat berjalan dengan baik walaupun perlu berhati-hati dan mengecek berulang kali ketika menghubungkan kabel-kabel tersebut.

Akhirnya, kita sudah bisa menampilkan pembacaan dari sensor ke OLED Display. Sampai jumpa di challenge selanjutnya!