ESP32とLCDシールドの組み合わせでLogicool G13が無くてもフルスクリーンのFF14でDPSを見れるようにしてみた

アイキャッチ・ESP32とLCDシールドの組み合わせでLogicool G13が無くてもフルスクリーンのFF14でDPSを見れるようにしてみた ACT

先日、Arduino UNOというマイコンとLCDシールドを使ってACTの値を外部液晶ディスプレイに表示する手法を紹介しました。

Logicool G13が無くてもフルスクリーンのFF14でDPSを見れるようにArduinoでACTの値を表示するプラグインを作ってみた
私はFF14をフルスクリーンモードでプレイしており、必ずACTも起動しています。 ですが、ACTのDPS値をゲームプレイ中にリアルタイムに表示するためにはオーバーレイプラグイン等を使わなければなりません。 ここで問題は、この手のプラグインは...

この記事でも書いたのですが、Arduino自体の性能はもともとあまり高いものではなく、標準で提供されているLCD描画ライブラリも最適化されていないため描画処理が重いです。

画面を常に凝視しているものではないので実運用上は全く問題無いのですが、Arduinoの他にESP32というマイコンがあり、こちらはArduinoとは段違いの性能且つ、爆速の描画ライブラリが有志によって提供されています。

しかもESP32は開発環境がArduinoと互換性があり、Arduino IDE上でArduinoと同じC言語っぽいソースコードをビルドしてチップに書き込むことができます。

チップの値段、LCDの値段もArduinoと同等か安いぐらいなので、今回はこのマイコンでACTのencdps値を表示してみました。

ESP32は描画が爆速で、画面描き換えが目視できないレベル

Arduino UNOと液晶シールド付属の描画ライブラリでは、encdps値をリアルタイムに描画すると画面描き換えが目に見えるレベルの遅さです。

これはLCD画面を注視していると、絵が変化する部分のちらつきとして表れます。

ですが今回、ESP32とTFT_eSPI-masterライブラリの組み合わせを試したところ、噂に違わず描画処理は爆速で、画面描き換えが全く目視できないレベルでした。

Arduinoと全く同じLCDの描画サンプルプログラムが提供されているのですが、このサンプルの動作速度を見れば一目瞭然です。

このサンプルは液晶画面上に大量のラインや矩形、円、文字列を次々に描画するものなのですが、Arduino版のモッサリ動作に比べて体感で数倍~十数倍の速度で画面が更新されます。

ここまで爆速だと気分がイイですね。・・・まぁ、気分の問題なのですが。

Arduino UNOとESP32のもろもろ比較

そもそもArduino UNOとESP32のスペックにはどのような違いがあるのか表にまとめてみました。

マイコン Arduino UNO R3 ESP-WROOM-32
チップ ATmega328P Tensilica Xtensa LX6
動作電圧 5V 3.3V
Flashメモリ 32KBytes 4MBytes
SRAM 2KBytes 520KBytes
EEPROM 1KBytes 4KBytes(Flashメモリと共有)
クロック周波数 16MHz 32bit Dual-Core 160/240 MHz
Wi-Fi N/A 802.11 b/g/n (2.4GHz)
Bluetooth N/A 4.2 BR/EDR + BLE
PCとの接続 USB(Type B) Micro USB
開発ボードの値段 \500~\3,300 \800~\2,000

開発ボードの値段はAmazonで検索してヒットした商品の値段なんですが、同じArduino内、ESP32内ですら数倍の開きがあります。

いろんなメーカーが互換ボードを発売しているからですが、ArduinoとESP32で比較すると多少ESP32の方が安いかなというぐらいで、両者の値段は大差ありません。

ESP32の方は「開発ボード2個セットで\1,600」とかいう2個セット物が良くヒットしますね。

また、ESP32には最初からWi-FiやBluetoothの機能が付いているので、追加のシールドを購入しなくてもWi-Fi通信やBluetooth接続が使えます。

結局ArduinoとESP32のどちらを使えばいいの?

上の表を見れば明らかなように、性能は圧倒的にESP32の方が高いです。比較にすらなりません。

