M5Stack の液晶ディスプレイ ILI9341 をちょっと解明してみた

M5stack,ライブラリに頼らずに、TFT,LCD,ILI9341,をちょっと解明 M5Stack

こんばんは。

前回に引き続き、話題の M5Stack ( ESP32 搭載 )を掘り下げていこうと思います。

今回は、SPIインターフェース接続の液晶ディスプレイ ( LCD ) ILI9341 を自分なりに解明してみようと思います。

2019年7月以降生産のM5Stackは、LCDパネルがILI9342C というIPSタイプに変更されています。
その場合、色が反転しますので、Invert(色反転)0x21コマンドを送信必要があります。
スケッチも修正して、146行目の反転コマンドをコメントアウトしてあるので、コメントを解除してコンパイルしてみてください。
新型M5StackのIPSディスプレイや、色反転については以下の記事を参照してください。
M5Stack FIRE (PSRAM付き)およびIPSタイプのLCD ILI9342Cを使ってみた
(2020/01/09)

 

実は、当ブログをご覧になっている方から、コメント投稿で、ILI9341 ライブラリ作成を要望されたり、別のディスプレイで作った私のライブラリを、ILI9341用に改変して工作して報告して下さった方がいらっしゃいました。
こちらを参照

私自身、2.4インチサイズの ILI9341 は1年以上前に購入していたものの、極小 OLED ( 有機EL ) SSD1331 でかなり満足していたので、後回しにしていました。
でも、M5Stack という魅力的な製品が話題になってきたため、さすがに無視できなくなりました。

ということで、いつものごとく、M5Stack 標準のライブラリにできるだけ頼らずに、ILI9341 のデータシートをにらめっこしながら、LCD ( 液晶ディスプレイ ) ILI9341 を自分なりに解明して、デモプログラムを作成してみようと思います。
M5Stack ライブラリでも十分使用できるのですが、私は日本語漢字フォントを自由に使いたいので、プログラムを解明して、自分用のライブラリを作成しなければなりません。

では、早速グラフィック描画デモを作成してみたので、以下の動画をご覧ください。

いかがでしょうか。

面の塗りつぶしが、かなり高速だと思いませんか?
実はこれにはちょっとした秘密があります。

では、Arduino core for the ESP32 を使って説明したいと思います。

因みに私はアマチュアで、プログラミング素人です。
以下で紹介することは誤っていたり、無駄が多いかもしれません。
もし何かありましたらコメント投稿等でご連絡いただけると助かります。

また、ソースコードは無保証です。

スポンサーリンク

使用するもの

M5Stack

M5Stack は Espressif Systems 社製チップ ESP32 を搭載していて、日本の電波法をクリアした技適取得済みのモジュールです。

●2.4GHz帯 Wi-Fi 通信
●Bluetooth通信
●micro SD カードスロット
●4MBフラッシュメモリ
●バックライト付き液晶ディスプレイ ILI9341
●ユーザーボタンスイッチ3個
●スピーカー
●Grove コネクタ1系統
●USB Type C コネクタ

ザっとこんな感じのものがコンパクトなボディーに収められた、全部入りモジュールっていう感じです。

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

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

 

Amazon.co.jp で購入する場合、おすすめはスイッチサイエンスさん販売のものが信頼出来て良いと思います。

私の場合は、9軸センサー付きグレーのものを購入しましたが、Basic でもOKです。

パソコン等

私の場合は Windows 10 を使用しています。

Arduino core for the ESP32 をインストールしておく

パソコンに Arduino IDE と、Arduino core for the ESP32 をインストールしておいてください。
Arduino IDE は 1.8.5 で動作確認しています。
インストール方法は以下の記事を参照してください。

Arduino core for the ESP32 のインストール方法

M5Stack ドキュメントをダウンロードして参照しておく

まず、M5Stack 内部で、LCD ( 液晶ディスプレイ ) とどのように接続されているか知る必要があるので、M5Stack のドキュメントを確認してみます。
WEBドキュメントは以下のページで確認できます。

https://docs.m5stack.com/#/en/core/basic?id=description

ここには GPIO のピンアサインが書いてあって、便利です。

