GUI-in-Scilab/C2/Creating-a-basic-GUI-using-Scilab/English
Title of the script: Creating a basic GUI using Scilab
Author: Rashmi Patankar, Shwethaa R
Visual Cue | Narration |
---|---|
Show Slide:
Title Slide |
Welcome to the Spoken Tutorial on “Creating a basic GUI using Scilab”. |
Show Slide:
Learning objectives |
In this tutorial, we will learn:
|
Show Slide: System requirement |
To record this tutorial, I am using
The process demonstrated in this tutorial is similar in Linux OS. Annotations are added to the tutorial if there are any differences. |
Show Slide:
Pre-requisites |
|
Show Slide:
Code Files |
|
Show Slide:
What is a Graphical User Interface? |
The Graphical User Interface(GUI) is:
|
Show Slide:
What is a Graphical User Interface? |
|
Show Slide:
What is a pushbutton? |
A pushbutton is a rectangular button used to run a callback. |
Show Slide:
What is a callback? |
A callback is a function that executes a set of commands. This happens in response to a predefined user action. For example,
|
On the Scilab console, type editor and press Enter. |
Open the Scilab console. Type editor and press Enter. |
On Scinotes Window, highlight Scinotes on title bar. Click on File>>Open. |
It opens the Scinotes window. Click on File on the menubar and then on Open. |
On Open Window, go to Downloads folder >> Click on basicgui.sce file >> Click Open.
|
Go to the Downloads folder. Locate the file basicgui.sce and click on it. Click on the Open button at the bottom. |
On Scinotes Window, hover cursor over basicgui.sce in the title bar. |
It opens the file basicgui.sce in Scinotes window. Now we’ll look at the code. |
Cursor on SciNotes Window, highlight figure(). |
Let's start by creating a graphic window. The graphic window is a window on which we place the objects to create a GUI. For creating that, the figure function is used. |
Cursor on SciNotes Window, highlight the word f. |
‘f’ is the handle of the graphic window. It is used to change the properties of the graphic window after it is created. |
Cursor on Scinotes Window, highlight the line with f.visible. |
We then use handle ‘f' to set the visible property of a graphic window to “ON”. Hence, the pushbutton becomes visible on a graphic window after it is created. |
Cursor on Scinotes Window, highlight the word uicontrol. |
The uicontrol function is used to create a pushbutton in a graphic window. It sets the property of a pushbutton. |
Cursor on Scinotes Window, highlight the word h1. |
‘h1’ is the handle of the pushbutton. The handle is used to change the properties of a pushbutton after it is created. It is also used while writing a callback function. |
Cursor on Scinotes Window, highlight f inside uicontrol parentheses. |
Notice that ‘f’ is passed as a first argument within the uicontrol function. So the pushbutton we make will appear in the graphic window whose handle is 'f'. |
Cursor on Scinotes Window, highlight style and pushbutton. |
The object style is set to pushbutton. |
Cursor on Scinotes Window, highlight the word Position and numbers inside square brackets. |
Position and size of a pushbutton is defined within square brackets. |
Cursor on Scinotes Window, highlight number 250. |
250 units is the margin from the left side of the window. |
Cursor on Scinotes Window, highlight number 200. |
200 units is the margin from the bottom side of the window. |
Cursor on Scinotes Window, highlight number 100. |
100 units is the width of the pushbutton. |
Cursor on Scinotes Window, highlight number 50. |
50 units is the height of the pushbutton. |
Cursor on Scinotes Window, highlight string and Print. |
The string denotes the text that appears on top of a pushbutton. As we can see, it is set to Print. |
Cursor on Scinotes Window, highlight callback and callback_print(h1). |
Let us set the callback property to call the function callback_print(h1). |
Cursor on Scinotes Window, hover over style, position, string and callback. |
Notice the arguments style, position, string and callback. They are basically the property names. |
Cursor on Scinotes Window, hover cursor over pushbutton, square bracket, Print and callback_print(h1). |
Notice the arguments - pushbutton, square bracket, Print and callback_print(h1). They represent the respective property values. |
Cursor on Scinotes Window, highlight the three dots. Highlight the lines inside uicontrol parentheses. |
There are three dots after 'f' and property values. They are used to split the multiple arguments onto separate lines. The arguments within the parenthesis can also be written on a single line. |
Cursor on Scinotes Window, highlight callback_print(h1) function definition. highlight h1 within parentheses |
Let us look at the definition of callback_print(h1) function. Notice that we have passed h1 as an argument to this function. |
Cursor on Scinotes Window, highlight the line disp(“Hello World”). |
You can see that this function contains only one command. This will display the message “Hello World” in the Scilab console. The message will be displayed only after we press the pushbutton. |
Press Ctrl+S simultaneously. | Save the file by pressing Control and ‘S’ keys simultaneously. |
In Scinotes Window, click on Execute menu, File with echo. |
To run the file, click on the Execute menu first. Then click on File with echo from the drop-down menu. |
In Graphic Window number 0, highlight the Graphic Window number 0 on the title bar. Hover cursor over Print pushbutton. click on Print. |
A window named Graphic Window number 0 opens. A pushbutton named Print appears. Click on Print. |
Switch to Scilab Console. highlight the message “Hello World” on Scilab console. |
Switch to the Scilab console to view the output. The console shows the message “Hello World”. You can see that we got the desired result when we pressed the pushbutton. |
This brings us to the end of this tutorial.
Let us summarize. | |
Show Slide: Summary |
In this tutorial, we have learnt:
|
Show Slide: Assignment |
As an assignment, please do the following. Add one more pushbutton to the current GUI as described below,
|
Show Slide: Assignment |
Hint: The name of the function must be different. |
Show Slide: About Spoken Tutorial Project |
The video at the following link summarises the Spoken Tutorial project. Please download and watch it. |
Show Slide: Spoken Tutorial Workshops |
We conduct workshops using Spoken Tutorials and give certificates. Please contact us. |
Show Slide: Answers for THIS Spoken Tutorial |
Please post your timed queries in this forum. |
Show Slide: FOSSEE Forum | Please post your general and technical queries on Scilab in this forum. |
Show Slide: Textbook Companion project |
The FOSSEE team coordinates the TBC project. For more details, please visit this site. |
Show Slide: Lab Migration |
The FOSSEE team coordinates the Lab Migration project. For more details, please visit this site. |
Show Slide: Acknowledgements |
The Spoken Tutorial project is funded by the Ministry of Education, Government of India. |
Show slide: Thank you |
The script has been created by FOSSEE Team and FOSSEE intern Shwethaa. The video for this tutorial was created by me Anandajith, I am a FOSSEE intern signing off. Thanks for watching. |