mirror of
https://github.com/m5stack/m5-docs.git
synced 2026-05-20 10:23:01 -07:00
change uiflow docs
This commit is contained in:
vany5921
Binary file not shown.
|
After Width: | Height: | Size: 36 KiB |
@@ -9,6 +9,7 @@
|
||||
|
||||
4. [Install USB Driver](#Install-USB-Driver)
|
||||
|
||||
5. [ArduinoAPI](#ArduinoAPI)
|
||||
|
||||
## Install Arduino-IDE
|
||||
|
||||
@@ -90,14 +91,28 @@
|
||||
|
||||
<img src="assets/img/related_documents/Arduino_IDE/CP210X_MAC.png">
|
||||
|
||||
<!-- ### For Linux
|
||||
# ArduinoAPI
|
||||
|
||||
即将上线... -->
|
||||
## M5Core
|
||||
|
||||
<!--
|
||||
## 编译上传程序 -->
|
||||
|||
|
||||
|:---:|:---:|
|
||||
|**[System](en/api/system)** | **[Speaker](en/api/speaker)** |
|
||||
|**[LCD](en/api/lcd)** | **[Button](en/api/button)** |
|
||||
|**[IMU Sensor(MPU9250)](en/api/mpu9250)** | **[TF Card](en/api/tf)** |
|
||||
|**[Power](en/api/power)** |**[I/O](en/api/gpio)** |
|
||||
|**[I2C Communication](en/api/commutil)** | **[WIFI](en/api/wifi)**|
|
||||
|**[Timer](en/api/ticker)**|
|
||||
|
||||
|
||||
## M5StickC
|
||||
|
||||
|||
|
||||
|:---:|:---:|
|
||||
|**[System](en/api/system_m5stickc)** | **[Power Management(AXP192)](en/api/axp192_m5stickc)** |
|
||||
|**[TFT Screen](en/api/lcd_m5stickc)** | **[IMU(SH200Q)](en/api/sh200q_m5stickc)** |
|
||||
|**[RTC](en/api/rtc)**|
|
||||
|
||||
|
||||
|
||||
<style>
|
||||
|
||||
@@ -216,3 +216,83 @@ Stop timer.
|
||||
>Add two timers, count separately according to time parameters.
|
||||
|
||||
><img src="/image/Program_structure/Timer_user.gif" width="50%">
|
||||
|
||||
# UIFlow Desktop IDE deployment{docsify-ignore-all}
|
||||
|
||||
1. [Install UIFlow-Desktop-IDE](#Install-UIFlow-Desktop-IDE)
|
||||
|
||||
2. [configuration](#configuration)
|
||||
|
||||
3. [Example](#Example)
|
||||
|
||||
4. [Additional features](#Additional-features)
|
||||
|
||||
|
||||
|
||||
## Insrall UIFlow-Desktop-IDE
|
||||
|
||||
>Click **UIFlow-Desktop-IDE** for your operating system below to download.
|
||||
|
||||
<div class="link">
|
||||
<h4><span>UIFlow Desktop IDE:</span></h4>
|
||||
<p>
|
||||
<a href="https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/software/UIFlow-Desktop-IDE.zip" target="_blank" rel="noopener noreferrer"><img src="https://cdn.shopify.com/s/files/1/0056/7689/2250/files/windows_89cc6ea0-2a3c-4327-97e5-8f51f448c38b_icon.png?v=1557026574" alt="">Windows</a>
|
||||
<a href="https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/software/UIFlow-Desktop-IDE_MacOS.zip" target="_blank" rel="noopener noreferrer"><img src="https://cdn.shopify.com/s/files/1/0056/7689/2250/files/mac_large.png?v=1557026570" alt="">MacOS</a>
|
||||
<a href="https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/software/UIFlow-Desktop-IDE_Linux.zip" target="_blank" rel="noopener noreferrer"><img src="https://cdn.shopify.com/s/files/1/0056/7689/2250/files/linux_icon.png?v=1557026584" alt="">Linux</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
## configuration
|
||||
|
||||
>Unzip the downloaded UIFlow Desktop IDE archive and double-click to execute the application..
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_01.jpg">
|
||||
|
||||
?>After the software is started, it will automatically detect whether your computer has a USB driver (CP210X) installed, click Install, and follow the prompts to install it.
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_02.png">
|
||||
|
||||
>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.
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_03.png">
|
||||
|
||||
!>Using the UIFlow Desktop IDE requires the M5 device to carry the UIFlow firmware and enter the **USB mode**.
|
||||
|
||||
>Click the power button on the left side of the device to restart. After entering the menu, select Setup quickly to enter the configuration page and select**USB mode**.
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_04.png">
|
||||
|
||||
>Select the corresponding port, and connect to the programming device, click OK.
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_05.jpg">
|
||||
|
||||
!>If you are using m5stickc, please follow the instructions below
|
||||
|
||||
>Press and hold the power key on the left side of the fuselage for 2 seconds to start the machine. After the uiflow logo appears, quickly click the home key (center M5 key) to enter the configuration page. Press the button on the right side of the fuselage to switch the option to setting, and press home to confirm. Press the right key to switch to USB mode, press home key to confirm, enter USB programming mode, select the corresponding COM port and device in IDE, and click Connect.
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_00.jpg">
|
||||
|
||||
|
||||
## Example
|
||||
|
||||
>After the connection is completed, you can start programming. Drag and drop the block in the block list on the left to the programming area. After editing the program, click the Run button in the upper right corner to execute the program..
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_06.jpg">
|
||||
|
||||
## Additional features
|
||||
|
||||
!>In addition to being a powerful program editor, UIFlow Desktop IDE also integrates **USB driver** installation, **M5Burner** burning tool and other functions, no need to download other software, one-stop solution programming environment Deployment requirements.
|
||||
|
||||
>In the upper menu bar of the IDE, you can find the corresponding additional functions, click to open the use, about the use of M5Burner, please refer to our other document for details. ["Upgrade Firmware"](zh_CN/related_documents/M5Burner).
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_07.jpg">
|
||||
|
||||
<style>
|
||||
|
||||
.link a{
|
||||
|
||||
padding-left: 13%;
|
||||
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@@ -9,6 +9,7 @@
|
||||
|
||||
4. [安装串口驱动](#安装串口驱动)
|
||||
|
||||
5. [ArduinoAPI](#ArduinoAPI)
|
||||
|
||||
## 安装Arduino-IDE
|
||||
|
||||
@@ -91,15 +92,89 @@
|
||||
|
||||
<img src="assets/img/related_documents/Arduino_IDE/CP210X_MAC.png">
|
||||
|
||||
<!-- ### For Linux
|
||||
|
||||
即将上线... -->
|
||||
## ArduinoAPI
|
||||
|
||||
<!--
|
||||
## 编译上传程序 -->
|
||||
### M5Core
|
||||
|
||||
|||
|
||||
|:---:|:---:|
|
||||
|**[System](zh_CN/api/system)** | **[喇叭](zh_CN/api/speaker)** |
|
||||
|**[LCD 屏](zh_CN/api/lcd)** | **[按键](zh_CN/api/button)** |
|
||||
|**[MPU9250](zh_CN/api/mpu9250)** | **[TF 卡](zh_CN/api/tf)** |
|
||||
|**[电源管理](zh_CN/api/power)** |**[I/O](zh_CN/api/gpio)** |
|
||||
|**[I2C](zh_CN/api/commutil)** |**[EEPROM](zh_CN/api/eeprom)**|
|
||||
|**[WIFI](zh_CN/api/wifi)**|
|
||||
|
||||
<!-- <table>
|
||||
<tr>
|
||||
<th align="center"><a href="#/zh_CN/api/system">System</a></th>
|
||||
<th align="center"><a href="#/zh_CN/api/speaker">喇叭</a></th>
|
||||
<th align="center"><a href="#/zh_CN/api/speaker">LCD 屏幕</a></th>
|
||||
<th align="center"><a href="#/zh_CN/api/speaker">按键</a></th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th align="center"><a href="#/zh_CN/api/system">Power</a></th>
|
||||
<th align="center"><a href="#/zh_CN/api/speaker">TF 卡</a></th>
|
||||
<th align="center"><a href="#/zh_CN/api/speaker">姿态传感器 (MPU9250)</a></th>
|
||||
<th align="center"><a href="#/zh_CN/api/speaker"> </a></th>
|
||||
</tr>
|
||||
</table> -->
|
||||
|
||||
### M5StickC
|
||||
|
||||
<!-- |||
|
||||
|:---:|:---:|
|
||||
|**[System](zh_CN/api/system)** | **[喇叭](zh_CN/api/speaker)** |
|
||||
|**[LCD 屏](zh_CN/api/lcd)** | **[按键](zh_CN/api/button)** |
|
||||
|**[MPU9250](zh_CN/api/mpu9250)** | **[TF 卡](zh_CN/api/tf)** |
|
||||
|**[Power](zh_CN/api/power)** | -->
|
||||
|
||||
|||
|
||||
|:---:|:---:|
|
||||
|**[System](zh_CN/api/system_m5stickc)** | **[AXP192](zh_CN/api/axp192_m5stickc)** |
|
||||
|**[TFT 屏](zh_CN/api/lcd_m5stickc)** | **[SH200Q](zh_CN/api/sh200q_m5stickc)** |
|
||||
|**[RTC](zh_CN/api/rtc)**|
|
||||
|
||||
<!-- |**[麦克风](zh_CN/api/spm1423_m5stickc)** | **[LED](zh_CN/api/led_m5stickc)** |
|
||||
|
||||
|**[按键](zh_CN/api/buttom_m5stickc)** | **[红外发射](zh_CN/api/led_m5stickc)** | -->
|
||||
|
||||
|
||||
|
||||
<!-- <div class="table-wrapper">
|
||||
<table class="fl-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Header 1</th>
|
||||
<th>Header 2</th>
|
||||
<th>Header 3</th>
|
||||
<th>Header 4</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>Content</td>
|
||||
<td>Content</td>
|
||||
<td>Content</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>Content</td>
|
||||
<td>Content</td>
|
||||
<td>Content</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>Content</td>
|
||||
<td>Content</td>
|
||||
<td>Content</td>
|
||||
</tr>
|
||||
<tbody>
|
||||
</table>
|
||||
</div> -->
|
||||
|
||||
|
||||
<style>
|
||||
|
||||
|
||||
@@ -212,3 +212,101 @@ _____________________________
|
||||
><img src="/image/Program_structure/Timer_user.gif" width="50%">
|
||||
|
||||
|
||||
# UIFlow Desktop IDE 部署{docsify-ignore-all}
|
||||
|
||||
<!-- ### 1. 打开Arduino IDE，然后点击`Sketch`->`Include Library`->`Manage Libraries...`
|
||||
|
||||
### 2. 在搜索框输入`M5Stack`，并搜索
|
||||
|
||||
<figure class="thumbnails">
|
||||
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/mac/macOS_install_m5stack_lib.png" alt="Screenshot of coverpage" title="Cover page">
|
||||
</figure>
|
||||
|
||||
### 3. 如果显示如下，则点击`Update`.
|
||||
|
||||
**但是如果显示`Install`，这意味着您之前还没安装M5Stack库，所以点击`Install`进行安装。**
|
||||
|
||||
<figure class="thumbnails">
|
||||
<img src="assets/img/getting_started_pics/m5stack_core/get_started_with_arduino_m5core/mac/macOS_search_m5stack.png" alt="Screenshot of coverpage" title="Cover page">
|
||||
</figure> -->
|
||||
|
||||
|
||||
1. [安装UIFlow-Desktop-IDE](#安装UIFlow-Desktop-IDE)
|
||||
|
||||
2. [基本配置](#基本配置)
|
||||
|
||||
3. [使用案例](#使用案例)
|
||||
|
||||
4. [附加功能](#附加功能)
|
||||
|
||||
|
||||
|
||||
## 安装UIFlow-Desktop-IDE
|
||||
|
||||
>点击下方对应自己操作系统的 **UIFlow-Desktop-IDE** 进行下载.
|
||||
|
||||
<div class="link">
|
||||
<h4><span>UIFlow Desktop IDE:</span></h4>
|
||||
<p>
|
||||
<a href="https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/software/UIFlow-Desktop-IDE.zip" target="_blank" rel="noopener noreferrer"><img src="https://cdn.shopify.com/s/files/1/0056/7689/2250/files/windows_89cc6ea0-2a3c-4327-97e5-8f51f448c38b_icon.png?v=1557026574" alt="">Windows</a>
|
||||
<a href="https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/software/UIFlow-Desktop-IDE_MacOS.zip" target="_blank" rel="noopener noreferrer"><img src="https://cdn.shopify.com/s/files/1/0056/7689/2250/files/mac_large.png?v=1557026570" alt="">MacOS</a>
|
||||
<a href="https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/software/UIFlow-Desktop-IDE_Linux.zip" target="_blank" rel="noopener noreferrer"><img src="https://cdn.shopify.com/s/files/1/0056/7689/2250/files/linux_icon.png?v=1557026584" alt="">Linux</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
## 基本配置
|
||||
|
||||
>将下载好的UIFlow Desktop IDE压缩包解压，双击执行应用程序.
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_01.jpg">
|
||||
|
||||
?>软件启动后，将自动检测你的电脑是否安装有USB驱动（CP210X），点击Install，根据提示，进行安装.
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_02.png">
|
||||
|
||||
>驱动安装完成后，将自动进入UIFlow Desktop IDE并自动弹出配置框，此时将M5设备通过Tpye-C数据线连接至电脑.
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_03.png">
|
||||
|
||||
!>使用UIFlow Desktop IDE需要M5设备搭载UIFlow固件且进入**USB编程模式**.
|
||||
|
||||
>单击设备左侧电源键重启，进入菜单后快速选择Setup，进入配置页面，选择**USB mode**.
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_04.png">
|
||||
|
||||
>选择好对应的端口，与编程设备，点击OK进行连接.
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_05.jpg">
|
||||
|
||||
!>如果你使用的是M5StickC请按以下说明操作
|
||||
|
||||
>长按机身左侧的电源键2秒进行开机，在出现UIFlow Logo后，快速单击Home键（中心M5按键），进入配罝页面。按机身右侧按键将选项切换至Setting，按下Home键确认。按右侧按键切换选项至USB mode,
|
||||
按下Home键确认，进入USB编程模式.在IDE中选择相应的COM口与设备，点击连接。
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_00.jpg">
|
||||
|
||||
|
||||
## 使用案例
|
||||
|
||||
>完成连接后，就可以开始编程创作了，拖拽左侧的程序块列表中的程序块到编程区域，完成程序编辑后点击右上角的运行按钮，执行程序.
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_06.jpg">
|
||||
|
||||
## 附加功能
|
||||
|
||||
!>UIFlow Desktop IDE除了是一个强大的程序编辑器以外，它同时还集成了**USB驱动**安装、**M5Burner**烧录工具等功能，无需另外下载其他的软件，一站式解决编程环境的部署需求.
|
||||
|
||||
>在IDE的上方菜单栏，能够找到对应的附加功能，点击即可打开使用，关于M5Burner的使用方式，详情可以参考我们的另一篇文档 ["烧录固件"](zh_CN/related_documents/M5Burner).
|
||||
|
||||
<img src="assets/img/related_documents/UIFlow_Desktop_IDE/Desktop_IDE_07.jpg">
|
||||
|
||||
<style>
|
||||
|
||||
.link a{
|
||||
|
||||
padding-left: 13%;
|
||||
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user