.. _03_pre2021:

事前準備 (2021年度：Arduino IDE)
======================================

.. warning::  **2022年度は、ここにかいてある準備は不要です。** ただし、サンプルファイルを見たい場合には入れておくと便利かもしれません。なお、FTDI Virtual COM Port (VCP) Driver はWindowsに入っているので、わざわざ入れなくてよいようです。


M5StickC Plus <https://www.switch-science.com/catalog/6470> に、プログラムを書き込むためには、
開発環境（Arduino IDE）のインストールと、設定が必要になります。

.. note::  M5StickC Plusは、2017年に発売されたM5StickC の後継版です。ディスプレイサイズと解像度、バッテリ容量が向上しています。また、ブザーも追加されているため、簡単な音を本体のみで鳴らすことができます。

.. note::  UIFlowという、Webベースのブロックプログラミング環境もありますが、本実験では柔軟性と拡張性を重視し、Arduinoを使用します。ArduinoではC言語でプログラムを記述します。

開発環境（Arduino IDE）のインストール
-------------------------------------------

Arduino IDEは、Arduinoというマイコンボード用に開発され、長年使われている開発環境です。IDEとは、Integrated Development Environment の略で、日本語では統合開発環境と呼びます。有名なIDEには、Microsoft Visual Studio [#vs]_ や Eclipse [#eclipse]_ があります。

.. [#vs] おもにWindows向けの開発環境です。ちなみに、Visual Studio Code は、最近利用者が増加しているコードエディタです。
.. [#eclipse] おもにJava向けの開発環境です。「イクリプス」と発音します。

.. note::  `初心者向けM5Stackの始め方（ArduinoIDE編） <https://raspberrypi.mongonta.com/howto-start-m5stack-arduinoide>`_ も参考になります。**ただし、M5Stackではなく、M5StickC/CPlus特有の注意点があります。**

.. _ideinstwin:

Windowsの場合
~~~~~~~~~~~~~~~~~~~~~~~~~~~~
1. Microsoft Store で、`Arduino IDE <https://www.microsoft.com/ja-jp/p/arduino-ide/9nblggh4rsd8#activetab=pivot:overviewtab>`_ を検索してインストールする。
#. M5StickCPlusをUSB接続するために、`FTDI Virtual COM Port (VCP) Driver Setup File <https://www.ftdichip.com/Drivers/CDM/CDM21228_Setup.zip>`_ をダウンロードしてインストールする。ちなみに、他のOS用のドライバやバージョンはこちら：<https://www.ftdichip.com/Drivers/VCP.htm> 

MacOS、Linuxの場合
~~~~~~~~~~~~~~~~~~~~~~~~~~~~
1. Arduino IDEのダウンロードサイト <https://www.arduino.cc/en/Main/Software> から、自分のOSに適合したファイルをダウンロードする。
#. インストールする。

Arduino IDEと、USB接続用のドライバ（Windowsのみ）をインストールしたら、次のステップ（Arduino IDEの設定）にすすみます。次のステップでは、Arduino IDEで、ESP32用のプログラムをコンパイルしたり、M5StickCPlusのサンプルプログラムを利用したりするために、ボードとライブラリをインストールします。



Arduino IDEの設定
---------------------------------------

追加のボードマネージャーのURLを設定する
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


1. Arduino IDEを起動する。
#. 「ファイル」→「環境設定」→「追加のボードマネージャーのURL」に、 ``https://dl.espressif.com/dl/package_esp32_index.json`` を設定する。以下のテキストエリアの右上の四角アイコンを押すと、URLをコピーできます。::

        https://dl.espressif.com/dl/package_esp32_index.json

esp32のボードを追加する
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

「ツール」→「ボード…」→「ボードマネージャ…」をひらき、右上のテキスト入力フィールドに、``esp32`` と入力して絞り込み、「インストール」を押す（:numref:`fig_board_manager_esp32` ）。

.. _fig_board_manager_esp32:

.. figure:: images/board_manager_esp32.png
   :scale: 60%
   :alt: ボードマネージャにて``esp32``で絞り込んでいる画面
   :name: f_board_manager_esp32

   ボードマネージャにて``esp32``で絞り込んでいる画面


M5StickCPlusライブラリをインストールする
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

「スケッチ」→「ライブラリをインクルード」→「ライブラリを管理…」で、ライブラリマネージャをひらく。

右上のテキスト入力フィールドに、``m5stickcplus`` と入力して絞り込み、M5StickCPlus の 「インストール」を押す（:numref:`fig_library_manager_m5stickcplus`）。

.. _fig_library_manager_m5stickcplus:

.. figure:: images/library_manager_m5stickcplus.png
   :scale: 60%
   :alt: ライブラリマネージャにて``m5stickcplus``で絞り込んでいる画面
   :name: f_library_manager_m5stickcplus

   ライブラリマネージャにて``m5stickcplus``で絞り込んでいる画面

M5StickCPlusライブラリの確認と、サンプルソースコードの表示
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

:numref:`fig_menu_file_sketchexample_m5stick_factory` に示すように、「ファイル」→「スケッチ例」→「互換性なし」→「M5StickCPlus」→「FactoryTest」をえらぶ。

.. _fig_menu_file_sketchexample_m5stick_factory:

.. figure:: images/menu_file_sketchexample_m5stick_factory.png
   :scale: 80%
   :alt: 「ファイル」→「スケッチ例」→「互換性なし」→「M5StickCPlus」→「FactoryTest」
   :name: f_menu_file_sketchexample_m5stick_factory

   「ファイル」→「スケッチ例」→「互換性なし」→「M5StickCPlus」→「FactoryTest」


ボードの選択
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

:numref:`fig_menu_tool_board_esp32_m5stickc` に示すように、「ツール」→「ボード: Arduino Uno」→「ESP32 Arduino」→「M5Stick-C」をえらぶ。

.. _fig_menu_tool_board_esp32_m5stickc:

.. figure:: images/menu_tool_board_esp32_m5stickc.png
   :scale: 80%
   :alt: 「ツール」→「ボード: Arduino Uno」→「ESP32 Arduino」→「M5Stick-C」
   :name: f_menu_tool_board_esp32_m5stickc

   「ツール」→「ボード: Arduino Uno」→「ESP32 Arduino」→「M5Stick-C」


ビルド
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

:numref:`fig_build_factorytest` に示すように、✔️表記された丸ボタン（一番左）をおして、ビルド（ソースコードのコンパイルとリンク）をする。

.. _fig_build_factorytest:

.. figure:: images/build_factorytest.png
   :scale: 80%
   :alt: ビルド
   :name: f_build_factorytest

   ビルド

.. note:: デフォルト（インストールしただけの初期状態）では、コンパイルに非常に時間がかかります。すこし手間はかかりますが、 `Arduino IDEのビルドを速くする｜オブジェクトファイルの出力先を固定する <https://hangstuck.com/arduino-buildpath-fix>`_ をやっておくと、ビルド時間が短縮できます。

.. warning::  **M5StickCPlus本体がない事前準備の段階で、できるのは、ここまでです。** 以降は、本体をUSB接続したあとで、行う作業になります。Windows環境でビルドできない場合は、いちどArduino IDEをすべて終了し、Arduino IDEを管理者権限で起動しなおしてください。管理者権限で起動するには、アイコンを右クリックして、メニューから選択します。


シリアルポートの選択
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

**本体をUSB接続したあと** で、 :numref:`fig_select_serialport` に示すように、「ツール」→「シリアルポート」で、書き込むデバイスが接続されているシリアルポートを選択する。Windowsの場合は、COM3のように、``COM + 数字`` で表記される。Macの場合は、``/dev/cu.usbserial-XXXXXXXXXX`` のように表記される。

.. _fig_select_serialport:

.. figure:: images/select_serialport.png
   :scale: 80%
   :alt: シリアルポートの選択
   :name: f_select_serialport

   シリアルポートの選択

.. note:: Windowsを使っていて、シリアルポートが表示されないときは、:ref:`ideinstwin` で指示した、FTDI Virtual COM Port Driver がインストールされているか、確認してみてください。本体を挿したときに、PCの「デバイスマネージャ」 （スタートメニューのdevice managerで検索）で、「ポート（COMとLPT）」に表示されていれば、ドライバはインストールされていますので、Arduino IDEを再起動してください。


プログラムの書き込み
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

「→」のアイコンボタンをおすと、プログラムの書き込みを開始します。

.. warning:: 書き込みに失敗するときは、環境設定で、「より詳細な情報を表示する」にチェックをいれてみてください。原因がすこしわかりやすくなります。

バージョン情報
--------------------------------------------------

- Arduino IDEのバージョン： 1.8.13 (Windows Store 1.8.42.0)
- ESP32 for Arduino のバージョン：1.0.5
- M5StickCPlus ライブラリのバージョン: 0.0.1