前書き

先日投稿した記事「ESP32でILI9341(パラレル)LCDを動かす」の続編です。
基本的に「備忘録」です。

使用するタッチスクリーンについて

先日の投稿分ではILI9341パラレルLCDの表示についてでしたが、今回はTouchScreen編です。
参考元の台湾のサイトではキャリブレーションのやり方について詳細が書かれていなかったのでそのやり方を記します。
注意が必要なのは、今回購入したパラレルLCDボードの場合、抵抗膜タイプのタッチスイッチであり、CPUのADCでデータを取得しているということです。
SPIタイプのボードはタッチスイッチもSPIなのでスケッチ例でも使えないのが結構ありました。
表示はTFT_eSPIのライブラリが使えますが、タッチスクリーンはSPI接続が前提で書かれているので使えません。
TFT_eWidgetライブラリが良さげなのですが、SPIでのタッチスクリーン入力にも対応しているみたいです。
で、その結果、GUIsliceで画面と雛形のプログラムまで作ってしまおうと考えました。
GUIsliceは抵抗膜タイプのタッチスクリーンに対応しているのがその理由です。

使用するライブラリ等

目的として、他のマイコン基板に何らかの操作指令を出したい。というのがあり
GUIslice を使うこととしました。これは台湾のサイトでも触れられています。
https://blog.xuite.net/iamleon/blog/589265496#
GUIsliceのツールはGitHubで公開されており、PCにダウンロードして使用します。
https://github.com/ImpulseAdventure/GUIslice
画面作成ツールをPCに、ライブラリをArduino IDEにインストールします。
予め次のヘッダファイルについて、使用する環境に合わせた編集が必要です。
自分は TFT_eSPIライブラリをメインで使っています。
タッチスクリーンは抵抗膜タイプです。マイコンのADCを用いて接触した座標を取得します。

GUIslice_config.h
esp-tftespi-default-simple.h
User_Setup.h

タッチパネルの接続に関するヘッダ変更は152行あたり

esp-tftespi-default-simple.h

  #define ADATOUCH_PIN_YP     14
  #define ADATOUCH_PIN_XM     12
  #define ADATOUCH_PIN_YM     22
  #define ADATOUCH_PIN_XP     21

となります。XPとYPがHiとなりXMとYMがアナログ入力で座標を取得している様です。
キャリブレーションを実行する前にこの変更をしておきます。

そしてSDカードのCS接続ピン番号の変更をしておきます。 102行目あたり

esp-tftespi-default-simple.h

  // -----------------------------------------------------------------------------
  // SECTION 2: Pinout
  // -----------------------------------------------------------------------------

  // For TFT_eSPI, the display wiring is defined by TFT_eSPI's User_Setup.h

  // SD Card
  //#define ADAGFX_PIN_SDCS    2 // ESP8266 + Adafruit FeatherWing 2.4"
  //#define ADAGFX_PIN_SDCS     14 // ESP32   + Adafruit FeatherWing 2.4"
  #define ADAGFX_PIN_SDCS    5 // Others  + Adafruit FeatherWing 2.4"

  // --------------------------------------------------------------------------

次に、GUIslice_config.hを使用する環境に合わせて該当するコメントを外します。
自分の場合は

GUIslice_config.h 128行目あたり

  // ESP8266, ESP32, M5stack, WIO Terminal, TTGO:
  // ------------------------------------------------------
  //#include "../configs/esp-shld-m5stack.h"
  //#include "../configs/esp-shld-wio-notouch.h"
  //#include "../configs/esp-shld-wio-input.h"
  //#include "../configs/esp-shld-ttgo_btc_ticker.h"
  //#include "../configs/esp-tftespi-default-ft6206.h"
  //#include "../configs/esp-tftespi-default-notouch.h"
  #include "../configs/esp-tftespi-default-simple.h"
  //#include "../configs/esp-tftespi-default-stmpe610.h"
  //#include "../configs/esp-tftespi-default-xpt2046.h"
  //#include "../configs/esp-tftespi-default-xpt2046_int.h"

  // Teensy:

とあるように #include "../configs/esp-tftespi-default-simple.h"
を選択しました。

キャリブレーション

スケッチ例のサンプルが動く様になったらキャリブレーションを実行します。
キャリブレーションは
スケッチ例 → GUIslice → arduino → aiag_ard_touch_calibでスケッチを呼び出し
void setup()関数内の
Serial.begin(115200); // ボーレートを自分の環境に合わせる
を環境に合わせて変更します。
実行すると、ガイダンスに従ってタッチペンで指定された場所を3秒以上触れます。
↓実行中の画面。緑の□の中の"+"を3秒以上押し続けます。これを各方向繰り返します。

すべて触れ終えるとシリアルモニタにキャリブレーション値が表示されるので

esp-tftespi-default-simple.h

  // DRV_TOUCH_ADA_SIMPLE [240x320]: (XP=21,XM=12,YP=14,YM=22) 
  #define ADATOUCH_X_MIN    898
  #define ADATOUCH_X_MAX    101
  #define ADATOUCH_Y_MIN    971
  #define ADATOUCH_Y_MAX    158
  #define ADATOUCH_REMAP_YX 1

と数値をシリアルモニタに表示された内容をコピペします。

重要！注意すべきは、これら2つのヘッダファイル、ライブラリの更新があった際、全て自動でアップデートすると内容が初期化されます。
前日までちゃんと動いたのに翌日エラーがいっぱい吐き出されたらここをチェックしてみましょう。

ここまで完了したら、スケッチ例 → GUIslice内のサンプルがほぼすべてそのままで実行可能になります。

GUIsliceは日本語には対応していません。表示させる文字等も日本語は使えません。
スイッチ等で日本語を使いたい場合は、別途ビットマップイメージを作り、image2c-win-2.03 でCソースコード化したものを貼り付けたほうが使いやすいと思います。
image2cは → https://github.com/Pconti31/GUIslice_Image2C
GUIsliceで作成した実行画面の写真です。日本語はimage2cを使ってます。

GUIslicdの使い方は別記事で書くかもしれません。
画面作った後 Generate Code を実行するとarduinoのコードをは書いてくれます。
後はそのコードにイベントごとに処理を書いてあげればアプリケーションが出来るという感じです。