How to create a dropdown menu in MATLAB

In this article, we will learn about the dropDown menu component, how to create it and what are its important properties. Then we will create a simple Matlab Gui application.

Creating a dropdown menu in MATLAB

A Dropdown menu is a UI component that helps users to select one of the given options or type as text. Matlab provides a function named uidropdown to create an instance of the dropdown menu.

The three ways one can create a dropdown menu is as follows:

• dropdownObject = uidropdown; (without any parameters)
• dropdownObject = uidropdown(parent);
• dropdownObject = uidropdown(parent, NameOfProperty, Value …);

Properties

Some important properties of this UI component are as follows:

• Items: The options available in the drop-down menu are set using this property.
• Value: The value that is currently selected by the component is accessed or changed.
• Text: The text property is used to control the content of the label. The default value is ‘Label’.
• Interpreter: This property allows us to interpret the text of the label using a different interpreter. Like we can use latex code for writing equations or HTML for formatting as text and set the interpreter to be ‘latex’ or ‘HTML’. Default is ‘none.
• HorizontalAlignment: Controls the horizontal alignment of the text within the label component. Default is ‘left’.
• VerticalAlignment: Controls the vertical alignment within the component. Default is ‘center’.
• Wordwrap: Wraps the text to fit the component’s width. Default is ‘off.
• FontName: changes the font for the text.
• FontSize: controls the font size.
• Font-weight: controls the weight/boldness of the text.
• FontAngle: controls the font angle.
• Font color: the color of the font.
• BackgroundColor: change the background color of the label.
• Visible: This property controls the visibility of the component. Default is ‘on’.
• Enable: Enable or Disabled appearance. Default is ‘on’.
• TootTip: A text to guide the purpose of the component. Default is ”.
• Position: A 4 valued list that controls the location of the component within the parent window and the size of the component.

Let’s see some examples demonstrating the use of syntaxes.

uidropdown()

This function does not require any parameter but as every component must be inside a parent window, Matlab creates a figure and assigns the component to it.

Example:

Matlab

% MATLAB code for uidropdown()
% create a uidropdown object using the api
dropdownObject = uidropdown;

Output:

A drop-down menu

by default, the component holds the items as ‘option 1’, ‘option 2’, and so on.

uidropdown(parent)

The method uidropdown also accepts an optional parent window to hold the component.

Example:

Matlab

% MATLAB code for uidropdown(parent)
% create a figure window
fig = uifigure;

% create a drop down menu and pass the fig as parent
dropdownObject = uidropdown(fig);

Output:

A drop-down component using a custom window as parent

uidropdown(parent, NameOfProperty, Value …)

 Matlab also provides us with the option to set the properties of the drop-down menu while instantiation by passing the property name and its value.

Example:

Matlab

% MATLAB code for uidropdown(parent, NameOfProperty, Value ...)
% create a figure window
fig = uifigure;

% create a drop down menu and pass the fig as
% parent as well as set the properties.
dropdownObject = uidropdown(fig, 'Items', {'Mango','Guava','Orange','Apple'},
'Value', 'Apple');

Output:

A drop-down menu with custom options

In the method uidropdown, the ‘Items’ property is set which is all the options that the component will display. The ‘value’ property describes the option that will be selected by default.

Now we create an application in which selecting an option from the drop-down menu will be displayed in a Label with bigger fonts.

Example:

Matlab

% MATLAB code for create a figure
fig = uifigure('Position', [100 100 300 275]);

% create a label
label = uilabel(fig, 'Position', [100 120, 120 40],...
'FontSize', 30,...
'FontWeight', 'bold');

% create a dropdownObject and pass the figure as parent
dropdownObject = uidropdown(fig,...
'Items', {'Mango','Guava','Orange','Apple'},...
'Value', 'Apple',...
'Editable', 'on',...
'Position', [84 204 100 20],...
'ValueChangedFcn', @(dd, event) fruitSelected(dd, label));

% function to call when option is selected (callback)
function fruitSelected(dd, label)

% read the value from the dropdown
val = dd.Value;

% set the text property of label
label.Text = val;
end

Output:

A drop-down menu with font property

We first create a figure to hold all the UI components and set its Position property that controls its position as well as its size. Then a label is created with a font size of 30 and font-weight set to bold. We create a dropdown menu and sets its properties like editable which enables users to enter a value instead of choosing an option. The ‘ValueChangedFcn’ property sets the function callback that will be called once the value of the drop-down menu changes.