Programming a GUI Hanan sedaghat pisheh. For calling GUI, we need a function with no inputs or outputs First We create a m.file m file has the same name.

Slides:



Advertisements
Similar presentations
Congratulations! You have just installed the Presentation Game Add-In.
Advertisements

DEVELOPING ICT SKILLS PART -TWO
Microsoft Office XP Microsoft Excel
Computer and Communication Fundamental Basic web programming Lecture 8 Rina Zviel-Girshin.
What is a Dialog box? A Dialog box is a window or “form” that contains other child windows or “controls” that have a specific appearances and pre-defined.
GUI Testing. High level System Testing Test only those scenarios and outputs that are observable by the user Event-driven Interactive Two parts to test.
XP Tutorial 4 New Perspectives on Microsoft Windows XP 1 Microsoft Windows XP Personalizing Your Windows Environment Tutorial 4.
Introduction to Excel 2007 Part 2: Bar Graphs and Histograms February 5, 2008.
A graphical user interface (GUI) is a pictorial interface to a program. A good GUI can make programs easier to use by providing them with a consistent.
Lec 16 Chapter 10 Oct 25, 10 completion of recursion examples HW # 4, problem 3 Chapter 10, user interface design examples.
Chapter 13: Advanced GUIs and Graphics J ava P rogramming: From Problem Analysis to Program Design, From Problem Analysis to Program Design, Second Edition.
Chapter 4: Working with Windows Types of Windows –Program Windows –Message Boxes –Dialog Boxes Elements of a Window –Window Panes –Scroll Bars –Menus –Tool.
SPSS Statistical Package for the Social Sciences is a statistical analysis and data management software package. SPSS can take data from almost any type.
Fundamentals of Programming in Visual Basic 3.1 Visual basic Objects Visual Basic programs display a Windows style screen (called a form) with boxes into.
Introduction to Excel 2007 Part 3: Bar Graphs and Histograms Psych 209.
Chapter 9 Introduction to ActionScript 3.0. Chapter 9 Lessons 1.Understand ActionScript Work with instances of movie clip symbols 3.Use code snippets.
8 Copyright © 2004, Oracle. All rights reserved. Creating LOVs and Editors.
Hello World In C++ and Microsoft Visual C++. Directions to begin a project 1. Go to All Programs 2. Open Visual Studio C++ 3. Click on New Project 4.
1 Forms A form is the usual way that information is gotten from a browser to a server –HTML has tags to create a collection of objects that implement this.
Introduction to Graphical User Interfaces. Objectives * Students should understand what a procedural program is. * Students should understand what an.
European Computer Driving Licence Syllabus version 5.0 Module 4 – Spreadsheets Chapter 22 – Functions Pass ECDL5 for Office 2007 Module 4 Spreadsheets.
Department of Mechanical Engineering, LSUSession VII MATLAB Tutorials Session VIII Graphical User Interface using MATLAB Rajeev Madazhy
A short intermission about function handles and cell arrays A MATLAB function may be referenced by a handle. >> sphere(100)
Introduction to the Graphical User Interface (GUI) in MATLAB
Matlab GUIs GUIDE.
Introduction to Visual Basic. Quick Links Windows Application Programming Event-Driven Application Becoming familiar with VB Control Objects Saving and.
Introduction to Matlab & Data Analysis
T U T O R I A L  2009 Pearson Education, Inc. All rights reserved Typing Application Introducing Keyboard Events, Menus, Dialogs and the Dictionary.
Java Software Solutions Lewis and Loftus Chapter 10 1 Copyright 1997 by John Lewis and William Loftus. All rights reserved. Graphical User Interfaces --
Java Programming: From Problem Analysis to Program Design, 4e Chapter 12 Advanced GUIs and Graphics.
Chapter 3: Using GUI Objects and the Visual Studio IDE.
Designing Interface Components. Components Navigation components - the user uses these components to give instructions. Input – Components that are used.
GUI development with Matlab: GUI Front Panel Components 1 GUI front panel components In this section, we will look at -GUI front panel components -Programming.
GUI Widgets Jeff Offutt SWE 432 Design and Implementation of Software for the Web.
 Whether using paper forms or forms on the web, forms are used for gathering information. User enter information into designated areas, or fields. Forms.
