320045 PSSP Class Notes

Supervision. Matlab GUI∗

Albert Masip-Àlvarez
[email protected]

This revision: May the 14th, 2021

Contents
1 Basic actions in GUIDE 2
1.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2
1.2 Basic concepts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2
1.3 Tag names and handles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
1.4 Setting up an image . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
1.5 Plotting on different axes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
1.6 Static and Edit texts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
1.7 Pop-up menus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
1.8 Share variables between objects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6
∗
Graphical User Interface

1
PSSP Class Notes. Matlab GUI and Mobile Robot Application Albert Masip-Àlvarez

1.8.1 Assigning a value to a workspace variable . . . . . . . . . . . . . . . . . . . . . 6

1.8.2 Picking a variable value from workspace . . . . . . . . . . . . . . . . . . . . . . 6
1.8.3 UserData property . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
1.9 Conditional visibility . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7

2 Laboratory work 8

1 Basic actions in GUIDE

1.1 Introduction
MATLAB GUIDE1 is an assistant tool for building Graphical User Interfaces (GUI) in the MATLAB
environment. When the user types guide in the command window it appears the following welcome
window:

Figure 1: Appearance of the starting GUIDE window

It is strongly recommended to start with a Blank GUI in order to follow the instruction set collected
in this document. An empty layout is shown to the user:

The upper left toolbar shows all the possible objects that can be used in a GUI; they should be dragged
into the window area in order to be properly configured and used after.

1.2 Basic concepts

Two files are strongly connected when a GUI is created: The roles for these files are so different:

• *.gui contains the GUI layout and what are their properties. In this file one can see/edit/define
where are the elements placed and what are their properties, such as their size, colour, font letter
and the like.

• *.m contains the actions (callbacks) to be performed by every element in the GUI which the
user interacts with.

Both files have the same name; only its extension is different. To be precise, the user creates the *.gui
file while the *.m file is created automatically by the Matlab software itself: the *.gui file includes, by
default, the basic information to create and initialise the GUI for the Matlab command interpreter.
1
GUIDE stands for Graphical User Interface Development Environment

2
Albert Masip-Àlvarez PSSP Class Notes. Matlab GUI and Mobile Robot Application

Figure 2: Empty layout for a new GUIDE window

Figure 3: Two files (*.m and *.gui) connected with the GUI

1.3 Tag names and handles

Every object within the GUI has a tag name. You can refer to any element by using this name
and the handles object. Handles is the word that refers to all the attributes (fields) of an object in
the GUIDE environment. It is a MATLAB structure that should be used when referring to different
objects within the same GUI. Consider an object with a tag name called StaticText1. You can
change the background colour of this object by doing this command:
set(handles.StaticText1,’BackgroundColor’,’green’)
anywhere in the *.m file.
Notice that ’green’, ’red’, ’yellow’ and the like can be used as arguments for the colour property but
you can also use the RGB form without quotes: [1 1 1] for white, [1 0 0] for red, and the like.

1.4 Setting up an image

It is so interesting to put an image on the GUI. It can be done by means of an axes covering the whole
area or a part of it.
The default tag name of the first created axes is axes1. The tag of the axes can be changed into a
new name. It can be done by means of double clicking with the left button of the mouse and changing
the Tag field in the Property inspector.
Once the axis are placed, sized and properly named, it can be configured the image file to be shown.
A picture can be shown at some specific axes object by the commands list shown in figure 4. This
code portion must be placed within the action (Callback) of any element in the GUI.

3
PSSP Class Notes. Matlab GUI and Mobile Robot Application Albert Masip-Àlvarez

Figure 4: Two axes objects and the code to show a picture on axes2

1.5 Plotting on different axes

Consider that a plot (tagged axes2) is placed on the layout and intended to plot some signals named
U, Y over time with a sample time of 0.1 seconds; the use of handles will be necessary for this aim.

plot(handles.axes2,[1:length(U)].*0.1,U)
hold on
plot(handles.axes2,[1:length(Y)].*0.1,Y,’r’)
Focus on the plot instruction: instead of the most commonly known use plot(t, y), the function
is called with a preceding input argument referring to the plot where to draw: handles.axes2.
Alternatively, it can be used the form:

