M5StickC Plus2のチュートリアル

# M5StickC Plus2 を使った Arduino チュートリアル

## 1. M5StickC Plus2 とは？
M5StickC Plus2 は、ESP32-PICO-V3-02 を搭載したコンパクトな開発ボードで、TFTディスプレイ、ボタン、IMU、RTCなどが組み込まれています。Arduino IDE や UIFlow を使って簡単にプログラムを書くことができます。

## 2. 開発環境のセットアップ
### 必要なもの
- M5StickC Plus2 本体
- USB-C ケーブル
- 開発用PC（Windows / macOS / Linux）
- Arduino IDE（または PlatformIO）

### Arduino IDE の準備
1. **Arduino IDE をインストール**
   - 公式サイト（https://www.arduino.cc/en/software）からダウンロードしてインストール。

2. **ESP32 ボードの追加**
   - Arduino IDE を開き、[環境設定] を開く。
   - [追加のボードマネージャのURL] に以下を追加:
     ```
     https://raw.githubusercontent.com/espressif/arduino-esp32/gh-pages/package_esp32_index.json
     ```
   - [OK] を押して設定を保存。

3. **ボードのインストール**
   - [ツール] → [ボード] → [ボードマネージャ] を開く。
   - `esp32` を検索し、`esp32 by Espressif Systems` をインストール。

4. **M5StickC Plus2 用のライブラリをインストール**
   - [スケッチ] → [ライブラリを管理] を開く。
   - `M5StickCPlus` を検索してインストール。

## 3. M5StickC Plus2 にプログラムを書き込む
### サンプルスケッチ：ディスプレイに文字を表示
以下のスケッチを Arduino IDE にコピーし、M5StickC Plus2 に書き込みます。

```cpp
#include <M5StickCPlus2.h>

void setup() {
    M5.begin();  // 初期化
    M5.Lcd.setRotation(3);  // 画面の向きを設定
    M5.Lcd.fillScreen(BLACK);  // 画面を黒でクリア
    M5.Lcd.setTextColor(WHITE);
    M5.Lcd.setTextSize(2);
    M5.Lcd.setCursor(10, 10);
    M5.Lcd.println("Hello, M5StickC Plus2!");
}

void loop() {
    // ここにメインの処理を記述
}
```

書き込み手順

[ツール] → [ボード] から M5StickC Plus2 を選択。

[ツール] → [シリアルポート] で M5StickC Plus2 のポートを選択。

[スケッチ] → [マイコンボードに書き込む] をクリック。

書き込みが完了すると、M5StickC Plus2 の画面に Hello, M5StickC Plus2! が表示される。

### 4. 応用編：Bボタンを押すと時計画面を表示

M5StickC Plus2 には RTC（リアルタイムクロック）が搭載されており、現在時刻を取得して表示することができます。

スケッチ：Bボタンを押すと時計画面を表示

```cpp
#include <M5StickCPlus2.h>

unsigned long lastUpdate = 0; // 最後の更新時刻
const unsigned long updateInterval = 1000; // 1秒間隔
bool showClock = false; // 時計を表示するフラグ

void setup() {
    M5.begin();
    M5.Lcd.setRotation(3);
    M5.Lcd.fillScreen(BLACK);
    M5.Lcd.setTextColor(WHITE);
    M5.Lcd.setTextSize(2);

    // 起動時に "Hello, M5StickC Plus2!" を表示
    M5.Lcd.setCursor(10, 30);
    M5.Lcd.println("Hello, M5StickC Plus2!");

    // RTCの初期化
    M5.Rtc.begin();

    // RTCの時刻を設定（初回のみ実行し、設定後はコメントアウト）
    // m5::rtc_date_t date = {2024, 3, 10};  // 年, 月, 日
    // m5::rtc_time_t timeData = {12, 30, 0}; // 時, 分, 秒
    // M5.Rtc.setDate(&date);
    // M5.Rtc.setTime(&timeData);
}

void loop() {
    M5.update();

    // Aボタンが押されたら時計表示モードに切り替える
    if (M5.BtnA.wasPressed()) {
        showClock = true;
        M5.Lcd.fillScreen(BLACK); // 画面をクリア
    }

    // 時計を表示する場合、1秒ごとに更新
    if (showClock && (millis() - lastUpdate >= updateInterval)) {
        lastUpdate = millis();

        m5::rtc_date_t date;
        m5::rtc_time_t timeData;

        M5.Rtc.getDate(&date);
        M5.Rtc.getTime(&timeData);

        M5.Lcd.fillScreen(BLACK);
        M5.Lcd.setCursor(10, 30);
        M5.Lcd.printf("%04d/%02d/%02d", date.year, date.month, date.date);

        M5.Lcd.setCursor(10, 60);
        M5.Lcd.printf("%02d:%02d:%02d", timeData.hours, timeData.minutes, timeData.seconds);
    }
}

```
#### 実行手順

スケッチを書き込む。
M5StickC Plus2のAボタンを押すと、画面に現在時刻が表示される。
(正確な時間ではないため課題)

### 5. まとめ

このチュートリアルでは、M5StickC Plus2 の基本的なセットアップ方法と、ディスプレイにテキストを表示したり、ボタンを使って時計画面を表示する方法を紹介しました。

M5StickC Plus2 には IMU（加速度センサー）、RTC（リアルタイムクロック）、IR トランスミッターなどの機能があり、さらに高度なプロジェクトにも活用できます。

今後は、Wi-Fi や Bluetooth を活用した IoT プロジェクトにも挑戦していきたい。



参考文献
[Mac での M5Stick C Plus2 開発環境整備](https://zenn.dev/usa6kot/articles/d9d59354a127f6#arduino-%E7%94%A8%E3%81%AE%E8%A8%AD%E5%AE%9A)