また、ESP32は開発ボードの大きさがArduinoに比べるとかなり小さくまとまっており、装置全体をコンパクトに作ることができます。

ESP32とLCDシールドの組み合わせでLogicool G13が無くてもフルスクリーンのFF14でDPSを見れるようにしてみた1

上がArduino UNO、下が今回使ったESP32です。

ブレッドボードに配置しているのでESP32側の装置の方が大きく見えますが、コントローラーチップの大きさに着目すればESP32の方が小さいです。

 

値段も変わらず、性能が圧倒的に高く、しかもコンパクトならESP32で決まりじゃないかという話なのですが、1つだけArduinoの方が圧倒的に勝っている点があります。

それはお手軽さ。敷居の低さ。

ESP32は、液晶シールドとコントローラーボードを自分で配線しなければいけません。

また、実際に装置として使うには半田付け作業が必須となります。

一方Arduinoの方は開発ボードに最初からピンソケットが付いており、Arduino UNO向けの液晶シールドであればそのままソケットに挿し込むだけで合体できます。配線とか全く考えずに済みます。

さらにプログラムの開発環境もESP32はArduinoに比べてひと手間多いです。

まず半田付け作業必須と言う時点で、ESP32の方はかなりハードルが上がるのですが、逆に言えばこのハードルさえクリアできるならESP32を使わない理由は皆無という事になりますね。

大まかな手順

ESP32と液晶ディスプレイでACTのencdpsを表示するまでの手順をざっくり説明するとこんな感じになります。

  1. ESP32と液晶シールドをAmazon等で購入。
  2. ESP32と液晶シールドをブレッドボード上で配線する。
  3. ESP32とPCをMicro USBで接続。
  4. フリーの開発ツール Arduino IDEをインストールする。
  5. Arduino IDEにESP32のボード情報を追加インストールする。
  6. TFT_eSPI-masterライブラリをインストールする。
  7. 拙作のESP32用プログラムを、Arduino IDEを使ってESP32に転送する。
  8. 拙作のACTプラグインをACTに組み込み、有効化する。

以上が、とりあえずESP32と液晶ディスプレイでACTのencdps値を表示するまでに必要な手順です。

ざっくり説明の時点でもArduinoに比べて手順が多くなってるのが分かると思います。

しかも、後でも書きますが、ここまでの手順では、あくまで「ブレッドボード上で動作を確認できる」という状態にしかなりません。

実際に装置を使用するためにはブレッドボードのままでは心もとないので、ユニバーサル基板にパーツを移し替えて全ての配線を半田付けする必要があります。

ESP32用プログラム+ACTプラグインのダウンロード

ツールのセットはこちらになります。

dpssender_pack_0_2_0

バージョンはArduino版から進んで0.2.0ですが、Arduino用のプログラムは一切変更されていません。

ACT用プラグインにも変更はありません。

ESP32用のプログラムが追加されているだけです。

このzipを展開すると以下のフォルダ、ファイルになります。

readme.txt(注意書き)

DpsSender.dll(ACTプラグイン・Arduino/ESP32共通)

\act_monitor\act_monitor.ino(Arduino用プログラム)

\act_monitor_esp32\act_monitor_esp32.ino(ESP32用プログラム)

\TFT_eSPI-master\Uer_Setup.h(ESP32用ライブラリヘッダ置き換え用)

動作環境

動作環境についてはArduino版と同じです。

DpsSender.dll

PCに.NET Framework 4.7.1以上がインストールされている事。

Arduino IDE

Javaの実行環境がインストールされている必要があります。

Arduino IDEの公式ページにはバージョンも何も書いてないのですが、私のPCにインストールされていたJRE1.8.0_171で問題なく動作しているので、それ以降のJREが入っていれば大丈夫でしょう。

JREのインストール方法についてはネットに沢山記事が上がっているので、ここでは説明しません。

具体的な手順

パーツの準備

ESP32と液晶シールドを購入します。

ESP32はこちら。

液晶シールドはこちら。

液晶シールドがArduino版と違うのは、電圧がArduinoが5Vに対し、ESP32は3.3Vだからです。

液晶シールドも3.3V仕様の物を使います。

USBハブはセルフパワー、スイッチ付きのものがおススメ

