Ensemble Graphics Toolkit: Dialog

Last modified by Microchip on 2024/01/08 16:55

Introduction

In this training topic, you will learn how to construct a Dialog class and handle dialog button events. A dialog is a widget that allows a user to decide before they can proceed further.

Steps:

  • Dialog

Prerequisites

You have prepared the Host PC with all the development software tools and Ensemble Graphics Toolkit source code as explained in:

You have installed and prepared the Eclipse IDE for C/C++ Developers as explained in:

You have performed the exercises in the topic:

Dialog

In this section, you will modify and build the event.cpp source code that you entered in the training topic Ensemble Graphics Toolkit: Events to construct a Dialog class and handle the dialog button events.

​In this training topic, you will use EgtProject and the settings you entered in the training topic: Ensemble Graphics Toolkit: Events.

Modify the event.cpp source code by adding the following lines of code:

#include <egt/ui>
#include
<iostream>
using namespace std;
using namespace egt;

int main(int argc, const char ** argv)
{
  Application app;
  TopWindow window;
  Button button(window, "Press Me");
  center(button);

 //dialog widget
 Dialog dia(Rect(20, 70, 300, 200));
  dia.title(Image("icon:microchip_logo_black.png;64"), "Button Status");

 auto text = make_shared <TextBox>("You pressed the button!");
  text->readonly(true);

  dia.widget(expand(text));
  window.add(dia);

 //event handling
 button.on_event([ & ](Event & event)
  {
     if (event.id() == EventId::pointer_click)
      {
          dia.show();
          cout << "clicked!" << endl;
      }
  });

  window.show();
 return app.run();
}

Back to Top


Save your program by selecting File > Save. You may also with the command CTRL+S.

To build the project, hover over EgtProject, right-click, and select Build Project from the menu. Or you can click on the Build icon.

The Console window (bottom pane) will display the build progress.


Click on the Run button.

Observe the WVGA Display on the target:

The event.cpp executable is running remotely on the target.

Observe the Press Me button in the center of the WVGA Display. When you click on the button, you will see a dialog box with “Button Status” displayed on the display.

EGT Display: Button Status

Dialog class

From ~/egt/docs/html/annotated.html, click on the Dialog class. All the functions, attributes, and constructors associated with the class are documented here.

A dialog is a widget that allows users to decide before they can proceed further. A dialog does not fill the screen.

Back to Top


To stop the program, press the Stop button (upper left hand, just below the menu bar).

​Before you start another session, be sure to Stop the current session.

Back to Top

Summary

In this training topic, you learned how to construct a Dialog class and handle dialog button events.

What’s Next?

There’s plenty more to learn. Here are some additional Ensemble Graphics Toolkit training resources to help you gain more knowledge and skills:

Back to Top