This commit is contained in:
LiHuashen
2019-04-10 11:03:45 +08:00
6 changed files with 117 additions and 51 deletions
+1 -1
View File
@@ -38,7 +38,7 @@
<!-- **ミニコア** *( **[クイックスタート](ja/quick_start/m5core/m5stick_quick_start)** )* -->
*( **[クイックスタート](ja/quick_start/m5stick/m5stick_quick_start)** )*&nbsp;&nbsp;&nbsp;&nbsp;*( **[クイックスタート](ja/quick_start/m5stickc/m5stickc_quick_start_with_arduino_Windows)** )*
*( **[クイックスタート](ja/quick_start/m5stick/m5stick_quick_start)** )*&nbsp;&nbsp;&nbsp;&nbsp;*( **[クイックスタート](ja/quick_start/m5stickc/m5stickc_quick_start)** )*
<div class="item">
<a href="/#/ja/core/m5stick">
+11 -5
View File
@@ -8,12 +8,12 @@
## 概要
<mark>**USB**</mark>モジュールはMAX3421Eを内蔵したUSBコントローラです。このモジュールはM5Coreと最大通信速度26MHzのSPIインターフェースで接続され、USBホストやUSBペリフェラルとして使用できます。
<mark>**USB**</mark>モジュールは**MAX3421E**を内蔵したUSBコントローラです。このモジュールはM5Coreと最大通信速度26MHzのSPIインターフェースで接続され、USBホストやUSBペリフェラルとして使用できます。
## 特徴
- 最大通信速度26MHz SPIインターフェース
- 8x GPIO入出力
- 8-way GPIO入出力
- 内蔵リチウム電池コネクタ
## パッケージ内容
@@ -38,6 +38,12 @@
*完全なソースコードは[こちら](https://github.com/m5stack/M5-ProductExampleCodes/tree/master/Module/USB/Arduino)。*
**NOTE:** このサンプルを実行する前に、対応USBライブラリを[こちら](https://github.com/m5stack/M5-ProductExampleCodes/tree/master/Module/USB/Arduino/Library)からダウンロードします。次にArduino IDE のメニューから `スケッチ``ライブラリをインクルード``.ZIP形式のライブラリをインストール...`を選択後、ダウンロードしたファイルを選択し、取り込みます。
<img src="assets/img/product_pics/module/module_usb_03.png">
<img src="assets/img/product_pics/module/module_usb_04.png">
`usb_mouse.ino`をM5Coreに書き込みます。USBマウスをモジュールに接続します。マウスの左ボタンを押して緑色の線を描き、右ボタンで白色の線を描きます。中央のボタンを押すと画面をクリアします。
```arduino
@@ -87,8 +93,8 @@ if(Usb.getUsbTaskState() == USB_STATE_RUNNING)
## 関連動画
**USB デモ - USBデバイを読む**
**USB デモ - USBデバイを読み込む**
<video width="500" height="315" controls>
<video width="500" controls>
<source src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/video/Blog/Twitch201902/USB%20Interface.mp4" type="video/mp4">
</video>
</video>
@@ -1,81 +1,130 @@
# M5Stick クイックスタート(Windows, Arudino) {docsify-ignore-all}
?> `USB driver``Git``Arduino IDE` をインストールしているか確認してください。 もしまだの場合は、 [シリアル接続の確立方法](ja/related_documents/establish_serial_connection) と [GitとArduino IDEのインストール方法](ja/related_documents/how_to_install_git_and_arduino)を参照してください。
# M5Stick クイックスタート - Arudino Win {docsify-ignore-all}
<img src="assets/img/getting_started_pics/m5stick/stick_01.png"><img src="assets/img/getting_started_pics/m5stick/stick_06.png"><img src="assets/img/windows-logo.png">
## コンテンツ
1. [環境設定](#環境設定)
[1. Arduino IDEのインストール](#_1-arduino-ideのインストール)
[2. シリアル変換ドライバのインストール](#_2-シリアル変換ドライバのインストール)
[3. ESP32ボードマネージャのインストール](#_3-ESP32ボードマネージャのインストール)
[4. M5Stackライブラリのインストール](#_4-M5Stackライブラリのインストール)
[5. U8g2ライブラリのインストール](#_5-U8g2ライブラリのインストール)
[6. 例題](#_6-例題)
- [Step1. arduino-ESP32サポートのダウンロード](#step1-arduino-esp32サポートのダウンロード)
## 1. Arduino IDEのインストール
- [Step2. M5Stackライブラリのダウンロード](#step2-m5stackライブラリのダウンロード)
ブラウザから Arduino公式サイト https://www.arduino.cc/en/Main/Software にアクセスします。
- [Step3. U8g2 ライブラリインストール](#step3-u8g2-libインストール)
#### (1) `Windows ZIP file for non admin install`を選択します。
2. [例題](#例題)
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/arduino_cc_package.png">
## 環境設定
#### (2) `JUST DOWNLOAD`を選択し、ダウンロードします。
### Step1. arduino-ESP32サポートのダウンロード
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/arduino_cc_package_02.png">
Arduino IDEを起動し、メニューから`File`->`Peferences`->`Settings`と選択します。
#### (3) ダウンロードしたファイルをダブルクリックし、設定はデフォルトのまま、インストールします。
以下のようにGitHubからリポジトリを取得します。(少し時間がかかります)
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/select_arduino_install_path.png">
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/quick_start_arduino_win_01.png">
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/install_arduino_2.png">
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/quick_start_arduino_win_02.png">
## 2. シリアル変換ドライバのインストール
最新のESP32ボード管理URLを追加してください`Additional Boards Manager URLs: `
ブラウザから M5Stack公式サイト https://m5stack.com/download にアクセスします。
*最新のボードマネージャURLはこちら:https://dl.espressif.com/dl/package_esp32_index.json*
#### (1) `Windows`をクリックし、Windows 版のドライバをダウンロードします。
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/quick_start_arduino_win_03.png">
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/download_usb_driver_win_01.png">
`Tools`->`Board:`->`Boards Manager...`を選択し、新しいポップアップダイアログで、`ESP32`と入力して検索します。`Install`をクリックします。
#### (2) 使用しているwindowsのビット数に合わせたドライバを選択し、インストールします。
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/quick_start_arduino_win_04.png">
* 32 ビット Windows をお使いの方は `CP210xVCPInstaller_x86_vx.x.x.x.exe`
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/quick_start_arduino_win_05.png">
* 64 ビット Windows をお使いの方は `CP210xVCPInstaller_x64_vx.x.x.x.exe`
### Step2. M5Stackライブラリのダウンロード
<img src="assets/img/getting_started_pics/establish_serial_connection/windows_install_usb_driver01.png">
Arduino IDEを開いて`スケッチ -> ライブラリをインクルード -> ライブラリを管理...`と選択します。開いたウィンドウの検索ボックスに`m5stack`と検索し、出てきたライブラリをインストールします。
#### (3) ファイルをダブルクリックし、インストールします。
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/quick_start_arduino_win_06.png">
<img src="assets/img/getting_started_pics/establish_serial_connection/windows_install_usb_driver02.png">
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/quick_start_arduino_win_07.png">
<img src="assets/img/getting_started_pics/establish_serial_connection/windows_install_usb_driver03.png">
!> **Note:** *以下のように表示された場合は、アップデートします。*
#### (4) COMxポートを確認します。
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/update_m5stack_lib.png">
インストールが終わったら:
### Step3. U8g2 Libインストール
M5Core を USB Type-C ケーブルでPCに接続し、Windowsのデバイスマネージャを開きます。USBケーブルを抜いたり挿したりすると`ポート (COM と LPT)` 内の表示が切り替わるものが対象のCOMxポートです。
まずArduino IDEを開き、`Sketch`->`Include Library`->`Manage Libraries...`の順に選択します。検索窓で`U8g2`を検索し、インストールします。
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/check_serial_port_01_cn.png">
USBケーブルを抜くと、COM ポートが消えます。
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/check_serial_port_02_cn.png">
## 3. ESP32ボードマネージャのインストール
#### (1) Arduino IDEを開き、`ファイル`->`Preferences...`->`設定`と選択します。
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/quick_start_arduino_win_01_cn.png">
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/quick_start_arduino_win_02_cn.png">
#### (2) 下のアドレスをコピーし、ESP32ボードマネージャに追加します。 `追加のボードマネージャのURL:`
*ESP32ボードマネージャ:https://dl.espressif.com/dl/package_esp32_index.json*
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/quick_start_arduino_win_03_cn.png">
#### (3) `ツール`->`ボード:`->`ボードマネージャ...`
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/quick_start_arduino_win_04_cn.png">
#### (4) 検索ボックスで `ESP32` と検索し、`インストール`します。
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/quick_start_arduino_win_05_cn.png">
## 4. M5Stackライブラリのインストール
#### (1) Arduino IDEを開き、 `スケッチ`->`ライブラリをインクルード`->`ライブラリを管理...`を選択します。
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/install_m5stack_lib_01_cn.png">
#### (2) 検索ボックスで `M5Stack` と検索し、`インストール`します。
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/install_m5stack_lib_02_cn.png">
## 5. `U8g2`ライブラリのインストール
#### Arduino IDEを開き、 `スケッチ`->`ライブラリをインクルード`->`ライブラリを管理...`を選択し、検索ボックスで`U8g2`を検索します。
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_m5stick/install_u8g2.png">
## 例題
## 6. 例題
このセクションではArduinoでプログラムができるかを確認します。最初に<mark>[MPU9250付きのM5Stick](https://img.alicdn.com/imgextra/i4/136588748/O1CN012EUdFpJIthEANlx_!!136588748.jpg)</mark>とPCをUSBケーブルで接続してください。そしてM5Stickが接続されているシリアルポートを選択し、サンプルプログラムを実行してみましょう
Arduino IDEを介してM5Stickがプログラムできるが確認します
### 1. `FactoryTest.ino`サンプルスケッチ実行
<mark>[M5Stick with MPU9250](https://img.alicdn.com/imgextra/i4/136588748/O1CN012EUdFpJIthEANlx_!!136588748.jpg)</mark>とPCをUSBケーブルで接続し、Arduino IDEを開きます。M5Stick接続のシリアルポート番号を選択してください。間違った番号を選択しないように注意してください。
Arduino IDEのメニューから`ツール`を選択し、ボードとボーレート、シリアルポートを次のように選択します。M5Stack-Core-ESP32、921600、COMx(シリアルポートの番号はお使いの環境によって変わります。)
例題を選び、実行してみましょう。
### (1) `FactoryTest.ino`を書き込んでみましょう。
M5Stack-Core-ESP32, 921600, COMx (M5Stickの接続されているポート)
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/select_board_baudrate_serial_port.png">
メニューから`ファイル -> スケッチ例 -> M5Stack -> Stick -> FactoryTest`を選択します。
#### (2) `FactoryTest.ino`を選択します。
`M5Stack` -> `Stick` -> `FactoryTest`
<img src="assets/img/getting_started_pics/m5stick/m5stick_arduino_windows_01.png">
コンパイル&アップロード実行します。
#### (3) クリックしてアップロードします。
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/windows/arduino_upload.png">
**M5Stick画面に"Hello World! Exist"とメッセージが表示されます。**
**結果: Aボタンを押した後、ディスプレイに "Hello World! Exist"が表示されます。**
?> *もしM5Stack Libを更新したい場合はこちらの記事を参照してください。[Arduino IDEのM5Stackライブラリ更新方法](ja/related_documents/upgrade_m5stack_lib).*
**電源ボタンはシングルクリックで起動、ダブルクリックで停止です。**
@@ -2,6 +2,6 @@
**好きなプログラミングスタイルを以下から選んでください。**
<img src="assets/img/macos-logo.png"> | <img src="assets/img/windows-logo.png"> | <img src="assets/img/uiflow-logo.png">
---|---|---
[Arduino-MacOS](en/quick_start/m5stickc/m5stickc_quick_start_with_arduino_MacOS) | [Arduino-Windows](en/quick_start/m5stickc/m5stickc_quick_start_with_arduino_Windows) | [UIFlow](en/quick_start/m5stickc/m5stickc_quick_start_with_uiflow)
<img src="assets/img/windows-logo.png"> | <img src="assets/img/uiflow-logo.png">
---|---
[Arduino-Windows](ja/quick_start/m5stickc/m5stickc_quick_start_with_arduino_Windows) | [UIFlow](ja/quick_start/m5stickc/m5stickc_quick_start_with_uiflow)
@@ -80,7 +80,12 @@
Arduino IDEを開き、M5StickCが接続されているシリアルポートを選択します。
ボード名、ボーレート、シリアル接続スピードを以下のように設定します: **ESP32 Pico Kit**, **115200**, COMx(今回、M5StickCが使用するポートは`COM31`ですが、毎回変わります。)
* <font color="red">ボード ( Board ): ESP32 Pico Kit</font>
* <font color="red">ボーレート ( Upload Speed ): 115200bps 或 1.5Mbps</font>
* <font color="red">シリアルポート ( Port )COM31</font>(今回M5StickCが使用するポートは`COM31`ですが、毎回変わります。)
<img src="assets/img/getting_started_pics/m5stickc/m5stickc_quick_start_08.png">
@@ -22,17 +22,23 @@ Access [M5Stack Official Website](http://www.m5stack.com/download), and download
Connect M5StickC to the computer via the USB Type-C cable, unzip the M5Burner archive you just downloaded, and double-click the executable `M5Burner.exe`
Select the `serial number` and **`115200 baud rate`** that the board is connected to the computer, and select the latest version of UIFlow firmware for M5StickC
Select the `COM`, `Baudrate` and the lastest `firmware`
Click `Burn` for downloading UIFlow firmware
* <font color="red">Select COM: COM31</font> (Now, my serial port which is connected with PC is `COM31`)
* <font color="red">Select Baudrate: 115200</font>
* <font color="red">Download and select Firmware: UIFlow-vx.x.x-StickC</font>
<img src="assets/img/getting_started_pics/m5stickc/qs_uiflow/qs_uiflow_01.png">
The following interface appears, indicating that the firmware is successfully burned.
Click `Burn` for downloading UIFlow firmware
The following figure indicates that the firmware is successfully burned.
<img src="assets/img/getting_started_pics/m5stickc/qs_uiflow/qs_uiflow_02.png">
## 3. Wi-Fi Setting
## 2. Wi-Fi Setting
#### (1) Select `SETUP`
@@ -63,7 +69,7 @@ The status of the network icon on the screen:
* Red means be offline status
## 4. Program
## 3. Program
#### (1) Connect to UIFlow