Kontrol Stik LED NeoPixel melalui Wi-Fi: Proyek ESP8266 dengan Aplikasi Android

Komponen dan Perlengkapan

• Papan ElectroPeak ESP8266 Serial WIFI Witty Cloud × 1
• Stik LED NeoPixel Cerdas (60 LED/m) × 3
• Konverter Tingkat Logika ElectroPeak × 1
• Kabel Jumper Pria ke Wanita 21cm 40P ElectroPeak × 1
• Pipa PVC 60cm ukuran 2" × 1
• Kertas calque × 1
• Tabung kaca × 1
• Sumber daya 5V (minimal 9A) × 1
• Arduino Nano R3 × 1

Alat dan Mesin yang Diperlukan

• Pistol lem pan (generik)
• Pemolot (generik)

Aplikasi dan Layanan Online

• Arduino IDE

Tentang Proyek

Buat efek simulasi api yang keren dengan kontrol nirkabel Wi-Fi. Aplikasi seluler (untuk ponsel Android) dengan antarmuka yang menarik siap diinstal untuk bermain dengan ciptaan Anda! Kami juga akan menggunakan Arduino dan ESP8266 untuk mengontrol nyala api. Pada akhir proyek ini Anda akan mempelajari:

• Cara kerja NeoPixels.
• Cara memprogram ESP8266 dan mengontrol variabel melalui Wi-Fi.
• Cara membuat efek api yang keren dengan NeoPixels.

Pengantar NeoPixels

LED yang dapat diaddress secara individual atau sering disebut NeoPixels telah ada sejak beberapa waktu lalu dan Anda mungkin mengetahuinya, tetapi jika tidak, mereka seperti LED RGB normal, namun seperti yang namanya menunjukkan, warna setiap satu dapat diaddress secara individual, memungkinkan pola dan animasi yang tak terbatas dibuat. Untuk WS2812b Anda hanya membutuhkan 3 kabel, 2 untuk daya dan 1 untuk data. Artinya Anda hanya membutuhkan satu pin Arduino bebas untuk mengontrol ribuan LED!

Dalam proyek ini, kami akan menggunakan LED pintu ini untuk membuat efek api. Untuk mengontrol LED, kami akan menggunakan library FastLED yang luar biasa. Kami akan menggunakan contoh sketsa Fire2012 dari library yang ditulis oleh Mark Kriegsman. Kami menggunakan 6 stik LED masing-masing memiliki 30 LED (total 180 LED) yang kami tempel pada sepotong pipa PVC dan letakkan di dalam tabung kaca (tabung kaca ini biasanya digunakan sebagai vas). Kami harus menyebarkan cahaya LED agar terlihat berkelanjutan, untuk itu kami menggunakan kertas calque yang membiarkan cahaya melewati dan menyebarkan cahaya.

Konstruksi

Pertama dapatkan tabung kaca yang sesuai, tabung kami memiliki panjang 60cm dan diameter 12cm.

Jika Anda dapat menemukan tabung kaca esmeri itu akan bagus, tetapi jika itu kaca bening Anda dapat menggunakan kertas calque untuk menutupi permukaan tabung (baik permukaan dalam atau luar), kertas calque bekerja dengan baik dalam menyebarkan cahaya dan menghasilkan hasil yang baik.

Setelah mendapatkan tabung kaca ukur panjang internalnya lalu potong pipa PVC sehingga sesuai di dalam tabung. Tabung kaca kami memiliki tinggi 60cm (tidak termasuk dasar memiliki panjang internal 59cm) jadi kami memotong pipa PVC kami menjadi 59cm. Anda akan menempelkan stik LED pada pipa ini, pipa dengan diameter 4cm akan sempurna.