Introduction to Matlab’s Graphical User Interface (GUI) Type “guide” “Guide” creates interface on a Figure window and code in an M-file. Some hidden code.
Computational Methods of Scientific Programming Lecturers Thomas A Herring, Room , Chris Hill, Room ,
Introduction to MATLAB Damon Tomlin February 22, 2008 Lecture 3: Data Visualization & User Interfaces.
Chapter 5 Quick Links Slide 2 Performance Objectives Understanding Framesets and Frames Creating Framesets and Frames Selecting Framesets and Frames Using.
WS09-1 VND101, Workshop 09 MSC.visualNastran 4D Exercise Workbook Belted Cylinder.
Creating Graphical User Interfaces (GUI’s) with MATLAB By Jeffrey A. Webb OSU Gateway Coalition Member.
1 Creating Windows GUIs with Visual Studio. 2 Creating the Project New Project Visual C++ Projects Windows Forms Application Give the Project a Name and.
Introduction to Matlab & Data Analysis 2015 In this tutorial we will: Build a practical application using GUIDE Learn more about graphical user interface.
Copyright © Curt Hill More Components Varying the input of Dev-C++ Windows Programs.
Visual Basic Programming Introduction VB is one of the High level language VB has evolved from the BASIC language. BASIC stands for Beginners All-purpose.
Copyright © 2007 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Chapter 6 – Graphical User Interfaces Java Foundations: Introduction to Programming.
GUI development with Matlab: GUI Front Panel Components GUI development with Matlab: Other GUI Components 1 Other GUI components In this section, we will.
Lec 16 Chapter 10 Nov 2, 11 Chapter 10, user interface design examples.
CMPF114 Computer Literacy Chapter 3 The Visual Basic Environment 1.
Basics of Windows 95/98/NT. Versions of Windows Windows 95 and 98 used mainly on standalone computers Windows NT used on networked computers (as in our.
EGR 115 Introduction to Computing for Engineers
One event handling and GUI programming. Graphical User Intefaces (GUIs) The standard window-and-mouse-based user interface is called a graphical user.
Chapter 2 More Controls Programming in C#. NET Objectives Use text boxes, group boxes, check boxes, radio buttons, and picture boxes effectively.
Introduction to Matlab Module #10 Page 1 Introduction to Matlab Module #10 – Creating Graphical User Interfaces Topics 1.Overview of GUI Development using.
COMPUTER PROGRAMMING I 3.01 Apply Controls Associated With Visual Studio Form.
Lecture (7) Introduction to GUI Eng. Osama Talaat 1.
MATLAB and SimulinkLecture 61 To days Outline Graphical User Interface (GUI) Exercise on this days topics.
Customizing Menus and Toolbars CHAPTER 12 Customizing Menus and Toolbars.
More Matlab Graphics and GUI Graphics subplots some useful commands 3D graphics GUI GUI controls The callback property Other essential properties.
COMPUTER PROGRAMMING I 3.01 Apply Controls Associated With Visual Studio Form.
 2002 Prentice Hall. All rights reserved. 1 Introduction to the Visual Studio.NET IDE Outline Introduction Visual Studio.NET Integrated Development Environment.
Microsoft Visual C# 2010 Fourth Edition Chapter 3 Using GUI Objects and the Visual Studio IDE.
Today We Will Review: Operating Systems (Windows) (week 3 & 4) Starting up MS Windows Desktop and its contents Functions of the desktop components Brain.
Here is a small example of the puzzle you will be completing today. You will start in the top left corner, and end at the bottom right using 3 different.
Graphical User Interface in MATLAB
3.01 Apply Controls Associated With Visual Studio Form
Chap 7. Building Java Graphical User Interfaces
More on Graphical User Interfaces
Graphical User Interfaces -- Introduction
Presentation transcript:

Programming a GUI Hanan sedaghat pisheh

For calling GUI, we need a function with no inputs or outputs First We create a m.file m file has the same name as the function

Creating the Function Make sure the function name is the same as the m file ’ s. No input and No output

You can use F5 or play buttton to run your rogram Write figure in your function and run it.

Setting Figure Properties Syntax for setting figure properties is: figure('PropertyName',propertyvalue, … )

Some Figure Properties ExamplePropertyValuePropertyName ‘ Example ’ string ‘ name ’ ‘ none ’ { ‘ figure ’ } ‘ MenuBar ’ ‘ on ’ { ‘ on ’ } ‘ off ’ ‘ NumberTitle ’ [0.5, 0.9, 0.7][R, G, B] ‘ color ’ ‘ inches ’ { ‘ pixels ’ } ‘ normalized ’ ‘ inches ’ ‘ centimeters ’ ‘ points ’ ‘ characters ’ ‘ units ’ [2, 3, 2, 1][x, y, w, l] ‘ position ’

Color vector value for [R, G, B], where each vector element takes a value in the range [0, 1]. Examples: [0, 1, 0] = GREEN [1, 1, 0] = YELLOW [1, 1, 1] = WHITE [ ] = GRAY [ ] = PURPLE

Position Takes the vector value [x, y, w, l] Each element is a value in the units specified by the figure property ‘ units ’ x- Distance from left side of the screen y- Distance from bottom side of the screen w- Width of figure (horizontally) l- Length of figure (vertically)

Units Safest bet is to use the property value ‘ normalized ’. With ‘ normalized ’ chosen, each element is relative to the screen and takes the value in the range of [0, 1]. [1, 1] [0, 0]

RANDOM FUNCTION Creates a random number in the range [0, 1]. Can be used in [R, G, B] vector or even [x, y, w, l] vector

UICONTROL Creates edit boxes, text boxes, pushbuttons, sliders, popup menus and more. Syntax: Uicontrol( ‘ propertyName ’,propertyvalue)

UICONTROL Property: ‘ Style ’ ‘ style ’ property specifies the UICONTROL type and can have one of the following as its value: 1-pushbutton7- slider 2- toggle button8- frame 3- radio button9-listbox 4-checkbox10- pop up menu 5-edit 6-text

UICONTROL Property: Position ‘ position ’ behaves similarly to the FIGURE property, only here the position is taken relative to the figure window. Likewise, ‘ units ’ is treated in the same vein. [0,0]

UICONTROL Properties ExplanationExamplePropertyVal ue PropertyNam e Writes string in UICONTROL ‘ Enter Number ’ string ‘ string ’ Font colour[0, 0, 0][R, G, B] ‘ foregroundcol or ’ UICONTROL colour [1, 1, 1][R, G, B] ‘ backgroundcol or ’ Sets UICONTROL to visible/invisible ‘ off ’ { ‘ on ’ } ‘ off ’ ‘ visible ’ Execute specified function on UICONTROL or function handle ‘ callback ’

Another uicontrol

We need to give handles for objects so we could reference them later. important Command Get and set command are going to use alot. Syntax: get(handle, ’ propertName ’ )

Examples

Imagine we want to use the color of figure for the color of the text background So we should get the color of the created figure (with handle “ f ” )

SET Command Gives pre-existing objects new values for properties. Syntax: set(handle, ’ propertyName ’,propertyvalue) Lets change background color of first text box from green to random.

What if we don’t want a dark background but we still want random one ? Remember: higher values brighter colors

ANSWER: rand* gives us values in the range [0.5 1].

Pushbutton

Pushbutton Callback pushbutton has the ‘callback’ property name with the property value This means that whenever the user interacts with the UICONTROL (in our case push the pushbutton), we will execute the function “DO1”.

“ varargin ” stand for variable arguments This is due to the fact that the function has no inputs to it.

Lets try this one : Add the number in the edit box with 5 and displayed on the text box1 Remember: 1-for convert string to numerical value, we use the command STR2NUM 2-use string in set command

Popupmenu list of possibilities which user can choose from them.

Lets try this one: we want to have a popupmenu string and we want the user to choose between squaring and cubing the value in the edit box. Thus when the pushbutton is pressed, the popupmenu value is checked and based on it, the operation performed will be different.

What do you think? Assume we want to have same example as before but this time in addition of pushing button we want an update when user changes the popupmenu

This means we should give the popupmenu a callback function which is the same as pushbutton callback function.

Listbox Its function is very similar to the popupmenu.

WELCOME TO second SESSION

LETS HAVE QUICK REVIEW

Slider Important slider properties include MIN, MAX, VALUE and SLIDERSTEP properties. MIN and MAX properties take the values of the minimum and maximum of the slider, respectively. SLIDERSTEP is a two element vector that controls how much the slider VALUE changes with each click. The first value of SLIDERSTEP controls how much the slider moves when one of the arrows on its far sides is clicked. The second element governs the change of slider value when clicking on an empty space in the slider itself. Both SLIDERSTEP element are scaled to the MIN to MAX scale, meaning they are to be in the range [0, 1].

Using the slider to its full potential What we want to do is make the slider control the number to be inputted. To do this, we give the slider a callback. When interacting with the slider, its value will be placed in the edit box.

Or using another function to squre it:

What if we want the edit box to control the slider?

Just like any other UICONTROL, the edit box can be given a callback as well. In the edit box callback, we change the value of the slider accordingly

What do you think? Remember how we have set the MAX property of the SLIDER to 10? Well what if this value is exceeded in the edit box, what should happen?

If the value to be set in the slider is higher than its MAX property or lower than it MIN property, then the SLIDER wouldn ’ t be created. A solution to this problem is to create an error dialog box whenever this happens, and then proceed to reset the slider.

ERRORDLG Function The function ERRORDLG produces an error dialog box with two input parameters. The second input is the box title, while the first is the error message itself. Syntax: errordlg(title,message)

Example

Checkbox UICONTROL The checkbox UICONTROL is similar to the listbox and popupmenu in which it has a defining VALUE property. The value for each checkbox can either be “ 1 ” (i.e. checked) or “ 0 ”. Another handy property is the ‘ string ’ property.

Radiobutton The radiobutton is very similar to the checkbox. You can create a radiobutton group. That way, only one of the buttons in the group can be selected “on” (i.e. has the value of “1”)

Events activating the key board >> a = waitforbuttonpress In response, Matlab displays a figure window. when you place the cursor inside the window and press down the mouse, the variable is set to 0 and the window is minimized. instead, if you press a key, a is set to 1, and you can also extract that key using >> get(gcf, ‘CurrentChar’)

Menus and other choices items = {‘Car’, ‘Truck’, ‘Motorcycle’, ‘delete’, ‘QUIT’}; menu (‘Next vehicle:’, items) Clicking on car returns 1, truck 2 etc. QUIT closes the menu.

questdlg(‘Does this make sense?’, ‘A question for you’) generates the following dialog box: Clicking on Yes (No) generates a string ‘Yes’ (‘No’).

Text Box inputs Here is a way to create a text box: Suppose the user enters the information as follows: Then, a becomes: a = 'Joe' '1/1/2010' '8'5''

Input from mouse You can use ginput function to get the position of mouse.

Refrences: Husam Aldahiyat ‘s power point Dr. ravikumar ‘s power points