Changing the Button Image

In this part of the tutorial, we are going to place the smiley face image onto a button.

GUI with Background

  1. Using the previous GUI that we were working with, add a pushbutton component to the GUI figure. Change the Tag property to pushbutton1.

  2. Since the smiley image has dimensions of 65 x 65 pixels, we want to make the pushbutton the same size. Similarly, f you want your pushbutton to be a specific size, you can resize the image to fit the button instead. First, change the Units property to pixels via the Property Inspector.

    Units Property

    Next, change the Width field to 65 and change the Height field to 65.

    Position Property

  3. Now, go to the m-file and add the following code to customImage_OpeningFcn: 

    %import the smiley image into matlab
%if image is not in the same directory as the GUI files, you must use the 
%full path name of the image file
smiley = importdata('smiley.jpg');
 
%set the smiley image as the button background
set(handles.pushbutton1,'CDATA',smiley);

  4. Now, save and run the GUI. You should get something that looks like this:

    GUI with background and button images

This is the end of the tutorial.

Pages: 1 2 3