M5stack ( ESP32 搭載 )で、Wi-Fi 接続して、Yahoo! ニュースを4記事同時スクロールしてみた

記事公開日:2018年4月27日

こんばんは。

前回に引き続き、M5stack の TFT LCD ( 液晶ディスプレイ ) ILI9341 に日本語漢字フォント表示させる実験です。
今回は、さらに応用して、Wi-Fi でアクセスポイントに接続して、Yahoo! Japan サイトの RSS ニュース記事を取得して表示させてみます。

その前に、Fabcross さんの以下の記事で、Google Home と連携したオモシロイ記事が上がっています。

液晶付きマイコン「M5Stack」 と Google Home で、子どもとメッセージがやりとりできるシステムを作ってみた

ここで、私の作った日本語フォントライブラリが使われていました。
こんなメジャーなサイトで紹介されてしまうと、安易に更新できなくなってヤバイです。

私も近々、Google Home と連携させようと思っていて、先を越された感じです。

スポンサーリンク

ただ、東雲フォントのダウンロードリンクが、私が昔作ったリボジトリの直リンクになっていました。
そこからダウンロードされてしまうと、東雲フォント開発者をスルーしてしまいます。
やはりこれは開発者サイトからダウンロードしていただきたいなと思いました。
これは Public Domain ライセンスですから、自由に再配布しても問題ないのですが、やっぱり開発者の古川泰之さんや/efont/さんに敬意を表して、開発者元のサイトからダウンロードしていただきたいと思いました。
私自身も再配布したリンクを載せてしまっていて、これはあまりよろしくないないなぁと思いました。
もし、これからダウンロードされる方は後で記述してあるリンクを辿って、元記事サイトからダウンロードしていただきたく思います。

さて、過去、このブログで何度もニュース記事を小さな有機 EL ディスプレイや LEDドットマトリックスなどに表示させてきましたが、M5stack のような大きなディスプレイに表示させることは初めてです。

以前、こちらの記事のコメント投稿で私のプログラムを改変して ILI9341 に4行ニュース記事を表示させた方がいらっしゃいました。
仮想VRAMを使っていて、とてもスムースにスクロールしていました。
時計表示も同時にスクロールしていて、スゴイなぁと思いました。
私にはその方法はサッパリわからず、そんな高度なことはできないので、基本的なライブラリでこのディスプレイ一杯にニュース記事をスクロールしてみたいと思います。
以下の動画をご覧ください。
micro SD カードからフォントを読み込んだ場合と SPIFFS からフォントを読み込んだ場合で比較しています。
それと、ちょっと痛いニュースがあったので、モザイクかけています。
見にくくてスミマセン。

いかがでしょうか。
こういうニュース記事の電光掲示板動画って、公開するのが難しいですね。

文字スクロールに絞ってみると、前回記事から改良したところは、1文字分スクロールし終えたら、SPIFFS や micro SD から1文字分のフォントを読み込んでいるところです。
前回記事のライブラリでは、多量のSRAM メモリを消費してしまったので、それを節約するためです。
前回記事のままだと、Yahoo! ニュース記事は2列が限界でしたが、節約したことによって倍の4列表示が可能になりました。
それでも、スクロールするためのバッファはグローバル変数領域に置かなければいけなかったので、メモリを圧迫していることに変わりはないのですが、私の素人頭脳ではこれが精一杯です。

比較して分かるのは、スクロール速度が速くなると、SPIFFS よりも断然に micro SD の方がスムースですね。
micro SD カードの方が、SPIFFS より格段に読み取り速度が速いということです。

それと、ニュース記事をWeb から Get している間、スクロールを停止するようにしました。
M5stack の場合、LCD と SDカードが共通VSPI 接続なので、マルチタスクは上手く動作しませんでした。
その代わり、下の欄にメッセージを出すようにしました。
見ての通り、micro SD の方が格段に読み取りが速いことが分かります。
SPIFFS の方は文字列の変換に時間がかかっていて、メッセージがなかなか消えないですね。
でも、SPIFFS はある程度マルチタスクが効くので、読み取り中にメッセージ点滅などの同時動作ができることが利点です。

M5stack は micro SD カードスロットが付いているので、手軽ですね。
これだけ手軽だと、SPIFFS にこだわらなくても、全て micro SD で良いと思えてきます。
ただ、次で述べるように、それぞれ一長一短があります。

M5stack で LCD 表示と micro SD や SPIFFS を同時に使う場合の難しいところ

M5stack は、LCD ILI9341 と VSPI 接続されています。
また、micro SD カードスロットも VSPI 接続されています。
(VSPI や HSPI については以下の記事を参照してください)
ESP32 の SPI_MODE が修正。HSPI , VSPI , 複数SPIデバイス制御 , SPI高速化などについて

ということは、LCD ディスプレイを駆動しながら micro SD カードを読み書きする場合、CS ( Chip Select )ピンで切り替えるために、LCD動作が停止したり、画面にノイズが出たりしてしまいます。

また、ESP32 のマルチタスクをデュアルコアで動作させる場合、例えば、LCD ディスプレイをコア1 で動作させていて、micro SD をコア0 で同時動作させる場合はいろいろ問題が生じてきます。
コア1の LCD が動作中に、コア0のmicro SD がアクセスしようとすると、CSピンが切り替わるので、LCD にノイズが走ったり、LDC動作が止まったりしてしまいます。
ですから、M5stack のようにLCD と micro SD が共通のVSPI接続の場合は、LCD の動作が止まらないように micro SD カードを同時駆動させることは難しくなります。
特に、私の場合はフォントを読み込むために頻繁に micro SD カードにアクセスさせるので、仕方なくマルチタスクは諦めました。