その他、Espressif Systems 社の ESP32 の最新データシートも合わせて確認しておいた方が良いと思います。
ESP32 は M5Stack では chip revision 1.0 になっています。

https://www.espressif.com/en/support/download/documents

ESP32 は頻繁にデータシートやテクニカルリファレンスマニュアルがアップデートされているので、常に最新版をチェックしておきたいですね。
気付かないうちにとんでもない変更がされていることもしばしばです。

ESP32 のチップ情報を確認するためには、以下の記事を参照してください。
ESP-WROOM-32 ( ESP32 ) チップ・メモリ・MACアドレス情報取得方法

TFT LCD ( 液晶ディスプレイ ) ILI9341 データシートを参照

LED バックライト付き、TFT LCD ( TFT 液晶ディスプレイ ) ILI9341 のデータシートは必ずダウンロードしてチェックしなければなりません。
とりあえず、ネット上ではver 1.11 がありました。

https://www.crystalfontz.com/controllers/Ilitek/ILI9341/

英語版なので、Google 翻訳を使いながら理解していきました。

TFT LCD ILI9341 について

つい最近使い始めたばかりで、正直詳しくは知りません。
でも、安価なことから、随分前から電子工作界隈で人気の液晶ディスプレイモジュールです。

私も1年以上前、Amazon.co.jp で タッチセンス付きの2.4インチ ILI9341 ディスプレイを買ったことがあります。
これ、M5Stack と並べてみるとこんな感じになります。

これを見て分かる通り、M5Stack のディスプレイがあまりにも小さいと思いませんか?

前回の記事で、M5Stack を分解してみて、このディスプレイがあまりにも小さく、FW-TFT020 という印刷がありました。
それから M5Stack のドキュメントを見ると、ILI9341 と書いてあって、「ウソでしょ?」と思いました。
20インチくらいに見えたので、そのサイズの ILI9341 ドライバ付き TFT をネットで探しましたが見当たらなかったので、何かの間違いじゃないかと思いました。

でも、ILI9341 のデータシート通りにプログラムを組むと正常に動作したので、ILI9341 ということで問題ないと思います。
これ、M5Stack の特注なんですかね?

ILI9341 は ILITEK 社の TFT LCD 用 シングルチップドライバーです。

M5Stack の TFT LCD ILI9341 は、このサイズで 320 x 240 pixel です。
かなり細かいです。
その他、データシートを見てみると、主な特徴は簡単に言うと以下の通りです。

●3wire/4wire SPI 通信の他、高速の8bit~18bitパラレルインターフェースも装備。
●262,144色まで表現可能
●6/16/18ビットデータバスRGBインターフェース、VSYNCインターフェース装備
●動画領域と静止画領域を独立して同時表示可能
●8色表示スリープモードあり

なんかスゴイです。
特に、動画表示機能には興味ありますね。
低価格なのに、超高機能盛り沢山です。

ただ、残念ながら M5Stack 内では 4wire SPI 接続しかされていません。

では、次ではその接続状況を説明します。

M5Stack の TFT LCD と ESP32 の GPIO 接続状況

TFT LCD ILI9341 と ESP32 は、ドキュメントを確認すると、4線の SPI インターフェースで接続されていました。
以下の様な感じです。

LCD SCK — ESP32 GPIO #18
LCD MISO — 接続無し
LCD MOSI — ESP32 GPIO #23
LCD CS — ESP32 GPIO #14
LCD D/C — ESP32 GPIO #27
LCD Reset — ESP32 GPIO #33
LCD BackLight LED — ESP32 GPIO #32

これは、ESP32 の VSPI 接続です。
ということは、M5Stack のドキュメントによれば、TFcard ( micro SD card )の接続も VSPI になっているので、ディスプレイと micro SD カードを同時に使う時に問題になります。
VSPI については以下の記事を参照してください。
ESP32 の SPI_MODE が修正。HSPI , VSPI , 複数SPIデバイス制御 , SPI高速化などについて

micro SD カードは SPI モード通信でも、高速対応カードを使えばかなりの高速通信が可能です。
その点、TFT LCD ILI9341 はそれほど高速 SPI 通信はできないので、クロック周波数をプログラム上で切り替える必要があります。

