ESP32でOLEDディスプレイに時刻表示

#目的
ESP32でOLEDディスプレイSSD1331に現在の時間を取得するウェアラブルデバイスの開発の先駆け。

#事前にダウンロード
ESP32に必要な__[ESP32ライブラリ](https://github.com/espressif/arduino-esp32)__をダウンロードしてきます。
現在の時間を取得するために、NTP (Network Time Protocol)から__[時間取得ライブラリ](https://github.com/arduino-libraries/NTPClient)__を取得します。

#ESP32のボードを追加方法
・Windowsの方法で追加方法を紹介します。
Arduinoをインストールしている場所にフォルダを作成してesp32に先ほどダウンロードした「arduino-esp32-master」を保存します。

　　　例 C:\Program Files (x86)\Arduino\hardware\espressif\esp32\

esp32\tools に__get.exe__を起動します。
起動したら必要なファイルがダウンロードされます。


・[CP210x USB-UARTブリッジVCPドライバ](https://jp.silabs.com/developers/usb-to-uart-bridge-vcp-drivers)をダウンロードしてインストールしてください。。


#目次
1. 電子部品リスト
2. 配線図
3. 現在時刻を取得プログラム
4. 動画



# 1.電子部品リスト
|名称|仕様|個数|
|:---:|:---:|:--:|
|ESP-WROOM-32|[ESP32](https://www.sengoku.co.jp/mod/sgk_cart/detail.php?code=EEHD-55ES)|1個|
|小型有機ELディスプレイ|[SSD1331](https://www.amazon.co.jp/gp/product/B0711RKXB5?ie=UTF8&camp=1207&creative=8411&creativeASIN=B0711RKXB5&linkCode=shr&tag=ktrip-22&s=aps&qid=1542467391&sr=1-1-catcorr&keywords=SSD1331)|1個|
|ブレットボード||1個|
|ケーブル||7本|





# 2.配線
| ESP32 |OLED|
|:-----:|:----:|
|5 |SCLK|
|18|MOSI|
|12|ChipSelect|
|13|DC|
|14|Reset RST|





# 3.現在時刻を取得プログラム

```ruby:ESP32.rb
#include <WiFi.h> // WiFi接続
#include <WiFiUdp.h>
const char *ssid     = "*******"; //WiFi接続ID ;
const char *password = "*******"; //WiFi接続パスワード ;

#include <NTPClient.h> //時間取得ライブラリ
WiFiUDP ntpUDP;
NTPClient timeClient(ntpUDP);

// OLEDピン定義
const uint8_t SCLK_OLED = 5; //SCLK (SPI Clock)
const uint8_t MOSI_OLED = 18; //MOSI (Master Output Slave Input)
const uint8_t CS_OLED   = 12; //OLED ChipSelect
const uint8_t DC_OLED   = 13; //OLED DC (Data/Command)
const uint8_t RST_OLED  = 14; //OLED Reset RST
// 色の設定
#define BLACK 0x0000 // 黒
#define BLUE 0x001F // 青
#define RED 0xF800 // 赤
#define GREEN 0x07E0 // 緑
#define CYAN 0x07FF // シアン
#define MAGENTA 0xF81F // マゼンダ
#define WHITE 0xFFFF // 白
// ライブラリの設定
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1331.h>
#include <SPI.h>
Adafruit_SSD1331 afficheur = Adafruit_SSD1331(CS_OLED, DC_OLED, MOSI_OLED, SCLK_OLED, RST_OLED);

void setup() {
  Serial.begin(115200); // シリアルモニタ開始
  afficheur.begin(); // OLEDディスプレイの開始

  // WiFi接続開始
  WiFi.begin(ssid, password);
  while ( WiFi.status() != WL_CONNECTED ) {
  
    Serial.print ( "." );
  }
  // 現在時間の取得
  timeClient.begin();
  timeClient.setTimeOffset(32400);
}
void loop() {

  // 時間の表示
  timeClient.update();
  String jp_time = timeClient.getFormattedTime();
  Serial.println(jp_time);
  Serial.print("\n");
  
  afficheur.setCursor(0,0); // cursor is in x=0 and y=0
  afficheur.setTextColor(WHITE); // テキストカラー白
  afficheur.print("--------");  // テキスト表示  
  afficheur.fillScreen(BLACK); // バックグラウンド黒
  afficheur.setCursor(0,16); // cursor is in x=0 and y=16
  afficheur.setTextSize(2); // テキストサイズ
  afficheur.setTextColor(WHITE); // テキストカラー白
  afficheur.print(jp_time); //テキスト表示
  afficheur.setCursor(0,31); // cursor is in x=0 and y=31
  afficheur.setTextColor(WHITE); // テキストカラー白
  afficheur.print("--------");  // テキスト表示  
  afficheur.setCursor(0,46); // cursor is in x=0 and y=46
  afficheur.setTextColor(WHITE); // テキストカラー白
  afficheur.print("   ");  // テキスト表示  
 
  delay(1000); // 1000 us(1秒)毎に更新
}
```

ディスプレイに焼き付くのを避ける為に、ディスプレイを1秒間隔で画面を更新します。


# 4. 動画
下の画像を選択すると動画が再生されます。
__YouTube__に飛びます。

[![ビデオが開けなかった場合に表示されるテキスト](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/675881/3db8e28a-f5f1-7e89-be61-ff6e465eccbd.jpeg)](https://youtu.be/1OuQY1Q-mHg)