Conversation
| series: ["slint-no-std"] | ||
| series_order: 1 | ||
| showAuthor: false | ||
| --- |
There was a problem hiding this comment.
It should be nice to add the summary on each assignment.
georgik
force-pushed
the
workshop/slint
branch
from
5d1a7ff to
1b5ffc1
Compare
|
Update: Planned update in 2025-11. Please keep open |
georgik
force-pushed
the
workshop/slint
branch
from
1b5ffc1 to
c9501ef
Compare
|
@SergioGasquez You can find here the preview of the workshop. |
|
🎉 A preview for this PR is available at: https://preview-developer.espressif.com/pr495/ |
| ```sh | ||
| curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh | ||
| ``` | ||
|
|
There was a problem hiding this comment.
I would add "restart your shell" otherwise it's not in path and the following command fails.
| - **[M5Stack CoreS3](https://shop.m5stack.com/products/m5stack-cores3-esp32s3-lotdevelopment-kit)** (recommended - touchscreen, speakers, microphone) | ||
| - [ESoPe Board SLD_C_W_S3 with Schukat Smartwin display-concept](https://esope.de) (RGB interface) | ||
| - Alternative boards: [ESP32-S3-BOX-3](https://github.com/espressif/esp-bsp/tree/master/bsp/esp32_s3_box_3), [ESP32-S3-LCD-EV-Board](https://github.com/espressif/esp-bsp/tree/master/bsp/esp32_s3_lcd_ev_board) | ||
| - USB-C cable for M5Stack CoreS3 and ESP32-S3-BOX-3, or USB micro cable with [ESP-Prog](https://docs.espressif.com/projects/esp-iot-solution/en/latest/hw-reference/ESP-Prog_guide.html) for ESoPe board |
There was a problem hiding this comment.
| - **[M5Stack CoreS3](https://shop.m5stack.com/products/m5stack-cores3-esp32s3-lotdevelopment-kit)** (recommended - touchscreen, speakers, microphone) | |
| - [ESoPe Board SLD_C_W_S3 with Schukat Smartwin display-concept](https://esope.de) (RGB interface) | |
| - Alternative boards: [ESP32-S3-BOX-3](https://github.com/espressif/esp-bsp/tree/master/bsp/esp32_s3_box_3), [ESP32-S3-LCD-EV-Board](https://github.com/espressif/esp-bsp/tree/master/bsp/esp32_s3_lcd_ev_board) | |
| - USB-C cable for M5Stack CoreS3 and ESP32-S3-BOX-3, or USB micro cable with [ESP-Prog](https://docs.espressif.com/projects/esp-iot-solution/en/latest/hw-reference/ESP-Prog_guide.html) for ESoPe board | |
| One the following boards: | |
| - **[M5Stack CoreS3](https://shop.m5stack.com/products/m5stack-cores3-esp32s3-lotdevelopment-kit)** (recommended - touchscreen, speakers, microphone) | |
| - [ESoPe Board SLD_C_W_S3 with Schukat Smartwin display-concept](https://esope.de) (RGB interface) | |
| - Alternative boards: [ESP32-S3-BOX-3](https://github.com/espressif/esp-bsp/tree/master/bsp/esp32_s3_box_3), [ESP32-S3-LCD-EV-Board](https://github.com/espressif/esp-bsp/tree/master/bsp/esp32_s3_lcd_ev_board) | |
| - USB-C cable for M5Stack CoreS3 and ESP32-S3-BOX-3, or USB micro cable with [ESP-Prog](https://docs.espressif.com/projects/esp-iot-solution/en/latest/hw-reference/ESP-Prog_guide.html) for ESoPe board |
|
|
||
| ⚠️ Do **not** use the `--std` flag — we are developing in `no_std`. | ||
|
|
There was a problem hiding this comment.
| ⚠️ Do **not** use the `--std` flag — we are developing in `no_std`. | |
| {{< alert >}} | |
| Do **not** use the `--std` flag — we are developing in `no_std`. | |
| {{< /alert >}} |
| #### Temporary (for current shell) | ||
|
|
||
| ```sh | ||
| . $HOME/export-esp.sh | ||
| ``` | ||
|
|
||
| #### Persistent (recommended) | ||
|
|
||
| Append the export file to your shell configuration (e.g. `.bashrc`, `.zshrc`): | ||
|
|
||
| ```sh | ||
| cat $HOME/export-esp.sh >> ~/.bashrc | ||
| ``` | ||
|
|
||
| Then: | ||
|
|
||
| ```sh | ||
| source ~/.bashrc | ||
| ``` | ||
|
|
||
| On **Windows**, this is done automatically. | ||
|
|
There was a problem hiding this comment.
Not really sure about that, but maybe tabs work better here.
| #### Temporary (for current shell) | |
| ```sh | |
| . $HOME/export-esp.sh | |
| ``` | |
| #### Persistent (recommended) | |
| Append the export file to your shell configuration (e.g. `.bashrc`, `.zshrc`): | |
| ```sh | |
| cat $HOME/export-esp.sh >> ~/.bashrc | |
| ``` | |
| Then: | |
| ```sh | |
| source ~/.bashrc | |
| ``` | |
| On **Windows**, this is done automatically. | |
| {{< tabs groupId="installation" >}} | |
| {{% tab name="Termporary" %}} | |
| ```sh | |
| . $HOME/export-esp.sh | |
| ``` | |
| {{% /tab %}} | |
| {{% tab name="Persistent" %}} | |
| Append the export file to your shell configuration (e.g. `.bashrc`, `.zshrc`): | |
| ```sh | |
| cat $HOME/export-esp.sh >> ~/.bashrc | |
| ``` | |
| Then: | |
| ```sh | |
| source ~/.bashrc | |
| ``` | |
| On **Windows**, this is done automatically. | |
| ... | |
| {{% /tab %}} | |
| {{< /tabs >}} | |
| --- | ||
|
|
||
| ## Development Approach: `no_std` vs `std` | ||
|
|
||
| ### `no_std` Approach | ||
|
|
||
| **This workshop uses the `no_std` approach by default.** The setup above is perfect for `no_std` development. | ||
|
|
||
| **Project Directory Structure:** | ||
| ``` | ||
| esp32/no_std/ | ||
| ├── m5stack-cores3/ # M5Stack CoreS3 implementation | ||
| ├── esope-sld-c-w-s3/ # ESoPe board implementation | ||
| ├── esp32-s3-box-3/ # ESP32-S3-BOX-3 implementation | ||
| └── esp32-s3-lcd-ev-board/ # LCD-EV board implementation | ||
| ``` | ||
|
|
||
| ### `std` Approach | ||
|
|
||
| **If you specifically need ESP-IDF/std features**, you can also set up for `std` development: | ||
|
|
||
| ```sh | ||
| # For std development, install with --std flag | ||
| espup install --std | ||
| ``` | ||
|
|
||
| **Project Directory Structure:** | ||
| ``` | ||
| esp32/std/ | ||
| ├── m5stack-cores3/ # M5Stack CoreS3 std implementation | ||
| ├── esope-sld-c-w-s3/ # ESoPe board std implementation | ||
| ├── esp32-s3-box-3/ # ESP32-S3-BOX-3 std implementation | ||
| └── esp32-s3-lcd-ev-board/ # LCD-EV board std implementation | ||
| ``` | ||
|
|
||
| **Note:** `std` approach requires additional ESP-IDF setup and is more complex. **We recommend starting with `no_std`** for this workshop. | ||
|
|
||
| --- | ||
|
|
||
| ### Next Step | ||
|
|
||
| Now that your environment is ready, let’s run our first Slint GUI app on the desktop. |
There was a problem hiding this comment.
Since the workshop is about no-std, I would avoid giving the discussion about std here again. I'd include it in the upper level _index (where it's already mentioned) or skip it altogether.
FBEZ
left a comment
FBEZ
left a comment
There was a problem hiding this comment.
Some comments about assignment 2 and assignment 3
| # Dev version | ||
| git clone https://github.com/georgik/slint-esp-workshop.git |
There was a problem hiding this comment.
I'm not sure why we should download this repo too. Maybe explain it in a sentence before the command.
|
|
||
| The GUI is defined in `.slint` files under the `ui/` directory. Here's a brief overview: | ||
|
|
||
| - `appwindow.slint`: the top-level window layout |
There was a problem hiding this comment.
I see a mainwindow.slint. But I'm using the repo Wilston0reo since it was labelled "workshop version" above.
|
|
||
| --- | ||
|
|
||
| ## About `.slint` Files |
There was a problem hiding this comment.
I don't know how you'll structure the workshop, but I'm not sure about dropping these explanations here. They seem a bit terse and out of place.
Consider putting theseinformation (+ the dev no-dev difference etc) in a separate place/file like "explanations" or "Introduction to Slint with rust"
| ## Supported Boards | ||
|
|
||
| This workshop supports the following boards: | ||
|
|
||
| - **M5Stack CoreS3** (recommended - touchscreen, speakers, microphone) | ||
| - **ESoPe Board (SLD_C_W_S3)** with RGB interface display (Schukat Smartwin concept) | ||
| - **ESP32-S3-BOX-3** | ||
| - **ESP32-S3-LCD-EV-Board** |
There was a problem hiding this comment.
This info was already given in the _index.md. I'd suggest to put a link on that section like
Connect one of the suggested bards. In this workshop we will use the M5Stack CoreS3
|
|
||
| ### 1. Connect Your Board | ||
|
|
||
| Plug in your ESP32-S3-based board via USB. If you're using the **ESoPe board**, ensure your ESP-Prog programmer is connected to both UART lines. |
There was a problem hiding this comment.
To avoid mixing instructions for all the boards, I'd suggest to put it into a separate info box. This way we don't mix instructions for all the boards.
| Plug in your ESP32-S3-based board via USB. If you're using the **ESoPe board**, ensure your ESP-Prog programmer is connected to both UART lines. | |
| Plug in your ESP32-S3-based board via USB. | |
| {{< alert icon="circle-info" cardColor="#b3e0f2" iconColor="#04a5e5">}} | |
| If you're using the **ESoPe board**, ensure your ESP-Prog programmer is connected to both UART lines. | |
| {{< /alert >}} |
| #### `std` Path (Alternative) | ||
|
|
||
| If you specifically need ESP-IDF features, navigate to the `std` directory: | ||
|
|
||
| ```bash | ||
| # For M5Stack CoreS3 | ||
| cd slint-esp-workshop/esp32/std/m5stack-cores3 | ||
|
|
||
| # For ESP32-S3-BOX-3 | ||
| cd slint-esp-workshop/esp32/std/esp32-s3-box-3 | ||
|
|
||
| # Other boards available in std/ directory | ||
| ``` | ||
|
|
There was a problem hiding this comment.
In the _index it's stated that the workshop will focus on no_std. I find it confusing to try to explain all the approaches at once. I would recommend to just focus on no_std and avoid all other mentions to std.
If you think it's important to give both options then maybe the best way is to use tabs to avoid mixing both approaches in the same workflow.
Here an example of tabs
{{< tabs groupId="devtool" >}}
{{% tab name="VS Code extension" %}}
If you’re using a simple text editor and the CLI commands, you can follow the instruction on the get-started guide (linux/mac-os | windows ).
{{% /tab %}}
{{% tab name="CLI" %}}
Open VSCode, press CTRL+SHIFT+P and start typing ESP-IDF: New Project.
...
{{% /tab %}}
{{< /tabs >}}
|
|
||
| #### `no_std` Path (Recommended) ✅ | ||
|
|
||
| Navigate to the `no_std` directory for your specific board: |
There was a problem hiding this comment.
The folder in the cloned repo is called esp32-no_std
| --- | ||
|
|
||
| ## Entering Bootloader Mode | ||
|
|
||
| In order to flash the board, it must be in **bootloader mode**. If you encounter issues flashing, use the following guide: | ||
|
|
||
| ### Built-in USB UART Boards | ||
|
|
||
| For boards with built-in USB-to-serial (e.g. S3-BOX-3 or LCD-Ev-Board): | ||
|
|
||
| 1. Press and **hold** the **BOOT** button | ||
| 2. While holding BOOT, **press and release** the **RESET** button | ||
| 3. **Release BOOT** | ||
|
|
||
| This sequence ensures the chip enters bootloader mode. | ||
|
|
||
| ### ESoPe with ESP-Prog | ||
|
|
||
| If you're using an external ESP-Prog programmer, bootloader mode is usually handled automatically. However, **after flashing is complete**, you will need to press **RESET** manually to start the application. | ||
|
|
||
| --- |
There was a problem hiding this comment.
Using the recommended board I didn't need to press the boot button.
If you want to support all the boards at once, consider putting this info in a tab.
| If your display remains blank: | ||
| - Double-check display connections and power supply | ||
| - Ensure `espflash` selected the correct port | ||
| - Use verbose logging `cargo run --release -v` to debug |
There was a problem hiding this comment.
| If your display remains blank: | |
| - Double-check display connections and power supply | |
| - Ensure `espflash` selected the correct port | |
| - Use verbose logging `cargo run --release -v` to debug | |
| {{< alert iconColor="#df8e1d" cardColor="#edcea3">}} | |
| If your display remains blank: | |
| - Double-check display connections and power supply | |
| - Ensure `espflash` selected the correct port | |
| - Use verbose logging `cargo run --release -v` to debug | |
| {{< /alert >}} |
FBEZ
left a comment
FBEZ
left a comment
There was a problem hiding this comment.
At this assignment I got stuck. I am not sure how to use std::process:Command" nor I have a viewmodel.rs`.
| - On **Linux**: `nmcli -t -f SSID dev wifi` | ||
| - On **Windows**: `netsh wlan show networks mode=bssid` | ||
|
|
||
| Your Rust application can invoke these commands using `std::process::Command`. |
|
|
||
| ## Step 2: Populate the Model | ||
|
|
||
| Update your `viewmodel.rs` to use a `ModelRc<WifiNetwork>` and expose it to the Slint UI. |
There was a problem hiding this comment.
I don't see any viewmodel.rs in the repo.
|
@georgik I got stuck at assignment 4. Please take a look at these two steps highlighted in the last comments. |
|
@georgik did you get the chance to review the comments? Before I forgot, if you’re considering a version 2 of the workshop, here are a few general suggestions:
|
3 participants
Add workshop about Slint UI with Rust no_std for ESP32-S3.