Arduinoにしろ、ESP32にしろ、ACTのencdps値を表示するプログラムを1度転送すると、フラッシュメモリにプログラムが書き込まれます。

1度プログラムを書き込んだ以降は、装置に通電させるだけでそのプログラムが起動します。

つまり、USBポートと装置を接続した時点で液晶画面が点灯し、装置はACTからencdps値が送信されてくるのを待ち続けます。

これでも別に問題は無いのですが、そもそもencdpsの表示が不要な場合は電源をオフにしておきたいですし、プログラムや装置がハングアップして反応が無くなった際には電源を切る以外に復帰方法がありません。

ArduinoやESP32の良いところは電源をOn/Offするとリセットされ、即座にプログラムが再起動する所で、act_monitorの反応が無くなってもUSBハブにスイッチがあれば、これをパチパチとOn/Offする事で復帰してくれます。

こういった点から、セルフパワー且つポート毎にスイッチのあるUSBハブを使用する事をおススメします。

ブレッドボード&ジャンプワイヤー

ESP32で装置を組む場合、コントローラーボードと液晶シールド以外にもいくつかパーツが必要になります。

    1. ブレッドボード(6穴の物が2個)
    2. ジャンプワイヤー

とりえあず動作を確認するためだけに、この2つのパーツが必要になります。

ブレッドボードとは、半田付けをせずに配線を確認するためのパーツです。

本来配線を行う場合はユニバーサル基板上に電子パーツを配置して半田付け作業を行う必要がありますが、ブレッドボードを使うとピンソケットにパーツを挿し込むだけで、その配線で正しく動作するかどうかをチェックする事ができます。

ESP32とLCDシールドの組み合わせでLogicool G13が無くてもフルスクリーンのFF14でDPSを見れるようにしてみた7

この写真はブレッドボードを2個連結して、ESP32と液晶シールドを挿し込み、配線は必要なピン同士をジャンプワイヤーで行っています。

ブレッドボードは必ず6穴の製品を買いましょう。5穴の製品の方が安くまとめ売りされていますが、間違ってそちらを買ってしまうと配線が面倒臭い事になります。

こちらを買っておけば問題ありません。

ジャンプワイヤーは、結構数が必要です。

今回は液晶シールドのピン13本から配線する必要があるので、最低でもワイヤーが13本入っている商品を買いましょう。

長さは10㎝あれば十分です。

が、長さ10cm程度で本数が沢山ある商品というのが見つかりません。

こちらの商品は10本しかワイヤーが入ってませんので、これを購入する場合は2セット必要です。

本数が多いものは、何故か長さが20cmとか言う長過ぎるものしか無いんですよねェ。

ブレッドボードの6穴、5穴の違いについて

ブレッドボードですが、6穴の製品は列がabcdefghijklというように、真ん中の溝を境にして2つの領域に6個づつ穴が空いています。

右端の2列は電源用の穴なので、配線に使えるのは1領域あたり6穴という事ですね。

これに対して良く売られている5穴のブレッドボードは、列がabcde及びfghijで、1つの領域に5個づつしか穴が空いていません。

その代わり、電源用の穴が左右の両方に2列づつあります。

今回、電源用の穴は不要ですし、列の数は多い方が配線がスッキリするので少々お高いですが6穴の製品を買いましょう。

ESP32とLCDシールドの組み合わせでLogicool G13が無くてもフルスクリーンのFF14でDPSを見れるようにしてみた7

この写真は6穴のブレッドボードを2個横に連結し、左側に液晶シールド、右側にESP32のコントロールチップを配置しています。

ジャンプワイヤーがTo Loveるダークネスみたいな触手地獄になってますね。

ESP32と液晶シールドを配線する

ブレッドボード上にESP32開発ボードと液晶シールドを挿し込み、ジャンプワイヤーで必要なピン同士を接続します。

ブレッドボードに挿し込んだ状態を上から見た配線図は下のようになります。

ESP32とLCDシールドの組み合わせでLogicool G13が無くてもフルスクリーンのFF14でDPSを見れるようにしてみた8

