Skip to content

Commit 21cc3d4

Browse files
Added skeleton
1 parent df20c12 commit 21cc3d4

File tree

1 file changed

+60
-0
lines changed
  • content/hardware/10.mega/shields/giga-display-shield/tutorials/13.appwizard-guide

1 file changed

+60
-0
lines changed
Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
---
2+
title: GIGA Display Shield app wizard Guide
3+
description: 'Learn how to use Seggers App Wizard with the GIGA Display Shield.'
4+
author: Benjamin Dannegård
5+
tags: [Display, appwizard, segger, GUI]
6+
---
7+
8+
## Introduction
9+
10+
Segger's app wizard is a graphical framework for building powerful UIs, and is fully compatible with the GIGA Display Shield. It allows you to build UIs, using pre-made widgets like buttons, images, loading bars, sliders, checkboxes, etc. It also allows you to fully customize the screenspace on the display. In this guide, we will go through some of the different components, so you can learn how to best implement it in your projects.
11+
12+
![Appwizard full demo running on the GIGA Display Shield](assets/)
13+
14+
## Hardware & Software Needed
15+
16+
- [Arduino GIGA R1 WiFi](https://store.arduino.cc/products/giga-r1-wifi)
17+
- [Arduino GIGA Display Shield](https://store.arduino.cc/products/giga-display-shield)
18+
- [Arduino IDE](https://www.arduino.cc/en/software)
19+
- [App Wizard](https://www.segger.com/products/user-interface/emwin/tools/appwizard/)
20+
- [emWin Arduino Library](https://github.com/SEGGERMicro/emWin-Arduino-Library/)
21+
22+
## Downloading the Library and Core
23+
24+
The GIGA R1 core includes the [Arduino_H7_Video](https://github.com/arduino/ArduinoCore-mbed/tree/main/libraries/Arduino_H7_Video) library that handles the display.
25+
26+
In this guide, we will be using three different libraries:
27+
- [Arduino_H7_Video](https://github.com/arduino/ArduinoCore-mbed/tree/main/libraries/Arduino_H7_Video), this one is bundled with the core, so make sure you have the latest version of the [Mbed core](https://github.com/arduino/ArduinoCore-mbed) installed.
28+
- [Arduino_GigaDisplayTouch](https://www.arduino.cc/reference/en/libraries/arduino_gigadisplaytouch/), handles touch on the GIGA Display Shield
29+
- [emWin Arduino Library](https://github.com/SEGGERMicro/emWin-Arduino-Library/)
30+
31+
To install this, open the library manager and install the latest version by searching for **"Arduino_GigaDisplayTouch"**.
32+
33+
## Creating an App Wizard project
34+
35+
First go to **File -> New Project** to start your new project. Here we need to configure certain settings so it will work on the GIGA Display Shield. Set the display size x to **480** and display size y to **800**. Then we need to disable the **Enable simulation** and **Generate loop in MainTask()** options. It should look like the image below.
36+
37+
![Create project settings]()
38+
39+
## Adding elements to the project
40+
41+
### Button
42+
43+
### Slider
44+
45+
### Gauge
46+
47+
## Exporting the project
48+
49+
##
50+
51+
## Conclusion
52+
53+
This guide went through the building blocks of the different components that can be implemented with emWin. To see these examples in a full running example sketch go to **File > Examples > Arduino_H7_Video > emWinDemo**.
54+
55+
![Example in the IDE](assets/example-in-ide.png)
56+
57+
This demo sketch will show the different components using a screen manager in a 2x2 grid.
58+
59+
## Next Step
60+
emWin is a comprehensive library and GUI framework that has a lot of customizability, if you are interested in playing around more with it, you can find many different examples and widgets on the official website for [Segger® emWin](https://wiki.segger.com/Main_Page). The code on the website can easily be adapted into a sketch for the GIGA Display Shield.

0 commit comments

Comments
 (0)