ただ、それでも micro SD カードと LCD ディスプレイを共通の VSPI で切り替えて制御するためには、コマンドやデータを SPI ライブラリで送信する前に、クロック設定や SPI モード設定をしなければいけません。
データシートによると、ILI9341 の SPI クロック周波数は最高 10MHz と記載してあり、SPIモードで使用する micro SD カードは、ESP32 の場合、本来は 24MHz が限界です。
でも、M5stack の標準ライブラリでは両方とも 40MHz でプログラムされていました。
私も試してみましたが、それで特に問題無く動作しました。
これはなかなか速くて良い感じです。

また、micro SD ではなく、SPIFFS フラッシュからフォントを読み込む場合を考えてみます。
LCD で文字列スクロールしている最中に別のタスクで SPIFFS からフォントを読み込もうとすると、どうしても、LCD がカクカク動作になってしまいます。
ただ単に読み取り速度が遅いだけなのか良く分からないのですが、今回の場合のようにスクロールする度にフォントを1文字読み込むような動作はあまりスムースにいきませんでした。

ただ、動画にあるように、メッセージを点滅させている最中にフォントを読み込むということはできました。
残念ながらスクロールを止めずに読み込むことはできませんでした。
どうしても、UTF8文字列から Shift_JIS に一気に変換する場合にスクロールがストップしていまいます。

結局いろいろ試してみたのですが、SPIFFS と LCD のマルチタスク同時操作も諦めました。

今回のマルチタスク動作実験は私の方法が間違えているのかもしれません。
みなさんどうやっているんでしょうかね?
もし、良い方法があるのなら教えていただきたいものです。

LCD が HSPI 接続されていれば、micro SD と同時操作できて、LCD が止まることはないんですけどね。
次期のM5stack では、LCD接続が HSPI と VSPI でユーザーが選択できるようなシステムがいいなぁと思いました。

ということで、今回は micro SD や SPIFFS アクセス中は LCD の動作を一時停止することにしました。

使うもの

M5stack

日本の電波法をクリアした、Espressif Systems 社製 ESP32 を搭載した、技適取得済み Wi-Fi & Bluetoothマイコンモジュールです。
320×240 pixel TFT 液晶ディスプレイ、micro SD カードスロット、スピーカー、USB-TypeC、Groveコネクタ等を搭載していて、とても使い勝手が良いです。

これを以前、分解したりして、外観レビューしていますので、以下の記事を参照してみてください。

M5stack ( ESP32 搭載 ) を分解したり電源を入れてみて、いろいろ思ったこと

micro SDHC カード

私が購入したものは以下のもので動作確認しております。
M5stack ではあまり関係ないかもしれませんが、読み書き速度が速い、class 10 以上を使った方がよいかも知れません。

2.4GHz帯 Wi-Fi ルーター環境

インターネットに接続された、2.4GHz 帯の Wi-Fi ルーター(アクセスポイント)環境が必要です。
セキュリティを強化している方は、予め M5stack の ESP32 チップが Wi-Fi に接続できるように設定しておいてください。
特に MACアドレスフィルタリングや、ファイアウォール設定をしている場合はその設定解除等をしておいてください。
M5stack の ESP32 チップの MAC アドレスを調べる方法は以下の記事を参照してください。

ESP-WROOM-32 ( ESP32 ) チップ・メモリ・MACアドレス情報取得方法

では、次のページではライブラリ等のインストールについて説明します。

スポンサーリンク


mgo-tec電子工作 関連コンテンツ ( 広告含む )

投稿者:

mgo-tec

Arduino , ESP32 ( ESP-WROOM-32 ) , ESP8266 ( ESP-WROOM-02 )等を使って、主にスマホと連携した電子工作やプログラミング記事を書いてます。ライブラリも作ったりしてます。趣味、独学でやってますので、動作保証はしません。 電子回路やプログラミングの専門家ではありません。 畑違いの仕事をしていて、介護にドップリ浸かりそうな年配者です。 少しだけ電気の知識が必要な仕事なので、電気工事士や工事担任者等の資格は持っています。

「M5stack ( ESP32 搭載 )で、Wi-Fi 接続して、Yahoo! ニュースを4記事同時スクロールしてみた」への4件のフィードバック

  1. 2つのスケッチ(SPIFFSとSD-Card)が、問題なく動作したので報告します。M5Stack用のソフトは、ハードを配線しなくて良いので楽ですよね。

    SD-Cardの方は、私のパソコンにはESP32_SD_ShinonomeFNTとESP32_SD_UTF8toSJISの2つのライブラリーが入っていないのでエラーが出ましたが、検索して見つけたページからダウンロードしたものを使いました。また、最初SD-Cardにフォントファイル(fontフォルダー)をコピーしなかったので、何も表示されませんでしたので、ちゃんとSD-Cardを入れたら動きました。

    例のごとく、このブログ内容とソースコード+ライブラリーはまだ全然読んでいないので、またM5Stackをいじるときにじっくりみてきます。現在頭が本業のiPhoneソフトの開発モードなので。

    1. あいむさん

      いつも動作確認報告ありがとうございます。
      m(_ _)m
      一応、記事中に ESP32_SD_UTF8toSJIS と ESP32_SD_ShinonomeFNTライブラリ は別記事を参照してインストールするように促していましたが、やっぱり長い文章なのでスルーされてしまうかもしれませんね。
      私自身もそうですが、やっぱりユーザー目線で見ると、パッと見て分かる方が良いのかもしれません。
      いろいろ考え直してみます。

      ソースコードを見られるのは、突っ込まれる要素満載なので、iPhone ソフト開発されている方々に見られるのは辛いものがあります。
      何か気付いたことがあればコメント頂けると助かります。
      iPhoneソフト開発がんばってください。

コメントを残す

メールアドレスが公開されることはありません。

*画像の文字を入力してください。(スパム防止の為)