Top Banner

of 68

Ch6 Matlab Gui

Apr 02, 2018

Download

Documents

nstl0101
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
  • 7/27/2019 Ch6 Matlab Gui

    1/68

  • 7/27/2019 Ch6 Matlab Gui

    2/68

  • 7/27/2019 Ch6 Matlab Gui

    3/68

    Initializing GUIDE (GUI Creator)1. Open up MATLAB. Go to the command window and type in guide

    2. Choose the first option Blank GUI (Default)

  • 7/27/2019 Ch6 Matlab Gui

    4/68

    Initializing GUIDE (GUI Creator)

    3. You should now see the following screen.

  • 7/27/2019 Ch6 Matlab Gui

    5/68

    Initializing GUIDE (GUI Creator)

    4. Before adding components blindly, it is good to have a rough idea about how youwant the graphical part of the GUI to look like.

  • 7/27/2019 Ch6 Matlab Gui

    6/68

    Creating the Visual Aspect of the GUI: Part 1

    1. For the adder GUI, we will need the following components

    wo ex componen s

    Four Static Text component

  • 7/27/2019 Ch6 Matlab Gui

    7/68

    Creating the Visual Aspect of the GUI: Part 1

    2. Edit the properties of these components.

    Double click one of the Static Textcomponents. You should see the property Inspector.

  • 7/27/2019 Ch6 Matlab Gui

    8/68

    Creating the Visual Aspect of the GUI: Part 1

    3. Do the same for the next Static Textcomponent, but instead of changing the Stringparameter to +, change it to =, and another it to MyAdderGUI.

    4. For Static Textcomponent 0, modify the Tagparameter to answer_staticText.

    5. You should have something that looks like

    the following:

  • 7/27/2019 Ch6 Matlab Gui

    9/68

    Creating the Visual Aspect of the GUI: Part 2

    1. Modify the Edit Textcomponents. Double click on the first Edit Textcomponent.Set the Stringparameter to 0Chan e the Ta arameter to in ut1 editText_

    2. The second Edit Textcomponent, set the Stringparameter to 0Set the Tagparameter input2_editText.

  • 7/27/2019 Ch6 Matlab Gui

    10/68

    Creating the Visual Aspect of the GUI: Part 2

    3. Modify the pushbuttoncomponent.Change the Stringparameter to Add!Chan e the Ta arameter to add ushbutton._

  • 7/27/2019 Ch6 Matlab Gui

    11/68

    Creating the Visual Aspect of the GUI: Part 2

    4. You should have something like this: You should have something like this:

    5. Save our GUI under an file name ou lease. I chose to name mine m Adder.When you save this file, MATLAB automatically generates two files:

    myAdder.figand myAdder.m.The .fig file contains the graphics of your interface.The .m file contains all the code for the GUI.

  • 7/27/2019 Ch6 Matlab Gui

    12/68

    Writing the Code for the GUI Callbacks

    1. Open up the .m file that was automatically generated when you saved your GUI.

    2. In the MATLAB editor, click on the icon, which will bring up a list of the functions

    within the .m file. Select input1_editText_Callback.

  • 7/27/2019 Ch6 Matlab Gui

    13/68

    Writing the Code for the GUI Callbacks

    3. The cursor should take you to the following code block:

    4. Add the following code to the bottom of that code block:

    5. Add the same block of code to input2_editText_Callback.

  • 7/27/2019 Ch6 Matlab Gui

    14/68

    Writing the Code for the GUI Callbacks

    6. Now we need to edit the add_pushbutton_Callback.

    Here is the code that we will add to this callback:

  • 7/27/2019 Ch6 Matlab Gui

    15/68

    Launching the GUI

    7. There are two ways to launch your GUI.

    .

    The second method : Launch the GUI from the MATLAB command prompt.Type in the name of the GUI at the command prompt.

  • 7/27/2019 Ch6 Matlab Gui

    16/68

    Launching the GUI

    8. The GUI should start running immediately:

  • 7/27/2019 Ch6 Matlab Gui

    17/68

    MATLAB GUI Tutorial - SliderIn this Matlab GUI tutorial, you will learn how to create and use the slider component.Sliders are useful controls for choosing a value in a range of values.Common uses are volume controls seekers for movie and sound files as well as color ickers.An example of a slider is shown below.

  • 7/27/2019 Ch6 Matlab Gui

    18/68

    Create the Visual Aspect of the GUI1. Open up MATLAB. Go to the command window and type in guide

    2. Choose the first option Blank GUI (Default)

  • 7/27/2019 Ch6 Matlab Gui

    19/68

  • 7/27/2019 Ch6 Matlab Gui

    20/68

    Creating the Visual Aspect of the GUI: Part 1

    1. For the adder GUI, we will need the following components

    an ex componen o e gure.

    Add a Slidercomponent onto the GUI figure.

  • 7/27/2019 Ch6 Matlab Gui

    21/68

    Creating the Visual Aspect of the GUI: Part 1

    2. Edit the properties of these components.

    Double click the Edit Textcomponent to bring up the Property Inspector.ange e tr ngproper y o , an

    change the Tagproperty to sliderValue_editText.

    3. Modify the properties of the Slidercomponent.Sit the Minproperty to 0, and

    the Maxproperty to 100. .

  • 7/27/2019 Ch6 Matlab Gui

    22/68

    Creating the Visual Aspect of the GUI: Part 1

    4. The figure should look like after you add the components and modify them.

  • 7/27/2019 Ch6 Matlab Gui

    23/68

    Creating the Visual Aspect of the GUI: Part 1

    5. Add some Static Textcomponents to specify the min and max values of the slider.Modify their text by double clicking on the component and

    chan in the Strin ro ert .Its not required, but I highly recommend it.

    6. Save your GUI wherever you please with your desired filename.

  • 7/27/2019 Ch6 Matlab Gui

    24/68

  • 7/27/2019 Ch6 Matlab Gui

    25/68

    Writing the Code for the GUI Callbacks

    3. Add the following code to the function:

  • 7/27/2019 Ch6 Matlab Gui

    26/68

    Writing the Code for the GUI Callbacks

    4. Add the following code to the slider_editText_Callback function:

  • 7/27/2019 Ch6 Matlab Gui

    27/68

    Run and Test the GUI

    . - , .

    2. Alternatively, from the GUIDE editor, you can click on the to launch the GUI.

    Now tr to ut in different t es of in uts to test the GUI.Any input that is not a number, less than zero,or greater than 100 should default the slider to a value of zero.

  • 7/27/2019 Ch6 Matlab Gui

    28/68

  • 7/27/2019 Ch6 Matlab Gui

    29/68

    Create the Visual Aspect of the GUI1. Open up MATLAB. Go to the command window and type in guide

    2. Choose the first option Blank GUI (Default)

  • 7/27/2019 Ch6 Matlab Gui

    30/68

    Create the Visual Aspect of the GUI

    3. You should now see the following screen.

  • 7/27/2019 Ch6 Matlab Gui

    31/68

  • 7/27/2019 Ch6 Matlab Gui

    32/68

    Creating the Visual Aspect of the GUI: Part 1

    2. Double click the Static Textcomponent to bring up the Property Inspector.

    Change the Stringproperty to Testing!!!, and

    change the Tagproperty to testing_staticText as shown in the figure below:

  • 7/27/2019 Ch6 Matlab Gui

    33/68

    Creating the Visual Aspect of the GUI: Part 1

    3. Modify the properties of the Pop-up Menucomponent.

    Click on the icon on the Stringproperty line as shown below.

    4. After clicking on the icon,

    you should now see the following window.

    Fill in the window as shown below:

  • 7/27/2019 Ch6 Matlab Gui

    34/68

    Creating the Visual Aspect of the GUI: Part 1

    5. The figure should look like after you add the components and modify them.

  • 7/27/2019 Ch6 Matlab Gui

    35/68

    Creating the Visual Aspect of the GUI: Part 1

    6. Add some Static Textcomponents to add some description tags to the GUI.Modify their text by double clicking on the component andchan in the Strin ro ert .

  • 7/27/2019 Ch6 Matlab Gui

    36/68

    Writing the Code for the GUI Callbacks

    1. Open up the .m file that was automatically generated when you saved your GUI.

    2. In the MATLAB editor, click on the icon, which will bring up a list of the functions

    within the .m file.

    Select popupmenu1_Callback.

  • 7/27/2019 Ch6 Matlab Gui

    37/68

    Writing the Code for the GUI Callbacks

    3. Add the following code to the function:

  • 7/27/2019 Ch6 Matlab Gui

    38/68

    Run and Test the GUI

    . - , .

    2. Alternatively, from the GUIDE editor, you can click on the to launch the GUI.

    Go ahead and try selecting different font sizes.

  • 7/27/2019 Ch6 Matlab Gui

    39/68

    MATLAB GUI Tutorial - Plotting Data to Axes

    In this Matlab GUI tutorial, you will learn how to create and use the Axescomponent.The Axescomponent allows you to display graphics, such as graphs and images on yourGUI.In this tutorial, we will create two axes on the GUI and plot some simple data onto it.In addition, we will include a reset button to clear the axes andwe will also add the standard toolbar to allow the user to zoom, pan, and query the plot.

  • 7/27/2019 Ch6 Matlab Gui

    40/68

    Create the Visual Aspect of the GUI1. Open up MATLAB. Go to the command window and type in guide

    2. Choose the first option Blank GUI (Default)

  • 7/27/2019 Ch6 Matlab Gui

    41/68

  • 7/27/2019 Ch6 Matlab Gui

    42/68

    Creating the Visual Aspect of the GUI: Part 1

    1.For the adder GUI, we will need the following components.

    .Add three Pushbuttoncomponents onto the GUI figure.

  • 7/27/2019 Ch6 Matlab Gui

    43/68

    Creating the Visual Aspect of the GUI: Part 1

    2. Double click the Axescomponent to bring up the Property Inspector.

    The Tagproperty is named axes1.

    The other Axescomponents Tagproperty is named axes2.

  • 7/27/2019 Ch6 Matlab Gui

    44/68

    Creating the Visual Aspect of the GUI: Part 1

    3. Modify the properties of the Pushbuttoncomponents.

    Double click on one of the Pushbuttoncomponents.

    Change the Stringproperty to Plot Axes 1, and the Tagproperty to plotAxes1_pushbutton

    4. Double click on the next pushbutton and change the Stringproperty to Plot Axes 2and change the Tagproperty to plotAxes2_pushbutton.

    and change the Tagproperty to clearAxes_pushbutton.

  • 7/27/2019 Ch6 Matlab Gui

    45/68

    Creating the Visual Aspect of the GUI: Part 1

    5. The figure should look like below after you add the components and modify them.

    W iti th C d f th GUI C llb k

  • 7/27/2019 Ch6 Matlab Gui

    46/68

    Writing the Code for the GUI Callbacks

    1. Open up the .m file that was automatically generated when you saved your GUI.

    2. In the MATLAB editor, click on the icon, which will bring up a list of the functions

    within the .m file.

    Select plot1_pushbutton_Callback.

  • 7/27/2019 Ch6 Matlab Gui

    47/68

    W iti th C d f th GUI C llb k

  • 7/27/2019 Ch6 Matlab Gui

    48/68

    Writing the Code for the GUI Callbacks

    4. Put the following code into the plot2_pushbutton_Callback:

    Writing the Code for the GUI Callbacks

  • 7/27/2019 Ch6 Matlab Gui

    49/68

    Writing the Code for the GUI Callbacks

    5. Add some code to the clearPlots_pushbutton_Callback:

    5. Add the following line of code to axes_tutorial_OpeningFcn:

    This line of code effectively adds the standard toolbar to the GUI, allowing the user to zoom,pan, query the plot, and more.

    Run and Test the GUI

  • 7/27/2019 Ch6 Matlab Gui

    50/68

    Run and Test the GUI

    1. From the m-file editor, you can click on the icon to save and run the GUI.

    2. Alternativel from the GUIDE editor ou can click on the to launch the GUI.

  • 7/27/2019 Ch6 Matlab Gui

    51/68

    Create the Visual Aspect of the GUI

  • 7/27/2019 Ch6 Matlab Gui

    52/68

    Create the Visual Aspect of the GUI1. Open up MATLAB. Go to the command window and type in guide

    2. Choose the first option Blank GUI (Default)

    Create the Visual Aspect of the GUI

  • 7/27/2019 Ch6 Matlab Gui

    53/68

    Create the Visual Aspect of the GUI

    3. You should now see the following screen.

    Part One: The Pushbutton

  • 7/27/2019 Ch6 Matlab Gui

    54/68

    Part One: The Pushbutton

    1.For the adder GUI, we will need the following components.add one Static Textcomponent to the GUI figure.Add three Pushbuttoncomponents onto the GUI figure.

    2. Double click the Static Textcom onent to brin u theProperty Inspector.Change the Stringproperty so that there is nothing inside.Change the Tagproperty to display_staticText.Double click on the Pushbuttoncomponent and

    change the Stringproperty to Display Text! andchange the Tagproperty to displayText_pushbutton.

    Creating the Visual Aspect of the GUI: Part 1

  • 7/27/2019 Ch6 Matlab Gui

    55/68

    g p

    3. The figure should look like below after you add the components and modify them.

    Writing the Code for the GUI Callbacks

  • 7/27/2019 Ch6 Matlab Gui

    56/68

    Writing the Code for the GUI Callbacks

    1. Open up the .m file that was automatically generated when you saved your GUI.

    2. In the MATLAB editor, click on the icon, which will bring up a list of the functions

    within the .m file.

    Select displayText_pushbutton_Callback.

    Writing the Code for the GUI Callbacks

  • 7/27/2019 Ch6 Matlab Gui

    57/68

    3. Add the following code to the function:

    Run and Test the GUI

  • 7/27/2019 Ch6 Matlab Gui

    58/68

    1. From the m-file editor, you can click on the icon to save and run the GUI.

    2. Alternativel from the GUIDE editor ou can click on the to launch the GUI.

    Part Two: The Check Box

  • 7/27/2019 Ch6 Matlab Gui

    59/68

    1.For the adder GUI, we will need the following components.add one Check Boxcomponent to the GUI figure.

    2. Double click the Check Boxcom onent to brin u theProperty Inspector.

    Change the Stringproperty to Bold.Change the Tagproperty to bold_checkbox.

    Creating the Visual Aspect of the GUI: Part 1

  • 7/27/2019 Ch6 Matlab Gui

    60/68

    3. The figure should look like below after you add the Check Boxcomponent and modify it.

    Writing the Code for the GUI Callbacks

  • 7/27/2019 Ch6 Matlab Gui

    61/68

    3. Add the following code to the bold_checkbox_Callbackfunction:

    Run and Test the GUI

  • 7/27/2019 Ch6 Matlab Gui

    62/68

    1. Run the GUI to make sure it works before we move on.Try checking and unchecking the Check Boxcomponent to make sure that the text

    Hello World! is being bolded and unbolded.

    Part Three: Radio Buttons, Toggle Buttons, and Button Group Panel

  • 7/27/2019 Ch6 Matlab Gui

    63/68

    1. Closed GUIDE, reopen it again.add one Button Panelcomponent to the GUI figure.Add three radio buttons onto the button group panel.

    2. Double click on the first Radio Buttoncom onent to brin uthe Property Inspector.

    Change the Stringproperty to 8.Change the Tagproperty to fontsize08_radiobutton.

    Creating the Visual Aspect of the GUI: Part 1

  • 7/27/2019 Ch6 Matlab Gui

    64/68

    3. Double click on the second Radio Buttoncomponent, and change the Stringproperty to 12.Change the Tagproperty to fontsize12_radiobutton.

    Double click on the third Radio Buttoncom onent and chan e the Strin ro ert to 16.Change the Tagproperty to fontsize16_radiobutton.

    Double click on the button group panel and change the Tagproperty to fontSelect_buttongroup.Change the Stringproperty for the button group panel to Fontsize.

    Heres what your figure should look like after you add the components and modify them.

    Creating the Visual Aspect of the GUI: Part 1

  • 7/27/2019 Ch6 Matlab Gui

    65/68

    3. Check the hierarchical structure of the GUI figure. Click on the icon andthe followinging should appear:

    Make sure that the three radio buttons are one hierarchy below the button group

    .

    Writing the Code for the GUI Callbacks

  • 7/27/2019 Ch6 Matlab Gui

    66/68

    3. Add the following line of code to the opening function.In this tutorial example, it is named button_tutorial_OpeningFcnfunction

    Writing the Code for the GUI Callbacks

  • 7/27/2019 Ch6 Matlab Gui

    67/68

    3. Next, add the following function at the very end of the .m file.

    Run and Test the GUI

  • 7/27/2019 Ch6 Matlab Gui

    68/68

    Run the GUI.Try clicking on all of the buttons to make sure they perform their function correctly.Specifically, make sure that the font size changes accordingly.