Selanjutnya kami harus memotong stik LED kami menjadi 6 bagian sama di sini kami menggunakan stik dengan kepadatan 60LED/m (Anda dapat menggunakan kepadatan yang lebih tinggi untuk efek yang lebih baik jika Anda ingin) kami menggunakan enam panjang 50cm, yang berarti kami membutuhkan 3 meter. Beri jarak enam panjang yang sama di sekitar pipa PVC dan tempelkan stik ke pipa. Berikut ini bagaimana seharusnya tampilannya.

Untuk menyatukan stik LED bersama Anda dapat langsung menyolder kabel ke stik sesuai dengan gambar berikut atau pertama-tama solder pin header ke stik lalu gunakan kabel breadboard untuk menghubungkannya.

Setelah semua koneksi stik LED selesai Anda harus menempatkan pipa di dalam tabung. Untuk memusatkan pipa di dalam tabung Anda dapat menggunakan busa untuk memotong lingkaran yang memiliki diameter luar sama dengan diameter dalam tabung kaca dan diameter dalam sama dengan diameter luar pipa PVC. Siapkan dua dari ini untuk setiap sisi pipa. Tempelkan bagian-bagian ini pada ujung dan pelan-pelan masukkan pipa di dalam tabung.

Kode

Kami menggunakan Arduino IDE untuk coding dan mengunggah ke ESP8266. Anda harus menggunakan papan yang memiliki ESP8266 dengan 3MB SPIFFS jika Anda ingin mengunggah berkas perangkat lunak pengontrol pada SPIFFS. SPIFFS adalah singkatan dari “Serial Peripheral Interface Flash File System” Anda dapat mengunggah berkas pengontrol ke memori ini untuk menyajikan berkas dari lokasi tersebut. Dengan melakukannya Anda dapat membuka browser Anda (baik di ponsel atau notebook) dan pergi ke alamat ESP Anda (default adalah 192.168.4.1) dan Anda akan mendapatkan antarmuka pengontrol di browser Anda tanpa harus menginstal aplikasi, jika Anda memiliki iPhone atau iPad ini adalah pilihan satu satunya Anda.

Unggah sketsa berikut ke papan ESP Anda. Kami membutuhkan library FastLED, jadi pertama-tama tambahkan ke Arduino IDE Anda jika Anda belum melakukannya (Anda dapat mengunduhnya di sini). Kode simulasi api adalah sketsa fire2012 Mark Kriegsman yang dapat Anda temukan dalam contoh. Contoh itu untuk satu stik LED tetapi, di sini kami telah memodifikasi kode untuk menggunakan variabel jumlah stik. Semakin banyak jumlah stik/LED semakin besar efeknya akan menjadi.

Logika simulasi api dijelaskan dengan jelas dalam berkas contoh. Jika Anda ingin tahu cara kerjanya baca kode sumber contoh.

#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include "FastLED.h"
#include "EEPROM.h"
#include "FS.h"
// required for SPIFFS
#define DATA_PIN 5
#define LED_TYPE WS2811
#define COLOR_ORDER GRB
#define NUM_LEDS 30
#define NUM_STRIPS 6
#define CHIPSET WS2812B
// addresses to save data to EEPROM to preserve the state of fire simulation
#define cs0Adr 0
#define cs1Adr 3
#define cs2Adr 6
#define cs3Adr 9
#define BriAdr 15
#define FpsAdr 16
#define SparkingAdr 17
#define CoolingAdr 18
#define EEPROMCheckAdr 20
// if this value is 250 we assume we have previously saved to EEPROM and load data from that
CRGB leds[NUM_STRIPS * NUM_LEDS];
String inData;
uint8_t FPS = 100;
uint8_t SPARKING = 150;
uint8_t COOLING = 90;
uint8_t BRIGHTNESS = 100;
uint8_t csRGB[4][3] = {{0, 0, 0}, {255, 0, 0}, {255, 127, 0}, {255, 255, 255}};
unsigned long previousMillis = 0;
bool change = false;
unsigned long changeMillis = 0;
bool initSetup = true;
CRGBPalette16 gPal;
ESP8266WebServer server(80);
// Web server object. Will be listening on port 80 (default for HTTP)
void setup() {
  EEPROM.begin(200);
  cWiFi();
  setupFastLED();
  loadConfig();
  gPal = CRGBPalette16(
    CRGB(csRGB[0][0], csRGB[0][1], csRGB[0][2]),
    CRGB(csRGB[1][0], csRGB[1][1], csRGB[1][2]),
    CRGB(csRGB[2][0], csRGB[2][1], csRGB[2][2]),
    CRGB(csRGB[3][0], csRGB[3][1], csRGB[3][2])
  );
}
inline void setupFastLED() {
  delay(1000); // sanity delay
  FastLED.addLeds(leds, NUM_STRIPS * NUM_LEDS).setCorrection(TypicalLEDStrip);
  FastLED.setBrightness(BRIGHTNESS);
}
void loop() {
  server.handleClient(); // Handling of incoming requests
  if (change) {
    if (millis() - changeMillis > 60000) {
      change = false;
      saveToEEPROM();
    }
  }
  fire();
  FastLED.show();
  FastLED.delay(1000 / FPS);
}
// ... kode lengkap tersedia dalam file proyek