axes(handles.axes2);
plot([1:length(U)].*0.1,U)
hold on
plot([1:length(Y)].*0.1,Y,’r’)
as shown in the previous section.

1.6 Static and Edit texts

Static texts are aimed to inform the user but Edit texts are used to get some data or information
provided by the user.
The instruction set in order to get the contents of an Edit text is the following:

NewStrVal = get(hObject, ’String’);

NewVal = str2double(NewStrVal);
The first instruction gets the string that the user has introduced while the second one changes the
type into a numeric format.

1.7 Pop-up menus

Pop-up menus are good for user choices. Here you are an example on how to choose a specific path
planning algorithm: Notice that the string property states the number of choices to be shown by the
menu when clicked; the more the text rows the more the user choices. The first text row is the text
to be shown by default at the beggining, when no click is applied yet.

4
Albert Masip-Àlvarez PSSP Class Notes. Matlab GUI and Mobile Robot Application

Figure 5: String property for the pop-up menu element

Figure 6: Appearance of the example pop-up menu when clicked

It is easy to get the user choice (and/or the contents of the user choice). Matlab show how to get
access to the choice when clicked by means of a comment line. We can put this into practice; when
typed (notice that there are not semicolons at the end of these commands, so results will be shown
on the command line):

Figure 7: Different commands to get access to the user choice

5
PSSP Class Notes. Matlab GUI and Mobile Robot Application Albert Masip-Àlvarez

The results for these three commands are shown in the command line when the Dijkstra method
is chosen:

Figure 8: Different results when the Dijkstra method is chosen

Notice that the contents variable returns a list of all string choices within a cell array. Then you can
get the specific string of the user choice when accessing the specific position of the cell array. Finally,
you can get the choice number, which is 2 because number 1 is the default text in the pop-up menu
(regardless it is the first algorithm listed).

1.8 Share variables between objects

The base workspace is the Matlab workspace we are familiar to work with. Variables are assigned,
by default, in this workspace when the command line is used or a batch file is run. Matlab functions
have their own workspaces. As you may know, those variables used within a specific function cannot
be addressed (accessed, modified) by other functions unless their values are passed by input/output
arguments. A rude way to override this drawback is to use global variables within functions but it is
strongly unrecommended because of the lose of control on variable access.
When working with GUIDE the user has two choices:

• Use the workspace as the interchange environment to allocate variables

• Use the UserData property for all those elements involved in the actions in the GUI

Let’s put some examples:

1.8.1 Assigning a value to a workspace variable

The instruction assignin(’base’,’SimulationTime’,NewVal) assigns the value NewVal to a vari-
able called SimulationTime in the base workspace.

1.8.2 Picking a variable value from workspace

The instruction evalin(’base’,’SimulationTime’) evals the expression SimulationTime (sup-
posed to be a numeric variable or the name of a batch file) in the base workspace.

6
Albert Masip-Àlvarez PSSP Class Notes. Matlab GUI and Mobile Robot Application

1.8.3 UserData property

The choice for the algorithm at the pop-up menu is stored at the field Choice within the UserData
property of the element. This value can be accessed anytime, anywhere in the code. Notice the ’-1’
applied to get the ’real’ choice number (1-Greedy,2-Dijkstra,3-A*):

Figure 9: Choice is stored in the UserData property of the popup menu

Giving the Choice field for the handles.popupmenu1.UserData property lets space for other
variables to be stored, when needed.
As an example, a push button is used to get access to the user Choice stored in the popupmenu1
UserData property and, consequently, write this choice number into a static text with tagname text1
at the right of the figure:

Figure 10: Choice item is pushed to the static text

1.9 Conditional visibility

An element (or a group of elements) in a GUI can be shown/hidden to the user by means of the
instruction set when referring to the Visible property:
set(handles.edit1,’Visible’,’off’);
In the instruction before, the Edit button tagged edit1 is set not to be visible.
This strategy is also useful to make progressively visible the different sections of a GUI along the steps
of user actions.

7
PSSP Class Notes. Matlab GUI and Mobile Robot Application Albert Masip-Àlvarez

2 Laboratory work
You are asked to build a GUI by using the GUIDE toolbox in Matlab. The appearance of the GUI
must be as follows:

Figure 11: Appearance of the GUI

Its performance will be thoroughly explained during the laboratory session.