これはあくまで、ESP32及び液晶シールドのピン配置がこのようになっている場合の図です。製品によっては規格が同じでもピン配置が異なる場合がありますのでご注意ください。

ブレッドボードは、真ん中の溝を境とした左右の領域それぞれで、行方向には裏側で結線されています。

ですので、行方向にジャンプワイヤーを挿し込めば、同じ行に存在するピンとワイヤーが全て結線される事になります。

つまり、ESP32のピンの隣の穴2つに2本ジャンプワイヤーを挿し込むと、そのピンと2本のジャンプワイヤーが全て繋がった状態になるというわけです。

今回、液晶シールド側のピン2個から、ESP32のピン1個に対して結線する必要がある箇所がいくつかあるため、ブレッドボードが6穴であると非常に捗ります。

ブレッドボードの仕様について詳しくは「ブレッドボード 使い方」で検索すると動画も含め沢山の情報が見つかりますので参考にして下さい。

マイクロUSBケーブルでPCと装置を接続する

配線が終わったら、マイクロUSBケーブルでPCとESP32を接続します。

正しく配線できていれば、USBケーブルを繋いだ時点で液晶シールドのバックライトが点灯します。

どうなるかと言うと、液晶シールドが真っ白になります。

ここで液晶シールドが真っ黒のままである場合、どこかで配線を間違えていますのでチェックしましょう。

Arduino IDEにESP32のボード設定を追加する

Arduino IDEは既にインストール済みである前提です。

Arduino IDEでESP32用のプログラムを開発したり書き込むためには、ボード設定を追加でインストールする必要があります。

①Arduino IDEを起動します。

②以下のアドレスをブラウザで開きます。

https://github.com/espressif/arduino-esp32/blob/master/docs/arduino-ide/boards_manager.md

③Stable release linkのアドレスをコピーします。

ESP32とLCDシールドの組み合わせでLogicool G13が無くてもフルスクリーンのFF14でDPSを見れるようにしてみた2

コピペするのは上の赤線を引いた部分です。

ファイル>環境設定>設定>追加のボードマネージャのURLに、上でコピーしたアドレスをペーストして、OKボタンを押します。

ESP32とLCDシールドの組み合わせでLogicool G13が無くてもフルスクリーンのFF14でDPSを見れるようにしてみた3

⑤ツール>ボード>ボードマネージャーを開き、検索窓にesp32と入力します。

esp32 by Espressifl Systemsがリストアップされるので、選択してインストールボタンを押します。

ESP32とLCDシールドの組み合わせでLogicool G13が無くてもフルスクリーンのFF14でDPSを見れるようにしてみた4

インストールが終わったら、ツール>ボードからESP32 Dev Moduleを選択します。

ESP32とLCDシールドの組み合わせでLogicool G13が無くてもフルスクリーンのFF14でDPSを見れるようにしてみた5

ESP32用描画ライブラリを追加する

以下のアドレスへアクセスします。

https://github.com/Bodmer/TFT_eSPI

Clone or downloadのボタンを押して、Download ZIPを選択し、zipを取得します。

ESP32とLCDシールドの組み合わせでLogicool G13が無くてもフルスクリーンのFF14でDPSを見れるようにしてみた6

このzipを、Arduino IDEのlibraryフォルダへ展開します。

デフォルトだと

C:\Program Files(x86)\Arduino\libraries

になります。

ここにTFT_eSPI-masterフォルダをそのままコピペします。

User_Setup.hの差し替え

zipの中に入っている\TFT_eSPI-master\User_Setup.hC:\Program Files(x86)\Arduino\libraries\TFT_eSPI-masterに上書きコピーして下さい。

DPS表示プログラムを転送する

act_monitor_0_2_0.zipを展開すると、以下のフォルダができます。

\act_monitor_esp32\act_monitor_esp32.ino

act_monitor_esp32.inoがESP32用のencdps表示プログラムです。

この.inoファイルをダブルクリックすると、Arduino IDEのウィンドウが起動します。

Arduino版と同じく、ビルド&転送ボタンを押すと、最初にプログラムがコンパイルされ、エラーが無ければESP32にプログラムを転送します。

プログラムの手動書き込み

