Lesson 14.1. UI Flow. Hello update v. 0.7.0

Dimi

The purpose of this lesson

Hi! Today we will get acquainted with the new version of UI Flow - meet 0.7.0. The new version adds support for interesting things, such as Units, RGB, also fixed some bugs and changed the loader (which is used when setting up a Wi-Fi connection).

This lesson will teach: prepare the device to work with M5 UI Flow version 0.7.0; flashing built-in RGB LED panels in the programming language Blockly.

Short help

List of components for the lesson

PC;
M5STACK;
-USB-C cable from standard set.

Let's start!

Step 1

In the previous lesson, we learned how to use UI Flow. Therefore, consider the steps that are different from the steps in the previous lesson. First of all, download the latest version from our website: Download section on our website and download M5Burner-for-windows (Fig. 1).
Click here to go to the website http://m5stack.com.

Figure 1. Download section on M5STACK website

Step 2, 3

See the previous lesson for these steps.

Step 4

First of all, you need to completely clean the memory of the device. Specify the COM port to which M5 is connected; then specify the port speed 921600; also select the most recent stable version of M5 UI Flow, then press Erase (Fig. 2).

Figure 2.Clear the device memory

After the device memory is successfully cleared (as evidenced by the message Hard reseting via RTS pin...) you can safely upload new version: press Burn waiting for messages Leaving... Standing in bootloader. (Fig. 2.1).

Step 5, 6

See the previous lesson for these steps.

Step 7

When the device beeps, press and hold the third button (button C) on the device, then the settings menu will be opened - select Change WIFI Connect and press the second button (button B) (Fig. 3).

Figure 3.

Step 8, 9, 10, 11

See the previous lesson for these steps.

Step 12

After the device successfully connects to the Internet, an access code (Api key) and a QR code will appear on the screen (Fig. 4).

Please note: in the upper right corner there is an indicator of the connection to the server (very convenient, in my opinion).

Figure 4

Step 13

See the previous lesson for this step.

Step 14

Let's collect a simple sketch and blink led panels (Fig. 5). MicroPython Code in the language is given below:

from m5stack import *
from m5ui import *
import units
clear_bg(0x111111)
pir0 = units.PIR(units.PORTB)

while True:
  rgb.set_dir("right", 0x33cc00)
  wait(0.2)
  rgb.set_all(0x000000)
  rgb.set_dir("left", 0xff9900)
  wait(0.2)
  rgb.set_all(0x000000)
  rgb.set_dir("right", 0x000099)
  wait(0.2)
  rgb.set_all(0x000000)
  rgb.set_dir("left", 0xcc0000)
  wait(0.2)
  rgb.set_all(0x000000)

Figure 5

Test and run step

Great! Led panel light flashing (Fig. 6), so we did the right thing.

Figure 6. Hurray! Got :)

See. video demonstration of the work in the section Downloads. This lesson is not yet completed, there is something to note.

Notice

When you reload a new sketch, you may encounter this error (Fig. 7).

Figure 7. Error Upload code failed, maybe your device is offline check it and retry

To fix it-just reboot your device and wait for the green light in the upper right corner of the device screen, then try downloading the sketch again by clicking on the arrow in the browser where the UI Flow is open.

Downloads

M5Burner-for-windows-v0.0.9 (Yandex Disk): https://yadi.sk/d/G7yE4ny_N9QQzg
Video demonstration (YouTube): https://youtu.be/T49988i1W1o