GUI in MATLAB step by step complete designing & Programming
Table of Contents
GUI in MATLAB:
GUI in MATLAB- I have already uploaded some very basic Matlab tutorials for beginners which cover,
how to install the Matlab software.
Matlab basic commands and how to use them.
Conditional statements in Matlab Programming.
For Loop in Matlab with Example codes
While Loop in Matlab with Example Codes
Scripts and functions in Matlab with Example Codes
How to generate Matrix and Vectors in Matlab
Strings in Matlab, its types and uses
After covering the very basics, now it’s time to start something which you will find very interesting. Today’s tutorial and all of my previous Matlab articles will help you in designing complex GUI applications for Arduino, Raspberry Pi, etc. In my upcoming next three tutorials, I will explain how to interface Arduino with Matlab using Matlab support packages, How to design a GUI in Matlab to control an LED using Arduino, and how to make GUI in Matlab to control the direction and speed of a DC Motor. As usual before attempting something complex first I will start with the very basics so that you can easily understand each and every step.
In this tutorial, we are going to learn how to make a very basic GUI in MATLAB, we will be making a calculator to perform basic calculation arithmetic operations by using MATLAB GUI. Now open the MATLAB software and in command write guide and press enter.
You can also open it from by clicking on new and in new click on the App.
Now app designer startup page will open and click on the blank app.
A new window will pop up it will take a little bit of time. Then you will get this screen just maximize this now you can select push buttons, sliders, radio buttons, etc.
Now to use the component you need to select the component and place it.
Designing Calculator using Matlab GUI:
Now I will create a small basic GUI that can perform arithmetic operations like addition, subtraction, multiplication, and division and clear button that will clear the screen. First of all, we will need a panel in which we will place the inputs.
Now right click on the panel and click on the properties inspector.
You will see the properties of the panel. Now in the title I will give input if you don’t want any then you can leave it by blank only then to increase the length font size. You can also change the background color or you can change the font color.
Now I will choose another panel in which four kinds of operation will be performed which are addition, subtraction, multiplication, and division. Change the name of the panel to operation.
Then I will insert output panel and repeat the same process.
Now I need a toggle button just click it and place it in the operation section. Now give the title to the button in our case we will perform addition through this button so I give it “+” by renaming the string to + and now in the tag section write add.
Now I will just copy this toggle button for another operation like subtraction, multiplication, and division. In the identifier section give the tag for each button like sub for subtraction, mul for multiplication, and div for the division.
Now we will add the title name for which we will select the static text and give the title simple calculator.
Now we need to edit text so to insert it we will select the edit field text and insert it in the input panel and in the tag write in1.
Similarly we will add another text field for another input and in the tag give name in2.
Now we will add one more panel for clear purpose then we will add toggle button and I will give it title as clear.
Now I want to add on output for which I will insert the text field and in the tag write the output. The string should be blank space please keep in mind.
Now you can drag and drop anything and you can decrease the length also but once you run this you cannot change anything this window will disappear only. Now when we will click on the run button it will ask to save the file and click on yes and save the GUI.
The calculator section will appear and it will generate the code automatically generated in editor window. You can enter the values in the field but you cannot get output because there is no program written, we will need to write Matlab script to perform different arithmetic operations.
So you need to write code it will be automatically generated in the editor
This is the area you need to write here don’t delete anything and in percentage symbol these are the comments these are the hints you need to read and write don’t worry a bit for operative program. There will be different functions for each button in the code.
Clear button in matlab GUI:
Now first of all we will write the code for the clear function
|
1 2 3 4 5 6 7 8 9 |
function clear_Callback(hObject, eventdata, handles) % hObject handle to clear (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Hint: get(hObject,'Value') returns toggle state of clear set(handles.in1,'string',''); set(handles.in2,'string',''); set(handles.output,'string',''); |
By writing this function when we will click the clear button all the text from the text fields will clear.
ADD button in matlab GUI:
|
1 2 3 4 5 6 7 8 9 10 |
function togglebutton1_Callback(hObject, eventdata, handles) % hObject handle to togglebutton1 (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Hint: get(hObject,'Value') returns toggle state of togglebutton1 a=str2double(get(handles.in1,'string','')); b=str2double(get(handles.in1,'string','')); add = a+b; set(handles.output,'string',num2str(c)); |
By clicking the + button it will add the two values.
Subtract function in Matlab:
The subtract function will be similar to the addition function the only difference will be that we will change the + sign to -.
|
1 2 3 4 |
a=str2double(get(handles.in1,'string','')); b=str2double(get(handles.in1,'string','')); add = a+b; set(handles.output,'string',num2str(c)); |
Multiplication function in Matlab:
|
1 2 3 4 5 6 7 8 9 10 |
function mul_Callback(hObject, eventdata, handles) % hObject handle to mul (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Hint: get(hObject,'Value') returns toggle state of mul a=str2double(get(handles.in1,'string','')); b=str2double(get(handles.in1,'string','')); add = a*b; set(handles.output,'string',num2str(c)); |
Division function in Matlab:
|
1 2 3 4 5 6 7 8 9 10 11 |
unction div_Callback(hObject, eventdata, handles) % hObject handle to div (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Hint: get(hObject,'Value') returns toggle state of div a=str2double(get(handles.in1,'string','')); b=str2double(get(handles.in1,'string','')); add = a/b; set(handles.output,'string',num2str(c)); |
Now if we want to test the program we will click on the run and gives the input values in the text box and if we want to add the two numbers we will click on the addition and the two numbers will be added.
Complete code of GUI in Matlab:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 |
function varargout = simple_calculator(varargin) % SIMPLE_CALCULATOR MATLAB code for simple_calculator.fig % SIMPLE_CALCULATOR, by itself, creates a new SIMPLE_CALCULATOR or raises the existing % singleton*. % % H = SIMPLE_CALCULATOR returns the handle to a new SIMPLE_CALCULATOR or the handle to % the existing singleton*. % % SIMPLE_CALCULATOR('CALLBACK',hObject,eventData,handles,...) calls the local % function named CALLBACK in SIMPLE_CALCULATOR.M with the given input arguments. % % SIMPLE_CALCULATOR('Property','Value',...) creates a new SIMPLE_CALCULATOR or raises the % existing singleton*. Starting from the left, property value pairs are % applied to the GUI before simple_calculator_OpeningFcn gets called. An % unrecognized property name or invalid value makes property application % stop. All inputs are passed to simple_calculator_OpeningFcn via varargin. % % *See GUI Options on GUIDE's Tools menu. Choose "GUI allows only one % instance to run (singleton)". % % See also: GUIDE, GUIDATA, GUIHANDLES % Edit the above text to modify the response to help simple_calculator % Last Modified by GUIDE v2.5 10-Jun-2021 15:46:50 % Begin initialization code - DO NOT EDIT gui_Singleton = 1; gui_State = struct('gui_Name', mfilename, ... 'gui_Singleton', gui_Singleton, ... 'gui_OpeningFcn', @simple_calculator_OpeningFcn, ... 'gui_OutputFcn', @simple_calculator_OutputFcn, ... 'gui_LayoutFcn', [] , ... 'gui_Callback', []); if nargin && ischar(varargin{1}) gui_State.gui_Callback = str2func(varargin{1}); end if nargout [varargout{1:nargout}] = gui_mainfcn(gui_State, varargin{:}); else gui_mainfcn(gui_State, varargin{:}); end % End initialization code - DO NOT EDIT % --- Executes just before simple_calculator is made visible. function simple_calculator_OpeningFcn(hObject, eventdata, handles, varargin) % This function has no out args, see OutputFcn. % hObject handle to figure % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % varargin command line arguments to simple_calculator (see VARARGIN) % Choose default command line out for simple_calculator handles.out = hObject; % Update handles structure guidata(hObject, handles); % UIWAIT makes simple_calculator wait for user response (see UIRESUME) % uiwait(handles.figure1); % --- Outputs from this function are returned to the command line. function varargout = simple_calculator_OutputFcn(hObject, eventdata, handles) % varargout cell array for returning out args (see VARARGOUT); % hObject handle to figure % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Get default command line out from handles structure varargout{1} = handles.out; % --- Executes on button press in clear. function clear_Callback(hObject, eventdata, handles) % hObject handle to clear (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Hint: get(hObject,'Value') returns toggle state of clear set(handles.in1,'string',''); set(handles.in2,'string',''); set(handles.out,'string',''); function out_Callback(hObject, eventdata, handles) % hObject handle to out (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Hints: get(hObject,'String') returns contents of out as text % str2double(get(hObject,'String')) returns contents of out as a double % --- Executes during object creation, after setting all properties. function out_CreateFcn(hObject, eventdata, handles) % hObject handle to out (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles empty - handles not created until after all CreateFcns called % Hint: edit controls usually have a white background on Windows. % See ISPC and COMPUTER. if ispc && isequal(get(hObject,'BackgroundColor'), get(0,'defaultUicontrolBackgroundColor')) set(hObject,'BackgroundColor','white'); end % --- Executes on button press in add. function add_Callback(hObject, eventdata, handles) % hObject handle to add (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Hint: get(hObject,'Value') returns toggle state of add a=str2double(get(handles.in1,'string')); b=str2double(get(handles.in2,'string')); c=a+b; set(handles.out,'string',num2str(c)); % --- Executes on button press in sub. % --- Executes on button press in mul. function mul_Callback(hObject, eventdata, handles) % hObject handle to mul (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Hint: get(hObject,'Value') returns toggle state of mul a=str2double(get(handles.in1,'string')); b=str2double(get(handles.in2,'string')); c = a*b; set(handles.out,'string',num2str(c)); % --- Executes on button press in div. function div_Callback(hObject, eventdata, handles) % hObject handle to div (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Hint: get(hObject,'Value') returns toggle state of div a=str2double(get(handles.in1,'string')); b=str2double(get(handles.in2,'string')); c = a/b; set(handles.out,'string',num2str(c)); function in1_Callback(hObject, eventdata, handles) % hObject handle to in1 (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Hints: get(hObject,'String') returns contents of in1 as text % str2double(get(hObject,'String')) returns contents of in1 as a double % --- Executes during object creation, after setting all properties. function in1_CreateFcn(hObject, eventdata, handles) % hObject handle to in1 (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles empty - handles not created until after all CreateFcns called % Hint: edit controls usually have a white background on Windows. % See ISPC and COMPUTER. if ispc && isequal(get(hObject,'BackgroundColor'), get(0,'defaultUicontrolBackgroundColor')) set(hObject,'BackgroundColor','white'); end function in2_Callback(hObject, eventdata, handles) % hObject handle to in2 (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Hints: get(hObject,'String') returns contents of in2 as text % str2double(get(hObject,'String')) returns contents of in2 as a double % --- Executes during object creation, after setting all properties. function in2_CreateFcn(hObject, eventdata, handles) % hObject handle to in2 (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles empty - handles not created until after all CreateFcns called % Hint: edit controls usually have a white background on Windows. % See ISPC and COMPUTER. if ispc && isequal(get(hObject,'BackgroundColor'), get(0,'defaultUicontrolBackgroundColor')) set(hObject,'BackgroundColor','white'); end |