Arduino UNOへact_monitor.inoを転送する場合はボタン1発で済んだのですが、ESP32の場合、コンパイルに成功しても書き込みに失敗する事があります。

どうやら、自動でフラッシュメモリに書き込むことができる製品とできない製品があるらしく、私が買ったのは「できない製品」でした。

この場合は「手動書き込み」という手順が必要になります。

「ESP32 手動書き込み」で検索するとたくさん情報がひっかかるかと思いますが、一応ここでも説明しておきます。

  1. IO0ボタンを押しっぱなしにする
  2. ENボタンを押して離す
  3. Arduino IDEのビルド&転送ボタンを押す
  4. ビルドが成功し、転送が開始されたらIO0 ボタンを離す
  5. 書き込みが完了したら ENボタンを押して離す

このように中国雑技団のようなアクロバティックな操作を行う必要があります。

「IO0ボタン」「ENボタン」というのは、ESP32の開発ボード上に配置されているとても小さなスイッチです。

しかしまぁ、プログラムを1度転送すれば2度と必要な操作では無いとは言え、頭がおかしい仕様ですね。

ACTプラグインDpsSender.dllの組み込み

拙作のACTプラグインですが、これはArduino版と全く変わりません。

既にDpsSender.dllが有効化されているのであれば、それがそのまま使えます。

DpsSender.dllの組み込み方については、こちらの記事を参照して下さい。

Logicool G13が無くてもフルスクリーンのFF14でDPSを見れるようにArduinoでACTの値を表示するプラグインを作ってみた
私はFF14をフルスクリーンモードでプレイしており、必ずACTも起動しています。 ですが、ACTのDPS値をゲームプレイ中にリアルタイムに表示するためにはオーバーレイプラグイン等を使わなければなりません。 ここで問題は、この手のプラグインは...

Arduino UNO用に既に組み込みが済んでいる場合は、COMポートの番号はArduinoが接続されているポートが指定されていると思います。

このポート番号はESP32がアサインされているものと異なっていると思うので、DpsSender.dllのオプション設定をESP32が使用しているポートに切り替えて下さい。

操作上の注意など

DpsSender.dllは「起動時にのみ」USBポートを検索します

ACTプラグインのDpsSender.dllは、ACT起動時にUSBポートを検索してArduino UNOあるいはESP32の接続状態をチェックします。

従って、ACT起動前に装置をUSBに接続しておかないと、転送先ポートが見つからない状態になりますのでencdps値が転送されません。

私はよく装置が接続されているUSBハブのスイッチをOFFにした状態でACTを起動してしまい、FF14でバトルコンテンツに入っても液晶に何も表示されずに(´・ω・`)となります。

しかもDpsSender.dllは最後に選択されたCOMポートをACT終了時にセーブしますので、装置が非アクティブな状態でACTを起動してしまうと最初に見つかったCOMポートをセーブしてしまいます。

そうなると次にACTを起動しても間違ったCOMポートが選択された状態でDpsSender.dllが起動してしまいますので、プラグインのOption画面から正しいCOMポートを選択し直す必要があります。

Arduino UNOやESP32がハングアップしたら電源を入れ直してください

上にも書いたのですが、偶に装置の表示が文字化けしてencdps値がまともに表示されなくなります。

コントロールチップの調子が悪いのか、ACTプラグインあるいはArduino用プログラムにバグがあるのか不明なのですが、USBポートの電源を入れ直すと正常に戻ります。

Arduinoはソースコードデバッグもできないし、言語仕様もよく調べてないんですよね。

FF14をプレイ中だろうが、ACTが起動中だろうが構わないので、バグったなと思ったらUSBを挿し直すか、ポートにスイッチが付いている場合はスイッチをOff→Onしてみて下さい。

今回はここまで

Arduino UNOと比較するとESP32の描画は圧倒的に速く、本当に画面描き換えが視認できないレベルです。

その代わり動かすまでの手順が多くてクソ面倒くさいのですが。

今回はブレッドボード上で動作させましたが、これはあくまで動作確認段階なので、ユニバーサル基板上にちゃんと半田付けして配線したいところです。

さらに言えば、格納ケースも作らにゃなあ・・・と思ってます。

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