So, in today's post, we are gonna have a look at How to create a GUI in MATLAB so that we could also give a user friendly front end to our algorithms. MATLAB GUI has an extensive database with a lot of functionalities, which I can't cover in one post but atleast today, I will make you able to create a simple GUI and will also explain How to control buttons and edit/text boxes etc. After performing this tutorial, you will be able to try GUI on your own.
So, today we will create a simple project in which we will create a simple GUI as shown in below image. The functionality of this GUI will be that when you click on this START button then the text,you have written in the white edit box will appear at the text box above, as shown in figure below. Let's get started with the implementation of this GUI. Follow the steps carefully and ask in comments if you got into any trouble.
You can download this GUI by clicking on the below button, but first read the tutorial completely aand try to pratice it by yourself,don''t just download the run the applicationas it won't give you any help.
[dt_button size="medium" animation="none" icon="" icon_align="left" color="" link="www.theengineeringprojects.com/Examples/HowtoCreateaGUIinMATLAB.rar" target_blank="true"]Download Simple GUI Project in MATLAB[/dt_button]
How to Create a GUI in MATLAB ?
- First of all, when you will open your MATLAB software then, the first window opened will look like as shown in the image below.This is the simple workspace of MATLAB, now in order to open theGUI toolbar, you have to write "guide" in the workspace as I did below:
- After writing the "guide" in command window, hit ENTER and a new small window will open up as shown in the below image, from here we will start creating our GUI.
- As you can see in this small window, there are two tabs, one tab is named as Create New GUI, which has the options for creating your GUI for the first time while the second tab is named as Open Existing GUI, which is used for opening the already designed GUIs and as we haven't designed any GUI yet so we will remain in the first tab and will select blank GUI from the list and hit Enter.
- Then press "OK" button and as you will complete the action, a new window will immediately open and it will look like as shown in the image given below:
- This is the place where we are gonna create our GUI. The left side toolbar is showing the controls which we will drag aand drop in the main window and will design our GUI.
- Let's first have a look at the left side toolbar controls. On the top left side of the bar, the first button is to select 'cursor' . Below curser button we have icon of 'Push Button'. Next to that we have 'side scroll bar'. Then comes 'Radio Button' and 'Check Box'. Then we have most important buttons which are 'Edit text bar' button and 'Static text bar' button. Below are also some other buttons and you can also explore them by simply clicking on them.
- Now we are going to make a very small and simple interface, in which we will first select a 'button' and then we will select 'Edit text bar' and 'static text bar' and we will make the arrangement in such a way that, when we will press the button then, data will move from Edit text box to Static text box.
- Now click on the 'button' icon and the next thing which will happen on the window will be like as shown in the image below:
- Now if you want to change the properties of the button, either you want to change its name or you want to change its setting then, simply double click the button and a new window will open, which will be as:
- As you can see in the above image that a new window has been opened and it has a large no of options.
- To change the name of push button, go to 'string' option and here you can change its name.
- In above image, you can clearly see that, i have replaced the name 'Push Button' by 'Start'.
- Now click on the Play icon in the top toolbar which is used to run the GUI. After doing that, a new window will open, which is shown in the below image:
- This new window in above figure is the back end programming of this GUI created automatically by MATLAB, here we are gonna add all the codes for our ontrols.
- Now we want to add a static text box and we will select it from tool bar manually.
- And if you again want to change its name then, we will double click on that. Go to slide option and and write whatever you want to write there.
- All this process is shown in the below image:
- Now i want to write our official site address, which is "www.TheEngineeringProjects.com" .
- And when i will press OK button then our GUI window will look like as shown in the below image:
- This time, I have not only changed the name of this text box but have also changed the font size and color that's why it is appearing now in light blue color and its font size has also increased. So, now you must have the idea that you can control all the properties and can make it literaly a new thing. The only thing stopping you is your imagination. :)
- In the same manner we will select edit text box.
- Now by doing all this, actually i want to write some data in Edit Text Box and when i will press Start button then, data will move from Edit Text Box to Static Text Box.
- To implement this logic we need to load a function code in 'Start' button. To load the code, right click on the Start button and a new window will open as shown in the image below:
- As shown in the above image when you will go to the 'view callbacks' option and a next window will open direct to it and then click on the 'call back' button.
- After that a new window will open which will be representing the code which has been uploaded in the 'Start' button.
- This window is shown in the below image:
- Now code has been uploaded and the very next window which will open, will be of 'Edit Text Box' .
- Here you can write anything which you want to Display in 'Static Text Box'.
- So in this window, i am writing my tutorials title, which is "How to create a GUI in MATLAB".
- It can be seen in the below image:
- When you will press Enter then, immediately an-other button will open which will be representing that our data has been moved to 'Static Text Box'.
- As you have seen that our Final Display is same. Which means we have moved data from Edit Text Box to Static Text Box.
- The code added in the button CallBack is as follows:
x = get(handles.edit1,'String'); %edit1 being Tag of ur edit box if isempty(x) fprintf('Error: Enter Text firstn'); else set(handles.text2,'String',x) end
- Have a look at this below video in which we have explained in detail How to Create a GUI in MATLAB: