TFT_eSPIとAudioI2SでmediaPlayerを作る(5)

ラジオ局選択機能の追加

今回はラジオ局選択機能を追加します。

意外と大変なのが

現在のGUIは画面のタッチ処理(ボタン等)は簡単に出来るのですが文字や数字の入力となると処理のレベルが上がります。ラジオ局の登録等をLCDでやりたかったのですが諦めて、ラジオ局の情報を含んたファイルを予めSDカードに保存。そこからラジオ局を選んで選局する事にしました。

ルートの下に”url”というフォルダを作り、その中に”url.txt”として保存します。下記の赤字の部分。

このファイルはテキストファイルで、中身は以下の様になっています。

url.txt

http://strm112.1.fm/blues_mobile_mp3
FM - Blues Radio
http://live-radio01.mediahubaustralia.com/JAZW/mp3/
ABC Jazz
https://edge68.live-sm.absolutradio.de/absolut-hot/stream/aacp?aggregator=smk-m3u-aac
Absolut Hot
http://play2.organlive.com:7002/320
Positivly Baroque
https://smoothjazz.cdnstream1.com/2586_320mp3
SmoothLounge Global
https://uk2.streamingpulse.com/ssl/vcr1
Venice Classic Radio
http://www.wdr.de/wdrlive/media/einslive.m3u
www.wdr.de
http://mp3.ffh.de/radioffh/hqlivestream.aac
mp3.ffh.de

データは2行構成。1行目がラジ曲のURL。2行目がラジオ局のタイトル(これをPlayerの5窓に表示します)。上記で8個のデータが登録されています。ラジオ局の追加削除は、このファイルをPCで編集してSDカードに保存して行います。また、このファイルの最後の行はラジオ局のタイトルで終わり、改行等入れないで下さい。

今回のスケッチ

今回のスケッチの構造は以下の様になっています。

  • フォルダplayer: スケッチの作業フォルダ
    • player.ino: メインのスケッチ
      • ジュークボック画面の処理を行います
      • フォントの読み込み、WiFiへの接続に時間がかかるのでその間メッセージを表示する様に変更しています。
      • 状態表示窓(5)に現在選択されているラジオ局名を表示。
      • 状態表示窓(5)にタッチするとラジオ局を選択する関数select_station()をが起動します。
    • player_sub.ino: 今回追加したselect_station()関数
      • 登録されたリストを表示。ラジオ局を選択します。
    • pic.h: 画像データ
    • location.h: ボタンの位置データ
      • ボタンの数が増えたので位置データ(x,y)座標をファイルを別に保存しています。
    • data: データフォルダ
      • ここに保存されているデータをUploaderでESP32にUploadします。
      • 今回は音データを、”sound”フォルダの下に”s00.mp3″として保存しています。
      • 今後、必要なデータは専用のフォルダに保存して行く予定です。

スケッチをここに保存します。

コンパイルする前に

コンパイル前に以下の操作を行って下さい。

  • スケッチに警告音を発生する関数が有ります。
    • それに使用する音声データをUploaderを使ってESP32にUploadしています。
    • Uploaderの説明は、ここ を参照下さい。
  • SDカードにフォントと”url”ファイルを保存しておいて下さい。

実行結果

スケッチは以下の順に実行されます。

  • 背景を表示
  • フォントの読み込み
  • WiFi接続
  • 準備完了

表示用窓に状態を表示しながら実行して行きラジオ局名が表示されたら準備完了です。

この状態で表示用窓にタッチするとラジオ局選択用画面が表示されます。

  1. 予め登録していたラジオ局が6局分表示されます。
  2. リストのトップに現在のラジオ局が赤字で表示されます。
  3. リスト移動用のスライドバー。
  4. リストが1つ上へ移動
  5. リストが1つ下へ移動
  6. ラジオ局を選択してメインへ
  7. 選択無しでメインへ

表示されているラジオ局にタッチするとそれが選択され赤表示に、選択されていたものは白表示になります。3,4,5を使いながらリストを移動させラジオ局を選択します。最後に6を押せばラジオ局は選択されているものに、7を押せばこの機能に入る前のラジオ局(変更無し)になります。メインに戻ると表示用窓に選択したラジオ局が表示されています。スタートボタンを押せば選択したラジオ局を聴くことが出来ます。

スケッチの簡単な説明

  • void make_url()
    • 登録されたリストから局名とURLの2つのStringを作成。
    • URLはst_list[0]に、ラジオ局名はst_list[1]に区切り文字を改行”0x0A”として作成。
    • この2つのStringを元にラジオ局名とURLを求めています。
    • イメージはこんな感じ
  • ボタンの処理
    • 前回はボタンの処理に外部変数int btn_area[][4]を定義してボタンの範囲をそこに保存していました。
    • ラジオ局選択用画面にはボタンが11個(6行の欄もボタン)。メインの画面は8個有ります。
    • これらのボタン処理を同じ関数で行う為、メイン、選択関数各々でボタンの範囲を保存した配列を宣言しそれを外部変数int btn_area[][4]にコピーしています。
    • こうすると画面が変わっても同じボタン処理関数が使えます。
  • 状態パラメタ変数
    • playerの状態を保存する構造体 typedef struct player_state{を使用しています。
    • typedef struct player_state{ int selected_no; //選ばれている局の番号 int st_max; //登録されているラジオ局の数 int vol; //ボリュームの値 bool flg_mute; //Muteのオンオフ bool flg_play; //再生のオンオフ } player_state; player_state pl_st;

次回は

Web Radioの再生のみですが、だいぶMedia Playerらしくなって来ました。次回はRadikoの再生につて説明します。