How to change the size of an image loaded into the push button automatically when the window size of a GUI(GUIDE) changes.

Hello, I'm new to GUI. I am creating an user interface in GUI fusing GUIDE. I would like to include a fancy ''close'' image into the push button such that when I push the GUI should close. I successfully imported using property ''CData''. I am using the GUI size to proportional. I adjusted several times adjusting the size of push button and later when I resize the GUI the size of push button is changing automatically but not the image. Do I need to implement new function for this? Would you please suggest something on this code? I am attaching the image,code GUI, script file.

I need help and it's urgent.

Answer 1

[Image Analyst]

Make sure the 'Units' property of all the controls on your GUI is set to 'Normalized'.

Answer 2

[Anil Turkkan]

I don't think changing units property will do anything on buttons. If you display an image using an axis, the image will be scaled as you change the GUI size. However, if you attach an image to a button, you need to use SizeChangedFcn callback of your GUI. My GUI has 4 buttons with images attached and this is how I do the scaling:

% --- Executes when mainGUI is resized.
function mainGUI_SizeChangedFcn(hObject, eventdata, handles)
% hObject    handle to mainGUI (see GCBO)
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    structure with handles and user data (see GUIDATA)

%image and button list
images={'newButton.jpg','loadButton.jpg','prbOptimizerButton.jpg','help.png'};
buttons={'newButton','loadButton','prbButton','helpButton'};

for i=1:length(images)
    %read the images
    if isempty(strfind(images{i},'png'))
        images{i}=imread(images{i});
    else
        images{i}=imread(images{i},'BackGroundColor',[0.961 0.98 0.98]);        
    end

      %get the button new button sizes and resize images accordingly
      handles.(buttons{i}).Units='pixels';
      images{i}=imresize(images{i},fliplr(handles.(buttons{i}).Position(1,3:4)));
      handles.(buttons{i}).Units='normalized';
      handles.(buttons{i}).CData=images{i};
  end

I stored image and button names in a cell array so I don't need to write the same code for all buttons. First, I read the image file and store in the same cell array. We can then resize the image according to the new button size and attach the new scaled image to the button.