Untuk mengontrol “tampilan dan nuansa” api ada dua variabel untuk dimainkan: SPARKING dan COOLING, yang dapat Anda kontrol secara dinamis dalam perangkat lunak pengontrol yang diunggah ke SPIFFS atau aplikasi Android yang dapat Anda unduh. Anda juga dapat mengontrol FPS di sini.

Warna api dikontrol dengan palet warna yang juga dapat diubah melalui perangkat lunak pengontrol (melalui 4 titik henti warna). Cukup klik/ketuk setiap lingkaran warna yang mewakili titik henti untuk mengatur warna, setelah mengatur warna ketuk close untuk menutup dialog dan melihat perubahan.

Cara Mengunggah ke SPIFFS?

Untuk mengunggah berkas ke memori SPIFFS menggunakan Arduino IDE pertama Anda perlu membuat folder bernama “data” di dalam folder sketsa dan menempatkan semua berkas yang ingin Anda unggah di folder tersebut. Berkas yang diunggah di sini berisi baik sketsa maupun folder ini.

Selanjutnya, Anda membutuhkan plugin Arduino ESP8266 filesystem uploader untuk Arduino. Ikuti instruksi di halaman Githubnya dan instal plugin. Setelah terinstal Anda akan menemukan ESP8266 Sketch Data Upload di bawah menu tools. Masukkan ESP Anda ke dalam mode pemrograman dan klik itu. Sabar dan biarkan berkas diunggah, itu mungkin sedikit waktu. Catatan: setel “upload speed” ke 921600 untuk membuatnya lebih cepat.

Bagaimana Cara Kerjanya?

Sketsa yang diunggah ke papan ESP8266 membuat web server di atasnya, yang merespons permintaan yang dikirim dari aplikasi. Aplikasi sederhana mengirim permintaan GET ke server (ESP8266). Data warna untuk membuat palet dikirim sebagai argumen dalam permintaan get, yang sama juga berlaku untuk parameter lain seperti parameter Sparking dan Cooling.

Misalnya, untuk mengatur kecerahan, permintaan berikut dikirim oleh aplikasi:

https://192.168.4.1/conf?brightness=224

ada handler untuk permintaan ini dalam sketsa ketika menerima permintaan ini mengatur kecerahan. Tinjau kode untuk mengetahui lebih lanjut.

Aplikasi Android

Aplikasi Android dibuat menggunakan Phonegap. Ini adalah teknologi yang memungkinkan Anda membuat aplikasi seluler lintas platform menggunakan teknologi web (HTML, CSS, Javascript). Anda dapat mendapatkan kode sumber dengan mengunjungi halaman ini

Anda dapat membaca ini dan tutorial menakjubkan lainnya di situs resmi ElectroPeak