今回はRTC、温湿度センサの活用です。今回が最後。Playerの完成です。
時間の表示

- スケッチを実行して
- メイン画面を表示すると、右下に青字で時刻が表示されます。
- 時:分 表示で 時は24時間制です。
- この ”時:分” 部分にタッチすると右の時刻温湿度データが表示されます。
- 左上に有るボタンを押すと時間の表示が変わり。
- ボタンが
- 24の時 : 24時間制
- AM/PMの時: 12時間制
- Exitボタンにタッチするとメイン画面に戻ります。
時間の設定

- メイン画面に戻って真ん中のボタンにタッチすると
- 機能設定メニューが表示されます。 ここでSet Timeボタンにタッチすると画面が右の様になります。
- 年、月、日、時、分、秒の各枠にタッチすると値が1つ増えます。
- 各値はMAX値になると0に戻ります。
- 時間は24時間制で指定して下さい。
- ”from Web”ボタンにタッチするとWebから時間を取得します。
- OKボタンで値を設定して終了。Exitは設定せずに終了です。
タイマの設定

- 機能設定メニューで”Set Alarm”にタッチすると右の画面が表示されます。
- タイマーは2つ有ります。
- 時:分(時は24時間制)で時間を設定します。
- ON/OFFは設定した時間に再生するか(ON) 停止するか(OFF)です。
- 繰り返しは設定の繰り返し。
- ここが選択されていなければタイマーは1回のみ
- 選択されていればタイマーは無限にくりかえす。
- ”Set”ボタンオンでタイマーは有効になります。
- ”OK”ボタンで機能設定メニューに戻ります。
今回もズレ発生
今回もSPRITE表示にズレが発生しました。今回は前回追加したダミーのFile型変数を削除したらズレが無くなりました。

Libraryの修正
開発中に ”esp32-audio-master” のバージョンが3.4に上がったので、RADIKO対応用に”Audio.ccp”を変更します。オリジナルのコードは以下の通り。
Audio.ccp
setDefaults();
rqh.assign("GET /");
rqh.append(path.get());
rqh.append(" HTTP/1.1\r\n");
rqh.append("Host: ");
rqh.append(hwoe.get());
rqh.append("\r\n");
rqh.append("Icy-MetaData:1\r\n");
rqh.append("Icy-MetaData:2\r\n");
rqh.append("Pragma: no-cache\r\n");
rqh.append("Cache-Control: no-cache\r\n");
rqh.append("Accept:*/*\r\n");
rqh.append("User-Agent: VLC/3.0.21 LibVLC/3.0.21 AppleWebKit/537.36 (KHTML, like Gecko)\r\n");
if(authLen > 0) { rqh.append("Authorization: Basic ");
rqh.append(authorization.get());
rqh.append("\r\n"); }
rqh.append("Accept-Encoding: identity;q=1,*;q=0\r\n");
rqh.append("Connection: keep-alive\r\n\r\n");
if(m_f_ssl) { _client = static_cast<WiFiClient*>(&clientsecure);}
else { _client = static_cast<WiFiClient*>(&client); }
このコードの669から671行を下記669から679行の様に変更しています。
Audio.ccp
setDefaults();
rqh.assign("GET /");
rqh.append(path.get());
rqh.append(" HTTP/1.1\r\n");
rqh.append("Host: ");
rqh.append(hwoe.get());
rqh.append("\r\n");
rqh.append("Icy-MetaData:1\r\n");
rqh.append("Icy-MetaData:2\r\n");
rqh.append("Pragma: no-cache\r\n");
rqh.append("Cache-Control: no-cache\r\n");
rqh.append("Accept:*/*\r\n");
rqh.append("User-Agent: VLC/3.0.21 LibVLC/3.0.21 AppleWebKit/537.36 (KHTML, like Gecko)\r\n");
if(authLen > 0) {
if(user == "-"){
rqh.append("X-Radiko-AuthToken: ");
rqh.append(pwd);
}
else{
rqh.append("Authorization: Basic ");
rqh.append(authorization.get());
}
rqh.append("\r\n");
}
rqh.append("Accept-Encoding: identity;q=1,*;q=0\r\n");
rqh.append("Connection: keep-alive\r\n\r\n");
if(m_f_ssl) { _client = static_cast(&clientsecure);}
else { _client = static_cast(&client); }
今回が最後なので
全体を簡単にまとめます。
ハード
項目 | 部品 | 説明 |
---|---|---|
CPU | ESP32S3 | PSRAM(8M)の付いたESP32 |
I2Sモジュール | PCM5102 I2S | ESP32-audioI2S-masterの出力先 |
アンプ | PAM8403 | I2Sの出力を増幅してスピーカに出力 |
LCD | ILI9341,2.8 “, 240×320 LCD | タッチセンサとSDカード有り |
SDカード | ILI9341,2.8 “, 240×320 LCDに付属 | データ保存用 |
RTCモジュール | DS3231 RTC (for Arduino) | タイマー等に使用 |
温湿度測定モジュール | DHT20 | |
その他 | スピーカ(左右) ミニジャック(イヤフォン用) スイッチ 抵抗 LED |
回路図

