趣味の開発ノート

ITの学習やプログラミング・ノーコードアプリ開発のことなど。

【M5Stack】スケッチ例「TFT_Clock_Digital」を読み解く01. mills関数の実験

M5Stackで電子工作ができるようになりたくて、練習中。
一定間隔でセンサ値をデータベース(Spreadsheet)に送るような仕組みを作ることを目的に、タイマー周りの機能を調べている。

今回は、サンプルスケッチ「TFT_Clock_Digital」について読解しながら、C/C++やM5Stackの基本的な操作も合わせて学んでいきたいと思う。

サンプルスケッチの読み込みと起動

Arduino IDEのメニューから、
「ファイル」>「スケッチ例」>「M5Stack」>「Advanced」>「Display」>「TFT_Clock_Digital」を開く。

このサンプルスケッチをM5Stackに書き込んでみると、このように現在時刻を表示するデジタル時計として機能する。

f:id:massa_potato:20220219113845j:plain

setup()関数を見てみる

グローバル変数定義などは色々あるけど一旦飛ばして、setup()関数を見てみる。

▼サンプルスケッチ TFT_Clock_Digitalのsetup()関数

void setup(void) {
  //Serial.begin(115200);
  M5.begin();
  M5.Power.begin();
  // M5.Lcd.setRotation(1);
  M5.Lcd.fillScreen(TFT_BLACK);

  M5.Lcd.setTextSize(1);
  M5.Lcd.setTextColor(TFT_YELLOW, TFT_BLACK);

  targetTime = millis() + 1000;
}

M5.begin()

  • まずここでM5Stackの初期設定をして動かす準備をする。M5Stackの機能を使うには必ず必要。
  • スケッチの一番最初に最初にM5Stackライブラリをインクルードして使う。
  • プログラム的には、ここでM5オブジェクトを初期化している。

M5.Power.begin()

  • ここでは電源関係の初期化を行っている様子。なくても動く。
  • Powerクラスは、M5Stackライブラリの電源を扱うクラス。

github.com

M5.Lcd.fillScreen()

  • M5.Lcd.fillScreen(TFT_BLACK)で、画面を指定した色で塗りつぶしている。ここでは黒を指定している。
  • Lcdクラスは、M5Stackについているディスプレイを扱うためのクラス。
  • その後、M5.Lcd.setTextSize(), M5.Lcd.setTextColor()で文字サイズや文字色を指定している。

M5Stackのディスプレイは、TFTカラーのLCD(液晶ディスプレイ)がついている。
このTFTはカラー液晶の種類のことのようだ。
(サイズは320 x 240 pixel)

github.com

mills()関数について

  • C言語の関数で、プログラムの実行を開始してからの時間をミリ秒(ms)で返す関数。
  • これを使って、経過時間を測るタイマーを実装することができそうだ。

www.musashinodenpa.com

mills()関数の動きを確認してみる

ここまでだと、どうやってM5Stackが今の時刻を表示できているのかちょっとピンとこない。

ただサンプルスケッチの読解を進める前に、一旦このmills()関数の数値がどういうふうになっているのか、確認してみたい。

ということで、画面上に起動からのミリ秒と秒数を表示するだけの簡単なスケッチを書いてみた。
1秒ごとに画面が切り替わり、経過時間を増やしている。

▼画面上に起動からの経過時間を表示するスケッチ

#include <M5Stack.h>

uint32_t millSec = 0; // 符号なし32bit整数型
uint32_t sec = 0;

void setup() {
  M5.begin();         // M5初期化
  M5.Power.begin();   // M5の電源の初期化

  // 画面の設定
  M5.Lcd.fillScreen(TFT_BLACK);
  M5.Lcd.setTextSize(3);
  M5.Lcd.setTextColor(TFT_YELLOW, TFT_BLACK);

}

void loop() {
  millSec = millis();           // 起動してからの時間ミリ秒
  sec = round(millSec / 1000);  // 起動してからの秒(roudは四捨五入)

  // 画面の表示
  M5.Lcd.clear();
  M5.Lcd.setCursor(0, 0);
  M5.Lcd.printf("millSec:\n");
  M5.Lcd.printf("%u", millSec);

  M5.Lcd.setCursor(0, 120);
  M5.Lcd.printf("sec:\n");  
  M5.Lcd.printf("%u", sec);

  delay(1000); // 1秒待機
}

コンパイルして書き込むと、書き込み完了時に秒数のカウントがスタートした。
また、一度M5Stackの電源を落としてから再起動すると、また秒数は1から始まることを確認した。

f:id:massa_potato:20220219114746j:plain

表示されるミリ秒は完全にピッタリではなく、少しずつずれは生じてくる。
でも秒単位に変換すると、しばらく(1時間ほど)経過しても差は出てこなかったので、精密なプログラムでなければさほど問題ないと思う。

今日のまとめ

サンプルスケッチ「TFT_Clock_Digital」のsetup()関数の中身を見て、millis() 関数の動きを確認した。

次はloop()関数の中身を見て、時刻が表示される仕組みを見ていきたい。