MicropythonでILI9341タッチ機能使う

前回はIILI9341(MSP2807)にマイクロパイソンで文字や画像を表示させてみました。　　　　　　　　しかし、ILI9341(MSP2807)にはタッチ機能が付いていますので、せっかくですから今回はこのタッチ機能を使ってみたいと思います。タッチ機能が使えるといろいろな面白い工作、プログラムが作れると思いますので、簡単に使い方を説明します。

実行環境
ILI9341ディスプレイの接続
タッチ機能を有効にするためのライブラリのインストール方法
タッチイベントの概要と基本的な操作方法
内臓のLEDを点滅してみる
タッチした軌跡を表示

実行環境

IILI9341(MSP2807)
ラズベリーパイピコ
プログラム開発環境Thonny言語はマイクロパイソン
Windows１１

ILI9341ディスプレイの接続

今回はタッチ機能を使いますので下記のように配線します。

文字画像表示の接続

ILI9341		Pico
1	VCC	36	3V3
2	GND	38	GND
3	CS	17	GP13
4	RESET	19	GP14
5	DC/RS	20	GP15
6	SDI	10	GP7
7	SCK	9	GP6
8	LED	36	3V3
9	SDO	N/C

タッチ機能の接続

ILI9341		Pico
1	INT	1	GP0
2	MISO	11	GP8
3	MOSI	15	GP11
4	CS	16	GP12
5	CLK	14	GP10

タッチ機能を有効にするためのライブラリのインストール方法

まずタッチ機能を有効にするためのライブラリーを下記のサイトに行きhttps://github.com/rdagger/micropython-ili9341 その中のxtp2046.pyをダウンロードしてし同じ名前でラズベリーパイピコ本体に格納します。
ダウンロードせずプログラムをコピしてThonnyで新規ファイル作り、そこに貼り付けてピコ本体にxtp2046.py名前で格納しても同じです。
これで使えるようになるはずです。

タッチイベントの概要と基本的な操作方法

まずはタッチハンドラーを下記のように生成します。

def createXPT(touch_handler):
    spiXPT = SPI(1, baudrate=100000,sck=Pin(10), mosi=Pin(11), miso=Pin(8))
    xpt = Touch(spiXPT, cs=Pin(12), int_pin=Pin(0),int_handler=touch_handler)
    return xpt

次にタッチハンドラーの割り込みが発生したときの呼ばれる関数を定義します。
このとき二つの引数（パネルが押された場所）が渡されますので今回はx座標とy座標にしました。

def xpt_touch(x, y):
　　　#この中に処理コードを書きます

割り込みが発生したときの関数の呼び方は下記のようにします。

while True:
    createXPT(xpt_touch)

これで割り込みが発生したときの処理が行われます。
また、下記のようにインスタンスを生成するとxtp2046の中の関数をよびだせますが、今回は関数を使いません。

xptTouch＝createXPT(xpt_touch)

内臓のLEDを点滅してみる

まずは動作テストのために、タッチ機能で内蔵LEDをオンオフするプログラムを下記のように作ってみました。

from machine import Pin, SPI
from ili9341 import Display, color565
from xglcd_font import XglcdFont
from xpt2046 import Touch
import utime
import ili9341

spiMSP     = SPI(0, baudrate=40000000, sck=Pin(6), mosi=Pin(7))
display = Display(spiMSP, dc=Pin(15), cs=Pin(13), rst=Pin(14))
font    = XglcdFont("fonts/Unispace12x24.c", 12, 24)

#spiXPT = SPI(1, baudrate=100000,sck=Pin(10), mosi=Pin(11), miso=Pin(8))

def createXPT(touch_handler):
    #global spiXPT
    spiXPT = SPI(1, baudrate=100000,sck=Pin(10), mosi=Pin(11), miso=Pin(8))
    xpt = Touch(spiXPT, cs=Pin(12), int_pin=Pin(0),int_handler=touch_handler)
    return xpt

print(SPI(0))
print(SPI(1))
led = Pin(25, Pin.OUT)

def xpt_touch(x, y):
    x1=abs(230-x)
    y1=abs(15-y)
　　#下記のprint座標確認のためです
    print(x1,y1)
    if 120<x1<200 and 285 < y1:
       led.value(1)
    elif 26< x1 <115 and 285 <y1:
       led.value(0)
display.draw_text(5, 10, ili9341.implementation.name,font,
                  color565(0, 0, 200))
display.fill_rectangle(125, 280, 90, 40, color565(128, 200, 255))
display.draw_text(133, 290, "led-on", font,color565(200, 100, 25))
display.fill_rectangle(20, 280, 95, 40, color565(0, 255, 0))
display.draw_text(25, 290, "led-off", font,color565(200, 100, 25))

while True:
    xptTouch = createXPT(xpt_touch)

実際に動かしてみてわかったのですがX座標とy座標がずれて表示されます。始点は右一番上のところから始まるようで、下記のようにX座標y座標を調整します。

x1=abs(230-x)
    y1=abs(15-y)

実際に動かした動画です。

タッチした軌跡を表示

from machine import Pin, SPI
from ili9341 import Display, color565
from xglcd_font import XglcdFont
from xpt2046 import Touch
import utime
import ili9341

spiMSP     = SPI(0, baudrate=40000000, sck=Pin(6), mosi=Pin(7))
display = Display(spiMSP, dc=Pin(15), cs=Pin(13), rst=Pin(14))
font    = XglcdFont("fonts/Unispace12x24.c", 12, 24)

#spiXPT = SPI(1, baudrate=100000,sck=Pin(10), mosi=Pin(11), miso=Pin(8))

def createXPT(touch_handler):
    #global spiXPT
    spiXPT = SPI(1, baudrate=100000,sck=Pin(10), mosi=Pin(11), miso=Pin(8))
    xpt = Touch(spiXPT, cs=Pin(12), int_pin=Pin(0),int_handler=touch_handler)
    return xpt
print(SPI(0))
print(SPI(1))
a1=0

def xpt_touch(x, y):
    global a1
    x1=abs(230-x)
    y1=abs(15-y)
    #print(x1,y1,a1)
    if 135<x1<170 and 285 < y1:
        a1=1
    elif 88< x1 <125 and 285 <y1:
        a1=0  
        
    if  x1 <70  and 280 < y1 :
        display.clear()
        display.fill_rectangle(5, 280, 80, 40, color565(128, 200, 255))
        display.draw_text(14, 290, "clear", font,color565(200, 100, 25))
        display.fill_rectangle(90, 280, 40, 40, color565(0, 255, 0))
        display.fill_rectangle(134, 280, 40, 40, color565(214,17,17))
    elif a1 == 1:
        display.fill_circle(x1, y1, 2,color565(214, 17, 17))
    else:
        display.fill_circle(x1, y1, 2,color565(0, 255, 0))
        
display.draw_text(5, 10, ili9341.implementation.name,font,
                  color565(0, 0, 200))
display.fill_rectangle(5, 280, 80, 40, color565(128, 200, 255))
display.fill_rectangle(90, 280, 40, 40, color565(0, 255, 0))
display.fill_rectangle(134, 280, 40, 40, color565(214, 20, 20))
display.draw_text(14, 288, "clear", font,color565(200, 100, 25))
while True:
    createXPT(xpt_touch)

print("end")

タッチ機能が若干不安定ですがなんとか動いています下記がその動画です。