Arduino IDE
- バージョン
- Arduino IDEの: 2.3.6
- ESP32ボードマネージャー: 2.0.18
- IDEの”ツール”で下記の3つを選択。
- ボード : ”ESP32S3 Dev Module”
- 今回使用するCPU
- Partition Scheme: ”Huge APP(3MB No OTA/1MB SPIFFS”
- スケッチ自体は小さいのですがリンクしたライブラリが大きく、”Huge APP”が必要。
- PSRAM : ”OPI PSRAM”
- ESP32-audioI2SにPSRAMが必須です。今回はPSRAMのタイプは”OPI PSRAM”でした。
- ボード : ”ESP32S3 Dev Module”

リンクしたLibrary
File Name | Version | 説明 |
---|---|---|
TFT_eSPI | 2.5.43 | LCD表示用(”User_Setup.h”の設定が必要) |
PNGdec | 1.1.3 | PNG画像処理用 |
ESP32-audioI2S-master | 3.4.0 | 音声処理用(Radiko接続用にAudio.ccpを修正する必要有り) |
DS3231 | 1.1.2 | REAL TIME Clock |
スケッチ
スケッチの保存場所。=>> media_player2
- スケッチの構造は以下の通り。

- 39,40行にWiFi用SSID,PASSWORDの設定が有ります。コンパイル前に設定して下さい。
- dataフォルダを Upload LittleFS to Pico/ESP8266/ESP32 を使ってESP32に予めUploadして下さい。
SDカード
SDカード用のデータ =>> SD_Card カードの構成は以下の通り。解凍してSDカードにコピーして下さい。

実行
データをコピーしたSDカードをLCDに挿入して、コンパイルし実行

- 最初の1回のみキャリブレーションの画面が表示されます。
- ”Touch corners as indicated”と表示された先の矢印にタッチします。
- 矢印は4隅に表示されます。順にタッチして下さい。
- ここで日本語フォントの読み込み
- ここでPlayerを選択する
- 左: Web Radio
- 中: Radiko
- 右: 音楽ファイルの再生
- 仮にWeb Radioにタッチすると
- Web Radioが選ばれたメイン画面が表示されます。
使用方法
ここまでの説明、TFT_eSPIとAudioI2SでmediaPlayerを作る(1)から(9)を参照下さい。
- TFT_eSPIとAudioI2SでmediaPlayerを作る(1)
- TFT_eSPIとAudioI2SでmediaPlayerを作る(2)
- TFT_eSPIとAudioI2SでmediaPlayerを作る(3)
- TFT_eSPIとAudioI2SでmediaPlayerを作る(4)
- TFT_eSPIとAudioI2SでmediaPlayerを作る(5)
- TFT_eSPIとAudioI2SでmediaPlayerを作る(6)
- TFT_eSPIとAudioI2SでmediaPlayerを作る(7)
- TFT_eSPIとAudioI2SでmediaPlayerを作る(8)
- TFT_eSPIとAudioI2SでmediaPlayerを作る(9)