私の個人的感想では、ILI9341 は HSPI 接続にすれば良いのに・・・、と思いました。

でも、M5Stack の拡張性を考えると、あまり GPIO を潰してしまうのはもったいないだろうとも思います。

Arduino – ESP32 用の M5Stack ライブラリのソースコードを見てみると、要所要所で クロック周波数を指定しているので、micro SD カードでも問題無く動作するように作られていました。
ただ、これだと micro SD カードの高速性があまり活かせないなぁと思いました。

また、ILI9341 と SPI 通信を行う時、ESP32 から出力された SPI 信号をオシロスコープとかロジックアナライザーで見たいなぁと思いましたが、残念ながらその GPIO 端子は出ていませんでした。

では、次ページでは TFT LCD の Pixel の並び方を見てみたいと思います。

コメント

  1. マッキー より:

    お久しぶりです。
    私も昨年末M5を入手しテストしてます。
    2月のコメントでILI9341をと書いたのはこのためでした。
    情報が少なく困ってました。
    wifi接続、SSL通信非常に参考のなりました。
    M5はアリエクスプレスで入手しましたが、アマゾンあたりは欠品してるみたいです。
    余談ですが、ESP32の試作ケースは3Dプリンターで作ってます。
    FreeCADっていうソフトですがなかなか良いです。無料ですし、オープンソースでパイソンで動いてます。
    画像が添付できればお見せしたいところです。

    今後ともご活躍ください。

    • mgo-tec mgo-tec より:

      マッキーさん

      ご無沙汰しております。
      再度ブログにお越しいただき、そしてコメントいただき、ありがとうございます。

      そうだったんですね。
      M5stackを既に試されていたんですね。
      今はネットではESP32開発ボードよりも情報が多いくらいになっていて、M5stckを動かすには苦労しなくなっていますね。
      しばらくこのブームは続きそうです。

      3Dプリンターでケース作っているとはスゴイですね。
      私はしばらく使っておらず、使い方を忘れてしまいました。
      いつか挑戦してみようとは思っています。
      今後、M5stack用のライブラリを作ったりしていこうと思っています。

      マッキーさんも今後いろいろオモシロイ物を作って、ご活躍なさってください。

  2. マッキー より:

    ありがとうございます。
    ILI9341で通常の動作はさせましたが、前回お願いしたのは、漢字表示をさせたいためSSD1331のような漢字表示ライブラリーが欲しかったのです。
    中華製の漢字ROM、GT20L16J1Yを使って表示しましたがいまいちでした。
    余談ですが、M5stackでオシロスコープもすんなり動きました。
    無理ばっかり言ってすみません。(._.)

    • mgo-tec mgo-tec より:

      私自身も漢字表示ライブラリーが欲しいと思っています。
      今、取組中作業があるので、それが終わってから作成しようと思っています。
      もうちょっと時間がかかりますので、しばらくお待ちください。

  3. あいむ より:

    こんにちは。

    私も前々から気になっていたM5Stackをようやく購入できたので、色々なサンプルを動かしてどんなものか確認しています。今日は、このページのスケッチを動かしてみました。問題なく動作していましたが、まだ、ソースコードは全く見ていませんので、後でじっくり読んでみようと思っています。

    私はiPhoneのプログラマーなので、iPhoneとESP32をBLEで通信させた物を作っています。M5Stackがあると開発がスムーズに進められるようなので、うまくいったらESP32のプリント基板を自作してみようと思っています。

    私もM5Stackで、日本語表示してみたいです。

    では、では。

    • mgo-tec mgo-tec より:

      あいむさん

      記事をご覧いただき、サンプルスケッチを試していただき、ありがとうございます。

      iPhone と BLE通信はイイですね!
      私はまだ BLE は試していません。
      Wi-Fiすら把握し切れていない状態です。

      確かに、M5stack を使うと開発がスムースになりそうですよね。
      何かオモシロイものができるとイイですね。

  4. あいむ より:

    アマゾンで購入しておいた1,186円のILI9341のLCDディスプレーモジュール基板が今日到着したので、このページのTFT LCD ILI9341 と ESP32の配線を参考に配線して、このスケッチを動作を確認したので報告します。

    M5Stackと同じように表示しました。が、XとYが逆になっていて、一部が表示されませんでした。たぶん日本語のスケッチも動くと思います。

    これから作る予定のESP32のプリント基板は、このILI9341のLCDが使えることが分かったので、表示装置はこれを使おうと思います。まだ、ライブラリーのソースコード見ていませんが、あとで修正できるか検討してみようと思います。

    • mgo-tec mgo-tec より:

      あいむさん

      ご報告ありがとうございます。
      私も、2~3日前、Amazon で購入した サインスマート販売の 2.2 インチ ILI9341 は動作確認しました。
      ライブラリの
      ESP32_LCD_ILI9341_SPI.cpp
      91行目をコメントアウトして、92行目のコメントを解除すると XY 正しく表示されました。

      ただ、Hiletgo の 2.4インチのものはピン配列が謎で断念しました。

  5. あいむ より:

    もう修正してあったのですね。

    教えていただいたESP32_LCD_ILI9341_SPI.cppを修正したらXYが正しく表示されました。ただ、Yahooニュースをスクロールするスケッチを動かして見たのですが、今度はスクロールする文字列が横に長くて2文字くらいしか表示しなかったです。

    同じILI9341のLCDでも色々とありそうですね。
    今度は、1,490円のILI9341の2.8インチのタッチパネル付きを購入したので、届いたらこちらも動作確認してみます。

    • mgo-tec mgo-tec より:

      あ、そうなんですね。
      サインスマートの ILI9341 は問題無く表示されましたけどね。

      ILI9341_Init関数は最小限の初期化コマンドしか使っていないので、やっぱり M5stack 標準ライブラリにあるように、ズラーッと初期化コマンドを使った方が正常に動作されるかも知れません。
      まだ使いこなせていないコマンドが多いです。

      今後、気付いたところは改良していきたいと思っています。

  6. kazu より:

    こんばんは
    Atom Liteに書き込みをしてみました。ILI9341の接続をどうしたらいいのかわかりません。
    といっても元々無理なことをしているのかもしれません。

    • mgo-tec mgo-tec より:

      kazuさん

      記事をご覧いただきありがとうございます。
      残念ながら、私はAtom Liteを持ち合わせていませんので、動くかどうか私には分かりません。

      ところで、M5StackやESP32でディスプレイを高速表示させるライブラリを作っているらびやんさんという方がおられます。私が尊敬するお方です。
      その方は超プロフェッショナルなので、恐らく、Atom LiteとILI9341に関しては熟知していると思います。
      TwitterかGitHubで質問してみるという手もあるかもです。

      というわけで、お役に立てず、すみません。

  7. haiga より:

    mgo-tecさま

    いつも有用な記事を拝見させて頂き、当方のCMに関連するツールに様々に使用させて頂いております。ありがとうございます。

    さて、最近、Amazon等でILI9341ドライバー仕様で320×480解像度の3.5インチLCDが売られておりますが、240×320のLCDをこれに変更できれば、エリアが2倍に広がります。

    mgo-tecさまのLCDドライバーの何処を変更すれば、このLCDに対応できるか((319,239)と記述している部分?)が知りたいと思い書込みした次第です。

    /haiga

    • mgo-tec mgo-tec より:

      haigaさん

      記事をご覧いただき、ありがとうございます。

      ILI9341の倍画面ですか~…。
      実機で確かめてみないと何とも言えませんが、今の私には実験する時間がまったく無く、最近はしばらくESP32もM5Stackも触っていないので、あまりお役に立てないかも知れません。
      この記事のソースコードならば、319, 239 のところを書き換えれば、もしかしたら動くかもしれませんが、何とも言えません。

      また、この記事は古く、未熟なプログラムで、他の私の自作ライブラリのドライバーも素人コードで動作が遅いです。

      お勧めなのは、「らびやん」さんのESP32, M5Stack用LCDドライバーが遙かに高速で、様々なLCDに対応していて、今やM5Stackの標準ライブラリになっています。
      LovyanGFXというものです。
      Arduino IDEからでもライブラリマネージャでインストールできると思います。
      使い方は私には解りませんが、ネットでもかなり情報が出ているので、是非試してみて下さい。
      おそらく、倍角のILI9341ドライバーにも対応していると思います。

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