M5Stack で、Wi-Fi 接続して、Yahoo! ニュースを4記事同時スクロールしてみた

M5Stack,で,Yahoo,ニュース記事を4行同時スクロール表示させてみた M5Stack

こんばんは。

前回に引き続き、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 Basicは、この記事を書いた当時より格段にバージョンアップしております。
以下のスイッチサイエンスさんの公式サイトをご参照ください。
https://www.switch-science.com/collections/%E5%85%A8%E5%95%86%E5%93%81/products/9010

※M5Stack Gray(9軸IMU搭載)現在は販売終了しております

 

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

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アドレス情報取得方法

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

コメント

  1. あいむ より:

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

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

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

    • mgo-tec mgo-tec より:

      あいむさん

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

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

  2. マッキー より:

    こんにちわ

    さっそく動作確認させていただきました。
    とりあえずご報告まで

    • mgo-tec mgo-tec より:

      マッキーさん

      いつもご報告感謝いたします。
      動いてくれるとウレシイですね。
      ありがとうございます。

  3. H.W より:

    mgo−techさん、H.Wです。

    以下の報告、上手くUP出来なかった様ですので再度UPさせて頂きます。

    1.Yahoo!ニュース4行記事同時スクロールの件
    1)画面最下部の「Get OK!」以降の時分表示ですが、一桁の時に直前に’0’が挿入されないので、表示に多少違和感があります。
    →シリアルモニターの表示と同様に、#186行を以下のように書き換えられた方がよいのではないでしょうか?
    #186 : Message( ” Get OK! ” + String(web_get_time ) );
    (その前に以下の宣言文を2行追加)
    char web_get_time[6];
    sprintf(web_get_time, “%02d:%02d”, hour(), minute()); //ゼロを空白で埋める場合は%2dとする

    2)タクトSWの’C’を短押し&長押ししてもスクロール速度が殆ど変化しない。
    →SWITCH文内の#250行のインクリメント文と#256行のディクリメント文が逆になっていないでしょうか?

    2.その他の件
    1)当初から、どのスケッチのFlash時にも、’connection …—…—…—’が永遠に続いて書き込みができませんでした。
    →EN端子とGND端子間にコンデンサ(0.22~2.2μF)を入れる対処Tipsが出されており、取り合えず手元にあった1.5μFのフィルムコンを挿入すると書き込みができるようになりました。(再現性あり…)
    この対応策は妥当でしょうか? それともM5stackのロットによるものなのでしょうか?

    尚、本体側にチップセラミックコンを実装対応されてる方もおられるようですが、 mgo-techさん含めて他の方々はどうされてるのでしょうか?

    以上、宜しくご検討お願い致します。

    • mgo-tec mgo-tec より:

      H.Wさん

      いつも当ブログをご覧いただき、ありがとうございます。

      まず、回答です。
      1-1) の件は把握しておりましたが、これは要は私の手抜きです。
      メッセージの受信時間さえ把握できれば良いだけのメッセージなので、あまり表示はこだわりませんでした。
      確かに、シリアルモニターにはちゃんと出力しているんだったら、こちらの方をちゃんとやれば良いのにというお話ですね。
      私もそう思いましたので、早速直しました。
      今後のスケッチも所々手抜きがありますが、その辺は個人ブログなので何卒ご容赦ください。

      1-2) スクロール速度あまり目立った変化はありませんが、確実に変化していると思います。
      瞬時押しが減速、長押しが加速ですので、スケッチは問題ないと思います。
      ただ、scl_speed は増加で減速、減少で加速という値になっています。
      実は、これは、scrolle interval 値に名前を変えた方が良かったかもしれません。
      これは変数名が良くありませんね。
      趣味独学だと、こういうところが適当でスミマセン。
      今後新たにプログラムを組む時には気を付けたいと思います。
      因みに、記事を4つもスクロールさせると、速度は遅いのであまり変化しないと思います。
      それよりも、文字サイズを変えた方がスクロール速度は劇的に変わりますね。
      それはブログ記事にも書いてある通り、あまり意味がない操作ボタンとなってしまいました。
      その辺は販売品のように作り込んでいないので、あとは皆さんで改良していっていただければと思います。

      2-1) は SPIFFS データではなく、スケッチを M5stack に書き込むという認識でお話します。
      1~2年前の ESP32 ( ESP-WROOM-32 )関連開発ボードは、ESP32 の Revision が 0 が殆どでした。
      その場合は、USBシリアルの書き込みバグが Espressif 公式でも発表されました。
      そこで、EN端子にコンデンサを追加するという方法が有効だったのですが、Arduino core for the ESP32 のソフトウェア上でかなり改善され、Rev 0 でも特に問題無く書き込みできるようになりました。
      M5stack は殆ど Rev 1 なので、改善された ESP32 が使われているはずですので、あまり書き込みできないという情報は私は聞いておりません。
      Mac の場合は、USBドライバをまずインストールしなければうまくいかないようです。
      Windows 10 の場合は接続した時点で自動的にドライバインストールされます。
      もし、気になるようでしたら、Facebook のESP8266/ESP32環境向上委員会に質問してみてはいかがでしょうか?
      そちらの方がプロフェッショナルが沢山いらっしゃるので、確実な情報が得られると思います。

      別件ですが、Wi-Fi が接続できない問題は一つ原因が見つかりました。
      私のESP32_WebGetライブラリの EWG_AP_Connect 関数内に、Serial.begin(115200); があり、Serial.beginが二重使用されていたことが原因でした。
      これについさっき気付きました。
      随分昔にこの症状に気付いていたのですが、しばらくこの関数を使うブランクがありすぎて、思い出すのに時間がかかりました。
      まだ完全解決ではないのですが、これも一つの原因です。
      大変失礼しました。
      m(_ _)m

  4. H.W より:

    mgo-techさん、H.Wです。
    ご多忙中、余計なお世話に早速対応して頂き有難うございます。
    時間表示の前の’0’はなくてもよいかと思いますが、分表示の前にはやはり’0’挿入があった方がよい様に思いましたので、敢えて提案させて頂きました。

    スクロールの件については、シリアルモニターを見ながら、数値が増えた方が速度が増すものと勝手に思い込んでいたものですから、的外れな指摘となってしまい大変失礼致しました。

    また、m5stack(というかESP32)のスケッチ書き込み時の不具合対応経緯についてご説明頂き有難うございます。
    ということは、現時点では本来EN端子とリセット端子間にコンデンサー等を追加しなくてもよい仕様に改善されている筈なんですね?
    (確かに、この商品の’開発システム’という性格があるとは言え、ユーザ側で前記の様な対応をしなければならない様では多少問題ですものね?)
    何れにしても、購入したスイッチサイエンスさんに先ずその旨問い合せしてみようと思います。
    ご教示有難うございました。

    • mgo-tec mgo-tec より:

      H.Wさん

      いろいろご指摘ありがとうございます。
      何かと手抜きが多いかと思いますが、今後とも気楽に作っていきたいと思いますので、どうかご容赦くださいませ。

      M5stackについては、確かに正規代理店のスイッチサイエンスさんにお問い合わせするのが一番良いと思いますね。
      原因が判明するといいですね。

タイトルとURLをコピーしました