diff --git a/docs/CNAME b/docs/CNAME new file mode 100644 index 00000000..f9e262e8 --- /dev/null +++ b/docs/CNAME @@ -0,0 +1 @@ +docs.m5stack.com \ No newline at end of file diff --git a/docs/assets/css/main-min.css b/docs/assets/css/main-min.css index 6df9ae6b..6ae812c6 100644 --- a/docs/assets/css/main-min.css +++ b/docs/assets/css/main-min.css @@ -28,9 +28,8 @@ img { } .markdown-section { - max-width: 80%; + max-width: 75%; margin-top: 50px; - padding: 2rem 10px 2rem 60px; } .markdown-section a { @@ -255,7 +254,7 @@ body[data-page="zh_CN/quick_start/m5stickc/m5stickc_quick_start.md"] article.mar .mask-btn1 { position: relative; - top: 60px; + top: 50px; left: 30px } @@ -337,7 +336,7 @@ div.card-img-overlay:hover { } .product_page { - margin-left: 110px; + margin-left: 60px; margin-top: 100px } @@ -827,8 +826,8 @@ mark { .anchor-box { position: fixed; - top: 30%; - left: 25px; + top: 25%; + left: 50px; display: -webkit-flex; display: flex; flex-direction: column; @@ -906,32 +905,33 @@ mark { @media screen and (max-width:1580px) { .anchor-box { - left: 10px + left: 20px } } -@media screen and (max-width:1445px) { - .anchor-box { - left: -10px - } -} @media screen and (max-width:1260px) { .anchor-box { - left: -35px + left: 0px } } -@media screen and (max-width:1000px) { +@media screen and (max-width:1100px) { .anchor-box { - left: -60px + left: -12px + } +} + +@media screen and (max-width:980px) { + .anchor-box { + left: -34px } } @media screen and (max-width:768px) { .anchor-box { position: fixed; - top: 45%; + top: 35%; left: auto; right: -120px; display: -webkit-flex; @@ -1169,4 +1169,25 @@ table tr:nth-child(odd) { display: block !important; overflow: scroll; } -} \ No newline at end of file +} + + +.files_download { + display: flex; + flex-direction: row; + justify-content: space-evenly; + flex-wrap: wrap; + margin: 45px; +} + +.files_download .item{ + display: flex; + justify-content: center; + width: 200px; + box-shadow: 4px 4px 7px 0px #cecece; + transition:all .25s ease; +} + +.files_download .item:hover{ + transform:scale(1.2); +} diff --git a/docs/assets/css/main.css b/docs/assets/css/main.css index 48c0b91d..b552e00f 100755 --- a/docs/assets/css/main.css +++ b/docs/assets/css/main.css @@ -28,9 +28,8 @@ img { } .markdown-section { - max-width: 80%; + max-width: 75%; margin-top: 50px; - padding: 2rem 10px 2rem 60px; } .markdown-section a { @@ -255,7 +254,7 @@ body[data-page="zh_CN/quick_start/m5stickc/m5stickc_quick_start.md"] article.mar .mask-btn1 { position: relative; - top: 60px; + top: 50px; left: 30px } @@ -337,7 +336,7 @@ div.card-img-overlay:hover { } .product_page { - margin-left: 110px; + margin-left: 60px; margin-top: 100px } @@ -827,8 +826,8 @@ mark { .anchor-box { position: fixed; - top: 30%; - left: 25px; + top: 25%; + left: 50px; display: -webkit-flex; display: flex; flex-direction: column; @@ -906,32 +905,33 @@ mark { @media screen and (max-width:1580px) { .anchor-box { - left: 10px + left: 20px } } -@media screen and (max-width:1445px) { - .anchor-box { - left: -10px - } -} @media screen and (max-width:1260px) { .anchor-box { - left: -35px + left: 0px } } -@media screen and (max-width:1000px) { +@media screen and (max-width:1100px) { .anchor-box { - left: -60px + left: -12px + } +} + +@media screen and (max-width:980px) { + .anchor-box { + left: -34px } } @media screen and (max-width:768px) { .anchor-box { position: fixed; - top: 45%; + top: 35%; left: auto; right: -120px; display: -webkit-flex; @@ -1169,4 +1169,25 @@ table tr:nth-child(odd) { display: block !important; overflow: scroll; } -} \ No newline at end of file +} + + +.files_download { + display: flex; + flex-direction: row; + justify-content: space-evenly; + flex-wrap: wrap; + margin: 45px; +} + +.files_download .item{ + display: flex; + justify-content: center; + width: 200px; + box-shadow: 4px 4px 7px 0px #cecece; + transition:all .25s ease; +} + +.files_download .item:hover{ + transform:scale(1.2); +} diff --git a/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/01.jpg b/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/01.jpg new file mode 100644 index 00000000..fdcbdff1 Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/01.jpg differ diff --git a/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/hello_m5.gif b/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/hello_m5.gif new file mode 100644 index 00000000..c457bdd1 Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/hello_m5.gif differ diff --git a/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/m5burner_wifi.jpg b/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/m5burner_wifi.jpg new file mode 100644 index 00000000..b8a944c8 Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/m5burner_wifi.jpg differ diff --git a/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/uiflow_apikey.jpg b/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/uiflow_apikey.jpg new file mode 100644 index 00000000..72896f47 Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/uiflow_apikey.jpg differ diff --git a/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/uiflow_program_mode.jpg b/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/uiflow_program_mode.jpg new file mode 100644 index 00000000..5e742383 Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/uiflow_program_mode.jpg differ diff --git a/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/uiflow_wifi_setup1.jpg b/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/uiflow_wifi_setup1.jpg new file mode 100644 index 00000000..53e548aa Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/uiflow_wifi_setup1.jpg differ diff --git a/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/uiflow_wifi_setup2.jpg b/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/uiflow_wifi_setup2.jpg new file mode 100644 index 00000000..2b7dbc12 Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stack_core/get_started_with_uiflow/uiflow_wifi_setup2.jpg differ diff --git a/docs/assets/img/getting_started_pics/m5stickc/m5burner_stickc01.jpg b/docs/assets/img/getting_started_pics/m5stickc/m5burner_stickc01.jpg new file mode 100644 index 00000000..22562d38 Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stickc/m5burner_stickc01.jpg differ diff --git a/docs/assets/img/getting_started_pics/m5stickc/m5burner_stickc02.jpg b/docs/assets/img/getting_started_pics/m5stickc/m5burner_stickc02.jpg new file mode 100644 index 00000000..8dbce516 Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stickc/m5burner_stickc02.jpg differ diff --git a/docs/assets/img/getting_started_pics/m5stickc/m5stickc_apikey01.jpg b/docs/assets/img/getting_started_pics/m5stickc/m5stickc_apikey01.jpg new file mode 100644 index 00000000..65f6e393 Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stickc/m5stickc_apikey01.jpg differ diff --git a/docs/assets/img/getting_started_pics/m5stickc/m5stickc_desktop_ide01.jpg b/docs/assets/img/getting_started_pics/m5stickc/m5stickc_desktop_ide01.jpg new file mode 100644 index 00000000..ef54e9d8 Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stickc/m5stickc_desktop_ide01.jpg differ diff --git a/docs/assets/img/getting_started_pics/m5stickc/m5stickc_example.jpg b/docs/assets/img/getting_started_pics/m5stickc/m5stickc_example.jpg new file mode 100644 index 00000000..abf08a73 Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stickc/m5stickc_example.jpg differ diff --git a/docs/assets/img/getting_started_pics/m5stickc/m5stickc_usb_connect.jpg b/docs/assets/img/getting_started_pics/m5stickc/m5stickc_usb_connect.jpg new file mode 100644 index 00000000..24015bff Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stickc/m5stickc_usb_connect.jpg differ diff --git a/docs/assets/img/getting_started_pics/m5stickc/m5stickc_usb_mode01.jpg b/docs/assets/img/getting_started_pics/m5stickc/m5stickc_usb_mode01.jpg new file mode 100644 index 00000000..bca49e7d Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stickc/m5stickc_usb_mode01.jpg differ diff --git a/docs/assets/img/getting_started_pics/m5stickc/m5stickc_wifi_mode.jpg b/docs/assets/img/getting_started_pics/m5stickc/m5stickc_wifi_mode.jpg new file mode 100644 index 00000000..1c6de0c6 Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stickc/m5stickc_wifi_mode.jpg differ diff --git a/docs/assets/img/getting_started_pics/m5stickc/m5stickc_wifi_setup01.jpg b/docs/assets/img/getting_started_pics/m5stickc/m5stickc_wifi_setup01.jpg new file mode 100644 index 00000000..8770e26a Binary files /dev/null and b/docs/assets/img/getting_started_pics/m5stickc/m5stickc_wifi_setup01.jpg differ diff --git a/docs/en/core/face_kit.md b/docs/en/core/face_kit.md index aa8f8aab..dc2d3f01 100644 --- a/docs/en/core/face_kit.md +++ b/docs/en/core/face_kit.md @@ -136,6 +136,7 @@ Key string values Key Int Values (Int values are the ASCII value of each key) + diff --git a/docs/en/hat/hat-joyc.md b/docs/en/hat/hat-joyc.md index a237843f..2d60632a 100644 --- a/docs/en/hat/hat-joyc.md +++ b/docs/en/hat/hat-joyc.md @@ -46,7 +46,12 @@ -- **[Arduino](https://github.com/m5stack/M5-ProductExampleCodes/tree/master/Hat/JoyC)** +- **Arduino** + +Use with RoverC HAT, please click [here](https://github.com/m5stack/M5-ProductExampleCodes/tree/master/Hat/JoyC) + +Use alone [here](https://github.com/m5stack/M5StickC/blob/master/examples/Hat/JoyC/JoyC.ino) + diff --git a/docs/en/quick_start/m5core/m5stack_core_quick_start.md b/docs/en/quick_start/m5core/m5stack_core_quick_start.md index 6f4661d4..eb2efc67 100644 --- a/docs/en/quick_start/m5core/m5stack_core_quick_start.md +++ b/docs/en/quick_start/m5core/m5stack_core_quick_start.md @@ -4,7 +4,7 @@
- +

UIFlow

 diff --git a/docs/en/quick_start/m5stickc/m5stickc_quick_start.md b/docs/en/quick_start/m5stickc/m5stickc_quick_start.md index 81b0633d..adfc6805 100644 --- a/docs/en/quick_start/m5stickc/m5stickc_quick_start.md +++ b/docs/en/quick_start/m5stickc/m5stickc_quick_start.md @@ -5,7 +5,7 @@
- +

UIFlow

 diff --git a/docs/en/quick_start/m5stickc/m5stickc_quick_start_with_uiflow.md b/docs/en/quick_start/m5stickc/m5stickc_quick_start_with_uiflow.md index d6e4dd89..c938465c 100644 --- a/docs/en/quick_start/m5stickc/m5stickc_quick_start_with_uiflow.md +++ b/docs/en/quick_start/m5stickc/m5stickc_quick_start_with_uiflow.md @@ -1,161 +1,163 @@ -# M5StickC Quick Start - UIFlow {docsify-ignore-all} +# UIFlow Quick Start - +?> This tutorial applies to M5StickC -**[1. Burn UIFlow Firmware](#_1-Burn-UIFlow-Firmware)** +## Burning tool -**[2. Wi-Fi Setting](#_2-Wi-Fi-Setting)** +> Please click the button below to download the corresponding M5Burner firmware burning tool according to your operating system. Unzip and open the application. -**[3. Program](#_3-Program)** +
+

+ + + Windows10 + +

-## 1. Burn UIFlow Firmware +

+ + + MacOS + +

-### (1) Download M5Burner +

+ + + Linux + +

+
->1.Click on the M5Burner burning tool for your operating system below to download. + -
-

M5Burner:

-

- Windows - MacOS - Linux

+?> Note: After the installation of MacOS users, please put the application in the Application folder, as shown in the figure below. + +> + + +## Firmware burning + +> 1. Double-click the Burner burning tool, click the download button in the left menu, download the firmware version you need, and then connect the M5 device to the computer through a Type-C data cable, select the corresponding COM port, and the baud rate , And the type of programming device. + +?> Note: M5Burner includes UIFlow firmware versions for many M5Stack products. Therefore, you need to select the correct device type before proceeding with the burning process to obtain the firmware that matches the device, as shown in the figure below. (The burning rate can use the default configuration of the burner. In special cases, you can try to reduce it to 115200). + + + +> 2. Select the firmware version you want to burn, connect the device to the computer via Type-C data cable, select the corresponding COM port and device type. Click "Burn" to start burning. + +?> When first burning or the firmware program runs abnormally, you can click "Erase" to erase the flash memory. In the subsequent firmware update, there is no need to erase again, otherwise the saved Wi-Fi information will be deleted and the API Key will be refreshed. + + + + +## Configure WIFI + +> UIFlow provides an offline and web version of the programmer. When using the web version of UIFlow, we need to configure a WiFi connection for the device. The following describes two ways to configure WiFi connection for the device (flash configuration and AP hotspot configuration). + +### Burn configuration WiFi + +?> UIFlow-1.4.5 and above can write WiFi information directly through M5Burner. + + + +### AP hotspot configuration WiFi + +> 1. Press and hold the power button on the left to turn on the machine. If WiFi is not configured, the system will automatically enter the network configuration mode when it is turned on for the first time. Suppose you want to re-enter the network configuration mode after running other programs, you can refer to the operation below. After the UIFlow Logo appears at startup, quickly click the Home button (center M5 button) to enter the configuration page. Press the button on the right side of the fuselage to switch the option to Setting, and press the Home button to confirm. Press the right button to switch the option to WiFi Setting, press the Home button to confirm, and start the configuration. + + + +> 2. After successfully connecting to the hotspot with your mobile phone, open the mobile phone browser to scan the QR code on the screen, or directly access __192.168.4.1__, enter the page to fill in your personal WIFI information, and click Configure to make the device record your WiFi information. The device will restart automatically after successful configuration. And enter programming mode. + +?> Note: Special characters such as "space" are not allowed in the configured WiFi information. + + + + +## Network Programming Mode and API KEY + +#### Enter network programming mode + +?> Network programming mode is a docking mode between M5 device and UIFlow web programming platform. The screen will show the current network connection status of the device. When the indicator is green, it means that you can receive program push at any time. By default, after the first successful WiFi network configuration, the device will automatically restart and enter the network programming mode. If you do not know how to re-enter the programming mode after running other applications, you can refer to the following operations. + +> After booting, press button A in the main menu interface to select the programming mode, and wait for the right indicator of the network indicator to turn green in the programming mode page, and access it through a computer browser[flow.m5stack.com](http://flow.m5stack.com/)Enter the UIFlow programming page. + + + +#### API KEY Pairing + +> API KEY is the communication credentials for M5 devices when using UIFlow web programming. By configuring the corresponding API KEY on the UIFlow side, the program can be pushed for the specified device. The user needs to visit in the computer browser[flow.m5stack.com](http://flow.m5stack.com/)Enter the UIFlow programming page, click the setting button in the menu bar at the upper right corner of the page, enter the API Key on the corresponding device, select the hardware used, click OK to save, and wait for the prompt to connect successfully. + + + + +## Light up LED +  +> Complete the above steps, you can start programming with UIFlow. The following will show you a simple program to drive M5StickC to light up the LED indicator. (1. Drag the LED to light up the program block. 2. Splice to the Setup initialization program. 3 Click the Run button in the upper right corner) + + + + +## UIFlow Desktop IDE + +> UIFlow Desktop IDE is an offline version of UIFlow programmer, which does not require network dependencies, and can provide a responsive program push experience. Please click the corresponding version of ** UIFlow-Desktop-IDE ** to download according to your operating system . + +
+

+ + + Windows10 + +

+ +

+ + + MacOS + +

+ +

+ + + Linux + +

+#### USB programming mode -### (2) Flash the firmware +> Unzip the downloaded UIFlow Desktop IDE archive, and double-click to execute the application. -- Connect M5StickC to your computer via the USB Type-C cable, unzip the M5Burner pakage -- Here appears a folder, open the folder and double-click the executable `M5Burner.exe` - + -- Select the `COM` number and `Baudrate` (115200), and select the latest version of UIFlow firmware. +?> After the software starts, it will automatically detect whether your computer has a USB driver (CP210X), click Install, and follow the prompts to install. (M5StickC does not require a CP210X driver, so users can choose to install or skip) - + -- Download UIFlow firmware from the cloud. +> After the driver installation is complete, it will automatically enter the UIFlow Desktop IDE and automatically pop up the configuration box. At this time, connect the M5 device to the computer through the Tpye-C data cable. - + -- Before Click `Burn` make sure you click erase first, and then make sure you choose the right firmware on the left list. - +!> Using UIFlow Desktop IDE requires M5 device with UIFlow firmware and enter ** USB programming mode **. + +> Click the power button on the left side of the device to restart. Quickly select Setup after entering the menu, enter the configuration page, and select ** USB mode **. + + + +> Select the corresponding port, and the programming device, click OK to connect. + + -- Click `Burn` +## Related Links -- If you see the following message, means the firmware has downloaded onto your M5Core. - - - -## 2. Wi-Fi Setting - -#### (1) Select `SETUP` - -After flash the UIFlow firmware, press and hold the `Power` button (bottom left side) for 2 seconds until the screen light up. - - +* [M5StickC IoT Getting Started Tutorial](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/M5StickC_Guide.pdf) +* [UIFlow Block introduction](zh_CN/uiflow/uiflow_home_page) -#### (2) Connect to AP - -#### Notice - -The information content of the configured WIFI is not allowed to use Chinese and special symbols. - -- Now the device is in Wi-Fi AP mode, use your phone to connect this AP. The AP name would start with "M5-". -- After connected to the AP, your phone and the device has established a Wi-Fi connection. -- Once it connected, you will need to visit this address (192.168.4.1) on your phone browser. Here you will enter the Wi-Fi config page. -- Choose the local Wi-Fi(5G is not supported yet), type in the password. Then click `Configure`. By this way, you can tell the device to use the chosen Wi-Fi to get access to the internet. - - - -#### (3) Connect to Wi-Fi - -- After connected with the local Wi-Fi, M5StickC will reset and get into program mode automatically. -- When a display on the screen shows the UIFlow version number, the `APIKEY` ,and a global icon, which means that the device has connected to the internet. -- The global icon indicate the connection status with UIFlow server. -* Green: Connected -* Red : Disconnected - - - -## 3. Program - -### (1) Connect to UIFlow - -- To get access to UIFlow program paltform, you can either scan the QR code on the M5Core with your tablet,or just visit `flow.m5stack.com` on your PC browser. - - - -- At top right coner, navigate to `setting`,here you will need to type in the `APIKEY` which is displayed on the screen, choose your `Language` and `Device`(Stick-c). Click `OK`. - - - - - -- The device will trying to connect with the UIFlow server. Once the connection has established , the globle icon on the screen will turn green. - -Now you can start programming with UIFlow! - -#### (2) Programming example - -- Drag and drop the icons on the top left corner to place a UI element onto the M5Core simmulator, Let's try with a `Lable` . -- Click the `Lable` to change its properties. - - - -- From `Event`, drag in `Loop` into the programming area. and attach it underneath `Setup` - -- From `Hardware` -> `LED`, drag in some blocks, `LED ON` and `LED OFF`. place them inside `Loop` - -- From `Timer`, drag in block `Wait 1s` - - - -- hit `Run` - - - - -- the LED on the device will blink at a 1Hz frequency. - - - - - - - \ No newline at end of file + diff --git a/docs/en/quick_start/m5stickv/m5stickv_quick_start.md b/docs/en/quick_start/m5stickv/m5stickv_quick_start.md index 1d401453..7bc2d6b4 100644 --- a/docs/en/quick_start/m5stickv/m5stickv_quick_start.md +++ b/docs/en/quick_start/m5stickv/m5stickv_quick_start.md @@ -1,35 +1,30 @@ # M5StickV Quick Start {docsify-ignore-all} -## CONTENT - -**[1. Download Firmware](#Download)** - -**[2. Flash Firmware](#Flash)** - -**[3. Serial Debugging Tool](#Serial-Tool)** - -**[4. Hello World](#Hello-World)** - -**[5. Edit and Run the Code](#Edit-and-Run-the-Code)** - -**[6. MaixPy IDE](#MaixPy-IDE)** - -**[7. Library](#Library)** - -**[8. V-Training](en/related_documents/v-training)** - - - ## EasyLoader - - - - ->1.EasyLoader is a simple and fast program burner, and each product page has a product-related case program for EasyLoader.For users who don't need to customize the firmware or perform other operations, using EasyLoader to burn firmware for M5StickV is the simplest solution.(**Currently EasyLoader is only available for Windows OS**) - ->2.After downloading the software, double-click to run the application, connect the M5 device to the computer via the data cable, select the port parameters, and click **"Burn"** to start burning. +>EasyLoader is a concise and fast program writer, which has a built-in case program related to the product. It can be burned to the main control by simple steps to perform a series of function verification. +
+
+
+
+ Windows + +
+
+
+ +
+ + +

Description:

+

Equipped with Maixpy firmware, test camera, screen graphics display function, and then press the HOME button to turn on the rear fill light.

+
+
+
## Download @@ -42,12 +37,27 @@ >1. Flash tool Kflash_GUI. -
-

Kflash_GUI:

-

- Windows - MacOS - Linux

+
+

+ + + Windows10 + +

+ +

+ + + MacOS + +

+ +

+ + + Linux + +

>2. Connect the device to the computer through the Tpye-C data cable, double-click to open the burning tool**Kflash_GUI** application, select the corresponding device port, development board type (M5StickV), firmware program, baud rate. Click to download , start burning. @@ -191,12 +201,7 @@ Linux command line to run permissions, then execute commands - \ No newline at end of file + diff --git a/docs/en/uiflow/uiflow_home_page.md b/docs/en/uiflow/uiflow_home_page.md index 569723ba..8e08b7bf 100644 --- a/docs/en/uiflow/uiflow_home_page.md +++ b/docs/en/uiflow/uiflow_home_page.md @@ -12,15 +12,13 @@
- -
-
+

Hardware

Some basic control of device hardware in UIFlow, and information acquisition.

@@ -31,14 +29,14 @@

UIFlow display control for characters and graphics, as well as image upload and drawing functions.

View details »

-
- -

Data structure

Introduction to data types in UIFlow, including constants, variables, characters, random numbers, lists, etc.

View details »

+
+ +

Logic

The use of logic judgments, operations, and conditional loops, iterations, functions, etc. in UIFlow.

@@ -49,14 +47,14 @@

The higher-level functions in UIFlow involve remote functions and the use of MQTT communication.

View details »

+
+

Units

+

Introduction to how to use unit devices, such as ToF, ENV, Realy, inlucde I/O,UART,I2C,etc.

+

View details »

+
-
-

Units

-

Introduction to how to use unit devices, such as ToF, ENV, Realy, inlucde I/O,UART,I2C,etc.

-

View details »

-

Modules

Introduce some useful modules block add to your project in UIFlow.

@@ -67,17 +65,12 @@

UIFlow uses FACES panel for interface interaction or data manipulation help you to improve input efficiency.

View details »

-
- - -

Custom

The creation and use of UIFlow custom program blocks.

View details »

-




\ No newline at end of file diff --git a/docs/image/base/device_select.jpg b/docs/image/base/device_select.jpg new file mode 100644 index 00000000..04afcdd5 Binary files /dev/null and b/docs/image/base/device_select.jpg differ diff --git a/docs/index.html b/docs/index.html index 0beabe5f..bf6f14da 100755 --- a/docs/index.html +++ b/docs/index.html @@ -335,6 +335,30 @@ gtag('config', 'UA-138139529-2'); + + + + \ No newline at end of file + diff --git a/docs/zh_CN/quick_start/m5core/m5stack_core_quick_start.md b/docs/zh_CN/quick_start/m5core/m5stack_core_quick_start.md index 3a7aa24c..6d901e6c 100644 --- a/docs/zh_CN/quick_start/m5core/m5stack_core_quick_start.md +++ b/docs/zh_CN/quick_start/m5core/m5stack_core_quick_start.md @@ -4,7 +4,7 @@
- +

UIFlow

 diff --git a/docs/zh_CN/quick_start/m5stickc/m5stickc_quick_start.md b/docs/zh_CN/quick_start/m5stickc/m5stickc_quick_start.md index 9acb33b1..d00ffb21 100644 --- a/docs/zh_CN/quick_start/m5stickc/m5stickc_quick_start.md +++ b/docs/zh_CN/quick_start/m5stickc/m5stickc_quick_start.md @@ -5,7 +5,7 @@
- +

UIFlow

 diff --git a/docs/zh_CN/quick_start/m5stickc/m5stickc_quick_start_with_uiflow.md b/docs/zh_CN/quick_start/m5stickc/m5stickc_quick_start_with_uiflow.md index cd5ec450..1aa6de79 100644 --- a/docs/zh_CN/quick_start/m5stickc/m5stickc_quick_start_with_uiflow.md +++ b/docs/zh_CN/quick_start/m5stickc/m5stickc_quick_start_with_uiflow.md @@ -1,171 +1,163 @@ -# M5StickC 上手指南 - UIFlow {docsify-ignore-all} +# UIFlow 快速上手 - +?>本教程适用于M5StickC -**[1. 烧录 UIFlow 固件](#_1-烧录-UIFlow-固件)** +## 烧录工具 -**[2. 设置 Wi-Fi](#_2-设置-Wi-Fi)** +>请根据您所使用的操作系统，点击下方按钮下载相应的M5Burner固件烧录工具.解压打开应用程序。 -**[3. 例程](#_3-例程)** +
+

+ + + Windows10 + +

-## 1. 烧录 UIFlow 固件 +

+ + + MacOS + +

-#### (1) 下载 M5Burner +

+ + + Linux + +

+
->1.点击下方对应自己操作系统的 M5Burner烧录工具 进行下载. + -
-

M5Burner:

-

- Windows - MacOS - Linux

+?>注意：MacOS用户安装完成后请将应用放入Application文件夹内，如下图所示。 + +> + + +## 固件烧录 + +>1.双击打开Burner烧录工具，在左侧菜单中点击下载按钮，下载你所需要的固件版本，然后将M5设备通过Type-C数据线连接到电脑，选择对应的COM口，波特率，以及烧录设备的类型。 + +?>注意：M5Burner中包含了M5Stack多款产品的UIFlow固件版本。因此你需要在进行烧录前，选择正确的设备类型，以获得与设备匹配的固件，如下图所示。（烧录速率可以使用烧录器默认配置，特殊情况无法烧录可尝试降低至115200）。 + + + +>2.选择好您想要烧录的固件版本，将设备通过Type-C数据线连接至电脑，选择对应COM端口与设备类型.点击"Burn"开始烧录. + +?>首次烧录或固件程序运行异常时，可点击"Erase"擦除flash内存，在后续的固件更新时，则无需再次擦除，否则将删除已保存的Wi-Fi信息且刷新API Key. + + + + +## 配置WIFI + +>UIFlow提供了离线与web版本的编程器，在使用web版本的UIFlow时，我们需要为设备配置WiFi连接。下面介绍为设备配置WiFi连接的两种方式（烧录配置与AP热点配置）。 + +### 烧录配置WiFi + +?>UIFlow-1.4.5以上版本可直接通过M5Burner写入WiFi信息。 + + + +### AP热点配置WiFi + +>1.长按左侧电源键开机，在未配置WiFi的情况下，首次开机将自动进入网络配置模式。假设在运行其他程序后，你想要重新进入网络配置模式，你可以参照下方操作。开机出现UIFlow Logo后，快速单击Home键（中心M5按键），进入配罝页面。按机身右侧按键将选项切换至Setting，按下Home键确认。按右侧按键切换选项至WiFi Setting,按下Home键确认，开始配置。 + + + +>2.用手机连接热点成功后，打开手机浏览器扫描屏幕上的二维码，或是直接访问 __192.168.4.1__，进入页面填写个人的WIFI信息，点击配置，使设备记录下你的WiFi信息。配置成功后设备将自动重启。并进入编程模式。 + +?>注意：配置的WiFi信息中，不允许出现"空格"等特殊字符。 + + + + +## 网络编程模式与API KEY + +#### 进入网络编程模式 + +?>网络编程模式是M5设备与UIFlow web编程平台的一个对接模式,屏幕会显示出当前设备的网络连接状态。当指示标志为绿色时，则代表随时可接收程序推送。默认情况下，在首次WiFi网络配置成功后，设备将自动重启，并进入网络编程模式。若您在运行其他应用后不知如何重新进入编程模式，你可以参考以下操作。 + +>开机后，在主菜单界面按下按键A选择编程模式，在编程模式页面等待网络指示标志右红变成绿色，通过电脑浏览器访问[flow.m5stack.com](http://flow.m5stack.com/)进入UIFlow编程页面. + + + +#### API KEY配对 + +>API KEY是M5设备在使用UIFlow web编程时的通信凭证。通过在UIFlow端配置相应的API KEY，能够为指定的设备推送程序。用户需在电脑端浏览器访问[flow.m5stack.com](http://flow.m5stack.com/)进入UIFlow编程页面，点击页面右上角的菜单栏中的设置按钮，输入对应设备上的API Key，选择使用的硬件，点击OK保存，等待提示连接成功。 + + + + +## 点亮LED灯 + +>完成以上步骤，就可以开始使用UIFlow进行编程了。下面将向你演示一个简单的程序，驱动M5StickC点亮LED指示灯。（1. 拖动LED点亮程序块 2. 拼接至Setup初始化程序 .3 点击右上角运行按钮 ） + + + + +## UIFlow Desktop IDE + +>UIFlow Desktop IDE是一个离线版的UIFlow编程器，无需网络依赖，且能够提供反应迅速程序推送体验，请根据您的操作系统，点击下方按钮对应版本的 **UIFlow-Desktop-IDE** 进行下载. + +
+

+ + + Windows10 + +

+ +

+ + + MacOS + +

+ +

+ + + Linux + +

+#### USB编程模式 -#### (2) 烧录固件 +>将下载好的UIFlow Desktop IDE压缩包解压，双击执行应用程序. -用 USB Type-C 线将 M5StickC 连接到 PC，解压 M5Burner，然后双击可执行文件 `M5Burner.exe`，以打开 M5Burner + -选择合适的 `COM`, `Baudrate` 和 最新版本的`固件` +?>软件启动后，将自动检测你的电脑是否安装有USB驱动（CP210X），点击Install，根据提示，进行安装.(M5StickC无需CP210X驱动，因此用户可选择安装或是跳过) -* 选择 COM：COM31 -* 选择波特率 ( Baudrate ): 115200 + -* 下载并选择固件 ( Firmware ): UIFlow-vx.x.x-StickC +>驱动安装完成后，将自动进入UIFlow Desktop IDE并自动弹出配置框，此时将M5设备通过Tpye-C数据线连接至电脑. - + +!>使用UIFlow Desktop IDE需要M5设备搭载UIFlow固件且进入**USB编程模式**. -点击 `Burn` 以烧录固件 +>单击设备左侧电源键重启，进入菜单后快速选择Setup，进入配置页面，选择**USB mode**. -下图所示，表示 M5StickC 的固件已经下载成功 + - +>选择好对应的端口，与编程设备，点击OK进行连接. -## 2. 设置 Wi-Fi + -成功烧录 M5StickC 的 UIFlow 固件之后, 轻按一下 M5StickC 左下角的 `Power Switch` 按键 -M5StickC 将会开启 Wi-Fi 热点，并显示热点 ( AP ) 名字，如下图所示 +## 相关链接 - +* [M5StickC物联网入门教程](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/M5StickC_Guide.pdf) +* [UIFlow Block介绍](zh_CN/uiflow/uiflow_home_page) -#### (2) 连接到 AP -#### 注意 - -配置的WIFI的信息内容不允许使用中文及特殊符号. - -打开您手机或电脑的 Wi-Fi 设置，然后连接显示在 M5StickC 屏幕上的热点 ( 比如, 我这里显示的热点名字是 M5-80f0 )，成功连接之后, 打开浏览器访问网址 `192.168.4.1`, 然后选择可联网的 Wi-Fi，并输入 Wi-Fi 密码。 ( 现在, 我这里的 Wi-Fi 是 M5 。 ) - - - -#### (3) 连接 Wi-Fi - -M5StickC 重启，然后成功地连上了 Wi-Fi ( 我使用的是 M5 ), M5StickC 的屏幕上会显示它的 `APIKEY` - -*APIKEY 的说明: 设备唯一识别码。只要 UIFlow 连上了这个 M5StickC 设备的 APIKEY，编程好的代码就会下载到这个设备中。* - - - -此时屏幕上网络图标的状态说明: - -* 绿色：M5StickC 成功地连接到了 UIFlow 服务器, 也即在线状态，可以开始编程 - -* 红色：M5StickC 还没连接上 UIFlow 服务器，处于离线状态 - -## 4. 例程 - -#### (1) 连接到 UIFlow - -如果您使用电脑编程, 那么在浏览器中访问 `flow.m5stack.com` - - - -然后点击 UIFlow 的左上角的齿轮，在弹出的窗口中输入您的 M5StickC 上显示的 APIKEY，点击 `保存`，这样 UIFlow 就绑定了您的 M5StickC 设备。 - -*注意：每次您在 UIFlow 中上传程序到 M5StickC 之前，请注意确保当前的 UIFlow 连接的是您的 M5StickC 的 APIKEY，也即确保 UIFlow 绑定的是您的 M5StickC 设备。* - - - - - -现在，您已经可以开始使用 UIFlow 啦! - -#### (2) 编写例程 - -拖拽 UIFlow 界面左上角的 `Lable` 控件到 `M5StickC` 中，改变他们的属性： `文本` and `字体` - - - -从 `硬件` -> `LED`中，拖拽一个出名为 `LED ON` 和另外一个名为 `LED OFF` 的 Block - -从 `时间` 中, 拖拽出两个名为 `等待 1 秒` 的 Block - - - -点击 UIFlow 界面右上角的 `RUN` 按钮 - - - -**结果:** - - - - -#### (3) 编程案例 - -#### 按键控制LED灯 - - - -#### IMU控制 - - - -#### Remote远程控制 - - - - - - - - - - - - - \ No newline at end of file + diff --git a/docs/zh_CN/quick_start/m5stickv/m5stickv_quick_start.md b/docs/zh_CN/quick_start/m5stickv/m5stickv_quick_start.md index b2ea7bfd..f52d8962 100644 --- a/docs/zh_CN/quick_start/m5stickv/m5stickv_quick_start.md +++ b/docs/zh_CN/quick_start/m5stickv/m5stickv_quick_start.md @@ -1,33 +1,30 @@ -# M5StickV 上手指南 {docsify-ignore-all} - -## 目录 - -**[1. 下载固件](#下载固件)** - -**[2. 烧录固件](#烧录固件)** - -**[3. 串口调试工具](#串口调试工具)** - -**[4. Hello World](#Hello-World)** - -**[5. 编辑与运行文件](#编辑与运行文件)** - -**[6. MaixPy IDE](#MaixPy-IDE)** - -**[7. 程序库](#程序库)** - -**[8. V-Training](zh_CN/related_documents/v-training)** - +# M5StickV 上手指南 ## EasyLoader - +>EasyLoader是一个简洁快速的程序烧录器，其内置了一个产品相关的案例程序，通过简单步骤将其烧录至主控，即可进行一系列的功能验证. - - ->1.EasyLoader是一个简洁快速的程序烧录器，每一个产品页面里的EasyLoader都提供了一个与产品相关的案例程序，对于不需要对固件进行定制或进行其他操作的用户，使用EasyLoader为M5StickV烧录固件，会是一个最简洁的方案（**目前EasyLoader仅适用于Windows操作系统**）. - ->2.下载软件后，双击运行应用程序，将M5设备通过数据线连接至电脑,选择端口参数，点击 **"Burn"** 即可开始烧录 +
+
+
+
+ Windows + +
+
+
+ +
+ + +

案例描述:

+

搭载Maixpy固件，测试摄像头，屏幕图形显示功能，单击HOME键可开关背部补光灯.

+
+
+
## 下载固件 @@ -41,14 +38,30 @@ >1.点击下方对应自己操作系统的 Kflash_GUI烧录工具进行下载. -
-

Kflash_GUI:

-

- Windows - MacOS - Linux

+
+

+ + + Windows10 + +

+ +

+ + + MacOS + +

+ +

+ + + Linux + +

+ >2.将设备通过Tpye-C数据线连接至电脑，双击打开烧录工具**Kflash_GUI**应用程序,选择对应的设备端口、开发板类型(M5StickV)、固件程序、波特率. 点击下载，开始烧录 . @@ -145,6 +158,7 @@ MaixPy IDE能够便捷的实现脚本程序的实时编辑、上传、执行，
+ #### 安装MaixPy IDE Windows平台可直接双击exe文件，运行安装程序. @@ -184,12 +198,7 @@ Linux命令行给运行权限然后,执行命令 - \ No newline at end of file + diff --git a/docs/zh_CN/uiflow/introduction.md b/docs/zh_CN/uiflow/introduction.md index 6ffc88c4..6eca9fc4 100644 --- a/docs/zh_CN/uiflow/introduction.md +++ b/docs/zh_CN/uiflow/introduction.md @@ -1,97 +1,146 @@ -## UIFlow固件 +# UIFlow快速上手 -* __下载驱动程序__ +## 驱动安装 -> 访问[m5stack.com](http://m5stack.com/)下载Windows操作系统对应的[CP210X驱动程序](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/drivers/CP210x_VCP_Windows.zip) +>程序烧录前，M5Core型主机（包含BASIC/GRAY/M5GO/FIRE/FACES）用户请根据您使用的操作系统，点击下方按钮下载相应的CP210X驱动程序压缩包.在解压压缩包后，选择对应操作系统位数的安装包进行安装。 -> 访问[m5stack.com](http://m5stack.com/)下载MacOS操作系统对应的[CP210X驱动程序](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/drivers/CP210x_VCP_MacOS.zip) +?>注意：M5StickC/V/T/ATOM系列支持可免驱动使用，用户可跳过该驱动安装步骤。 -> 访问[m5stack.com](http://m5stack.com/)下载Linux操作系统对应的[CP210X驱动程序](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/drivers/CP210x_VCP_Linux.zip) -* __安装驱动程序__ +* __下载CP2104驱动程序__ -> 解压压缩包后，选择对应操作系统位数的安装包进行安装 +
+

+ + + Windows10 + +

-> +

+ + + MacOS + +

-* __下载M5Burner__ +

+ + + Linux + +

+
-> 访问[flow.m5stack.com](http://flow.m5stack.com/)下载最新的固件包和[M5Burner烧录工具(Windows版)](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/software/M5Burner.zip) +> -> 访问[flow.m5stack.com](http://flow.m5stack.com/)下载最新的固件包和[M5Burner烧录工具(MacOS版)](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/software/M5Burner_MacOS.zip) -> 访问[flow.m5stack.com](http://flow.m5stack.com/)下载最新的固件包和[M5Burner烧录工具(Linux版)](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/software/M5Burner_Linux.zip) +## 烧录工具 -?> Mac OS 用户需要将M5Burner放入Application文件夹内 +>请根据您所使用的操作系统，点击下方按钮下载相应的M5Burner固件烧录工具.解压并进行安装。 -> +
+

+ + + Windows10 + +

-* __开始烧录__ +

+ + + MacOS + +

-> 解压压缩包后，双击打开Burner烧录工具，将M5设备通过Type-C数据线连接到电脑，选择对应的COM口，波特率（烧录的速率建议921600或115200），以及你想更新的固件版本，1.4.5以上版本可以直接通过M5Bunner配置WIFI +

+ + + Linux + +

+
+ +?>注意：MacOS用户安装完成后请将应用放入Application文件夹内，如下图所示。 + +> + +## 固件烧录 + +>双击打开Burner烧录工具，在左侧菜单中点击下载按钮，下载你所需要的固件版本，然后将M5设备通过Type-C数据线连接到电脑，选择对应的COM口，波特率，以及烧录设备的类型。 + +?>注意：M5Burner中包含了M5Stack多款产品的UIFlow固件版本。因此你需要在进行烧录前，选择正确的设备类型，以获得与设备匹配的固件，如下图所示。（烧录速率可以使用烧录器默认配置，特殊情况无法烧录可尝试降低至115200）。 + + + >__首次烧录需点击Erase进行一次擦除（在往后的更新中则无需再次擦除，否则将清除已保存的WIFI信息，以及刷新API Key），擦除完成后点击Burn开始烧录__ -> +> ## 配置WIFI ->1.4.5以上版本可直接通过M5Burner写入wifi信息 +>UIFlow提供了离线与web版本的编程器，在使用web版本的UIFlow时，我们需要为设备配置WiFi连接。下面介绍为设备配置WiFi连接的两种方式（烧录配置与AP热点配置），使用热点配置的用户请根据自己的设备类型，参照下方不同设备的说明进行配置操作。 -> +### 烧录配置WiFi -* __M5GO__ +?>UIFlow-1.4.5以上版本可直接通过M5Burner写入wifi信息。 ->__*1.4.5以上版本可直接通过M5Bunner配置__ +> ->1.单击设备的电源键开机，在屏幕出现Logo后按下A键，然后用手机连接屏幕上显示的wifi热点 +### AP热点配置WiFi ->2.用手机连接热点成功后，打开手机浏览器扫描屏幕上的二维码，或是直接访问 __192.168.4.1__，进入页面填写个人的WIFI信息，使得设备连接上你的个人网络 +* __BASIC/GRAY/M5GO/FIRE/FACES__ + +>1.单击设备左侧的红色电源键开机，在屏幕出现UIFlow Logo后迅速按下按键A，使用手机连接设备屏幕上显示的wifi热点 + +>2.用手机连接热点成功后，打开手机浏览器扫描屏幕上的二维码，或是直接访问 __192.168.4.1__，进入页面填写个人的WIFI信息，点击配置，使设备记录下你的WiFi信息。配置成功后设备将自动重启。并进入编程模式。 >    - * __M5StickC__ ->__*1.4.5以上版本可直接通过M5Bunner配置__ - ->1.单击设备的电源键开机 - ->2.用手机连接屏幕上显示的wifi热点，然后打开手机浏览器直接访问 __192.168.4.1__，进入页面填写个人的WIFI信息，使得设备连接上你的个人网络 +>1.长按设备的电源键开机 2.用手机连接屏幕上显示的wifi热点，使用手机浏览器直接访问 __192.168.4.1__，进入页面填写个人的WIFI信息，点击配置，使设备记录下你的WiFi信息。配置成功后设备将自动重启。并进入编程模式。 >    -* __Atom Matrix__ __&__ __Atom Lite__ +* __Atom Matrix/Atom Lite__ ->__*1.4.5以上版本可直接通过M5Bunner配置__ +>1.将设备连接USB供电后，长按中间按键，等到LED变为黄色呼吸灯时松开,进入网络配置模式，此时黄灯常亮。 ->1.设备通电后，按住中间按键不放，等到LED变为黄色呼吸灯时松开,此时黄灯常亮 +> ->2.打开手机浏览器直接访问 __192.168.4.1__，进入页面填写个人的WIFI信息，使得设备连接上你的个人网络 +>2.打开手机浏览器直接访问 __192.168.4.1__，进入页面填写个人的WIFI信息，点击配置，使设备记录下你的WiFi信息。配置成功后设备将自动重启。并进入编程模式。 -## 配置API Key -#### 进入编程模式 +## 编程模式与API KEY -* __M5GO__ +#### 进入网络编程模式 ->开机后，在主菜单选择编程模式，等待信号指示灯右红变成绿色（这表示M5GO连接网络成功），用平板扫描屏幕上的二维码，或是在电脑浏览器直接访问[flow.m5stack.com](http://flow.m5stack.com/)进入UIFlow编程页面，此外通过设置页面可以更改UIFlow连接服务器，新加坡服务器网址为flow01.m5stack.com +>网络编程模式是M5设备与UIFlow web编程平台的一个对接模式,屏幕会显示出当前设备的网络连接状态。当指示标志为绿色时，则代表随时可接收程序推送。 + +?>默认情况下，在首次WiFi网络配置成功后，设备将自动重启，并进入网络编程模式。若您在运行其他应用后不知如何重新进入编程模式，你可以参考以下操作。 + +* __BASIC/GRAY/M5GO/FIRE/FACES__ + +>开机后，在主菜单界面按下按键A选择编程模式，在编程模式页面等待信号指示灯右红变成绿色，用平板扫描屏幕上的二维码，或是在电脑浏览器直接访问[flow.m5stack.com](http://flow.m5stack.com/)进入UIFlow编程页面，此外通过设置页面可以更改UIFlow连接服务器，新加坡服务器网址为flow01.m5stack.com > * __M5StickC__ ->开机后，等待地球指示灯红色变成绿色（这表示M5StickC连接网络成功），在电脑浏览器直接访问[flow.m5stack.com](http://flow.m5stack.com/)进入UIFlow编程页面 +>开机出现UIFlow logo后快速按下中间按键进入功能菜单（单击机身右侧按键可切换当前选项），按下中间按键选择Program编程模式，等待网络连接成功，等待网络指示标志由红色变成绿色（这表示M5StickC连接网络成功） -* __Atom Matrix__ __&__ __Atom Lite__ +* __Atom Matrix/Atom Lite__ ->开机后，等待LED指示灯红色变成绿色（这表示Atom连接网络成功），在电脑浏览器直接访问[flow.m5stack.com](http://flow.m5stack.com/)进入UIFlow编程页面 +>开机后，长按设备中间按键，等待呼吸灯转化绿灯时，松开按键。进入在线编程模式。 模式启动后将开始WIFI连接，此时等待LED指示灯红色变成绿色（这表示Atom连接网络成功），在电脑浏览器直接访问[flow.m5stack.com](http://flow.m5stack.com/)进入UIFlow编程页面。 #### 填写API Key ->进入UIFlow后，点击页面右上角的菜单栏中的设置按钮，输入对应设备上的API Key，点击OK保存，等待提示连接成功 +>API KEY是M5设备在使用UIFlow web编程时的通信凭证。通过在UIFlow端配置相应的API KEY，能够为指定的设备推送程序。用户需在电脑端浏览器访问[flow.m5stack.com](http://flow.m5stack.com/)进入UIFlow编程页面，点击页面右上角的菜单栏中的设置按钮，输入对应设备上的API Key，点击OK保存，等待提示连接成功。 > @@ -100,19 +149,35 @@ > -## UIFlow-IDE ->如果你希望离线使用UIFlow，点击下方对应自己操作系统的 **UIFlow-Desktop-IDE** 进行下载. +## UIFlow Desktop IDE -
-

下载 UIFlow Desktop IDE:

-

- Windows - MacOS - Linux -

+>UIFlow Desktop IDE是一个离线版的UIFlow编程器，无需网络依赖，且能够提供反应迅速程序推送体验，请根据您的操作系统，点击下方按钮对应版本的 **UIFlow-Desktop-IDE** 进行下载. + +
+

+ + + Windows10 + +

+ +

+ + + MacOS + +

+ +

+ + + Linux + +

+ #### 基本配置 >将下载好的UIFlow Desktop IDE压缩包解压，双击执行应用程序. @@ -141,13 +206,13 @@ >长按机身左侧的电源键2秒进行开机，在出现UIFlow Logo后，快速单击Home键（中心M5按键），进入配罝页面。按机身右侧按键将选项切换至Setting，按下Home键确认。按右侧按键切换选项至USB mode,按下Home键确认，进入USB编程模式.在IDE中选择相应的COM口与设备，点击连接。 - + !>如果你使用的是Atom请按以下说明操作 >在上电同时（或重启时）按住中间按键不要松开，菜单模式以呼吸灯形式变色，等到灯光变换为蓝色呼吸灯时松开，即进入USB模式（更多信息参考https://docs.m5stack.com/#/zh_CN/quick_start/atom/atom_quick_start） -> +> ## 相关教材 @@ -155,6 +220,7 @@ * [M5GO编程入门教程](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/UIFlow-Book-zh_cn.pdf) +
KeyACM% ÷0-9X-+= +/-.