Creating GUI Button in MATLAB App
In MATLAB we have a designer tool for designing interactive GUIs to plot multiple data. GUI provides a convenient way of interacting with real-time calculations and graphs. This article covers some simple steps of designing a GUI button. Further, we will try to add two numbers which are input from the user using that GUI button.
Follow the mentioned steps to create a GUI button.
Step 1: Open the MATLAB program and navigate to the MATLAB App Designer tool.
Step 2: The app designer start page will open in a new window. Here selects a blank page for designing the GUI button.
Step 3: The following window of App designer will open in MATLAB. Here we can drag and drop different components.
Step 4: Now to create a GUI button select the button from the components window and drag it to the Design window.
Step 5: To enable the button function using a callback function, follow these steps:
- Right-click on the button.
- Choose Callbacks from the options.
- Select Add ButtonPushedFcn callback.
This will add the necessary callback function to enable the button functionality.
Step 6: The previous step will add the important code for the functioning of the GUI button. To access the code, select the code view window.
The following code will be executed whenever a button is pressed. We can also modify the code and can perform different actions whenever the button is pressed.
Step 7: Now we will try to add two numbers using the same GUI button. First, drag and drop three numerical fields in the MATLAB design window. Rename the numerical field, as here we have given the name Num1, Num2, and Sum.
After adding these numerical fields, an additional code line will be added to our code. To access the code, open the code view window.
Step 8: Now add the ADDButtonPushed callback on the addition GUI button.
Step 9: After adding the callback to Add button. A new function will be created inside the code view. Now copy and paste the following given code inside that function.
This code takes the input from two numerical fields and stores it inside the variable. After that it will add both numbers and the result will be stored inside variable c. The variable c is connected to the Sum field to display the output.
a = app.Num1EditField.Value;
% Taking input from num field 2
b = app.Num2EditField.Value;
% Calculating Sum
c = a+b;
% Displaying Output
app.SumEditField.Value = c;
Step 10: Now click the Run button.
Step 11: A new GUI window will be open. Here type any two numbers inside the field and press the ADD button to calculate the sum of both these numbers. The output will be displayed inside the Sum field.
Conclusion
MATLAB’s App Designer tool makes it easy to create GUIs where users can interact with programs using buttons, sliders, and text fields. This article covers how one can create a basic GUI button and use it to add two user input numbers.
