みなさんこんにちわ、こんばんわ
本日は晴れていたので、
ビート君の1年点検と、OILや部品交換なんぞを行っていました、
SAIです。
さて、今日は昨日紹介したTFTを動かしてみます。
やりたいことは、
ELEGOO TFTタッチスクリーン を使ってみる!
とりあえず出来たことから。
このTFTを使うには、
どうやら付属CDに添付されているライブラリを
3つインポートしなければならないようです。
外付けDVDドライブを持ってきて、
サクッとAddしましたよ。
続いてどうやって使うかですが・・・
APIリファレンスは存在していなさそうでした。
ということは、
サンプルコードとライブラリ内のソースコードを見ながら
内容を理解していきます。
そして、お試しコードを書いてみます。
ライブラリを見て気づいたのですが、
C++言語で作られていますね!
C言語ユーザだと、
サンプルをまねて使う感じなのでしょうか。
今のご時世、CPPを使えて当たり前なのかもしれないですね。
C言語なんて今更なのかもしれないです。
ま、Arduinoは上手く使ってねという思想かもしれないです。
というわけで、備忘録。
TFTを使うには
◆1 Arduino の setup()関数 ですること
※(SAIの場合、描画クラスのコンストラクタ)
まず、setup()関数内で、TFTを使えるようにします。
Elegoo_TFTLCD クラスを生成して、
TFTのリセットをする
tft.reset();
どうやら、TFTのIDを取得して開始動作をする必要がある模様。
tft.readID()
tft.begin(identifier);
ここまではおまじないですね。
次、描画の視点を決めます。
TFTには四つ角がありますから、
どの角を頂点座標とするかの設定ですね。
SAIは縦にして使いたかったので、試したら2が縦向きでした。
tft.setRotation(2); // 2が縦向き 今後define作ろう。
あとは、何もしないと変な色が表示されるので、
fillRectではなく、fillScreenで背景色を決め打ちます。
tft.fillScreen(BLACK); // 0x0000 = BLACK
◆2 テキストを書いてみよう。
テキストを表示するには、
文字の描画するカーソル位置を指定して、
フォントサイズ、フォントカラーを指定
その後、描画したい文字を出力する感じですね。
tft.setCursor(x,y); //始点
tft.setTextColor(WHITE); //WHITE 0xFFFF
tft.setTextSize(1); //最小
tft.print("PrintText not return , "); //改行あり
tft.println("PrintText to return"); //改行なし
ところが、
このまま数字をカウントすると・・・
文字がつぶれました・・・
どうやら、バックグラウンドを透過してる模様。
これはこれで便利なんですが、、というか、透過するのは当たり前ですね。
それにしても、背景をどうしましょうね。
描画するたびに、fillRect()とかfillScreen()で背景を塗るべきか。
でも、文字サイズって動的に変わっちゃうし…
そんなことを思いつつ
Elegoo_GFXクラスにいいものはないものかと見ていたら、
void Elegoo_GFX::setTextColor(uint16_t c, uint16_t b) {
textcolor = c;
textbgcolor = b;
}
こんなものを見つけました。
setTextColorの 第二引数がBG Collorになっています。
物は試しに、BGColorを設定してみましょう。
tft.setTextColor(BLUE,YELLOW);
tft.println(i); //改行あり
とりあえず、描画はできそうですね。
ただ、SAIがやりたいことにはちょっと困りそうだなという心配が出てきました。
後でお話しします。
次
◆3 線描画
線は、
描画系のAPIでは一般的な名称ですね。
x , y , x , y , collor
tft.drawLine( 0 , 20 , 0 , 200 , WHITE);
いい感じに線が引けますね。
次
◆3 四角・三角形・まる描画
四角・三角・まるも、アプリ系でも一般的なAPIでした。
塗りつぶし系は、fillRect()、fillTriangle()、fillCircle()でした。
塗りつぶさない系は、drawRect()、drawTriangle()、drawCircle()
ですね。
ちなみに、Rのついた四角もありました。fillRoundRect()
/* 図形 〇 */
tft.fillCircle( 20,200,20,BLUE);
tft.drawCircle( 80,200,20,RED);
/* 図形 四角 */
tft.fillRect( 100,200,20,20,BLUE);
tft.drawRect( 140,200,20,20,RED);
/* 図形 三角 */
tft.fillTriangle( 180,200,200,200,190,240,BLUE);
tft.drawTriangle( 220,200,240,200,230,240,RED);
/* 図形 Rつき四角 */
tft.fillRoundRect( 20,250,40,40,40/8,BLUE);
tft.drawRoundRect( 80,250,40,40,40/8,RED);
いろいろできそうですね。
bitmap表示もできるようですが、
SDカードにデータを入れる必要がありそうなので、
いったん保留ですかね。
こんな感じでお試しをしていたのですが、
画像が重なる部分で苦戦。。
絵が重なるところ、
つまりアニメーションですね。
パラパラ漫画的にものを移動させたり、
タッチした場所に対してカーソルが移動するような動作をさせようとしたのですが、
軌跡を残すことはできるものの、
軌跡を消すときに背景を書き直さなければなりません。
通常のアプリなら、
①画面更新にロックをかけて、
②バッファ上のデータを更新、
③絵が完成したところで、描画更新を再開
④全面一気に描画更新
とすることで、アニメーション生成できるのですが、、
APIをみてても、
画面をロックしたり解除する処理がありませんでした。
どうもダブルバッファ的なことをしていないようです。
ということは、、、
絵を描くたびに”ちらちら”しそうですね。
うーむ。
やりたいことが実現できるのか怪しくなりますね。
Arduino用のTFTとして開発されている分、
ちょっとTFTの仕様が不明瞭ですね。
いや、その何百ぺーじもあるマニュアルを見なくても
簡単に使えるようにしているのが良い点なのでしょうけど。
作りこもうとするのがいけないんですかね~
とりあえず、
OSEROでもつくってみました。
コンピュータは、盤面上で一番多く取れるところを取る。
それだけなので、簡単に角を取らせてくれます(笑)
ま、一日で作ったレベルなのでこんなもんか。
にしても、描画更新で盤面の絵がちらつくのが気に食わない・・・
CPUが置いたり、SAIがタッチするたびにこれですよ。
ちらちら、不具合ですやん。
↓100msくらいでこの3枚の更新が目に見えちゃう。
あ、タッチは未来の話だ。
タッチパネルは次回書こうと思います。
”ゲーム木”を使った、得点付け(重み)計算すれば、
先読みしたそこそこ強いCPUができますよね。
話はそれますが、
携帯を開発していた時にオセロをiアプリ(Java)で作ったことがあります。
休憩時間を1か月使って作ったCPUは、
レベル10段階で実装してみました。
通信系アプリチームが、
ネットワーク系のオセロゲームで強いユーザに勝たれへんから
貸してほしいと言われたのですが、
2台体制で 遊ぶ 通信テスト する同僚 ・・・
ユーザランクがぐんぐん上がってて笑えました。
Lv7は、、、勝つことより、相手に置かせないことを重視したCPU設定だったんだけどな(笑)
通信相手は、嫌だっただろうなぁ・・・