[…] covered. I find the contrast quite refreshing. For instance, in Yair’s most recent post on Button Customization, he discusses the intricacies of what one can accomplish with a simple push button. So if […]

I’m having some problems with setting an ImageIcon on the buttons, here is my code:
^[15]

I create a jButton object for each of the three uicontrol buttons I create but whenever I set the icon on one of the three buttons it always sets it to the first of the three.

I’m running matlab 2008b

This is all very useful. Thanks! One question: do you know how to underline text in a static text element?

@Peter – I assume you meant the uicontrol text control, not the axis-based label generated by text (for this you can use tex-formatting).

For text uicontrol customizations, read ^[16].

These are excellent tips on customization! How do I automatically resize an icon in the button?

@Karthik, you can place a ^[17] on the button’s Position property and in its callback you could resize the button’s contents.

Thank Yair. The button is on a GUI. I wanted the image on the button to resize when I resize the GUI. The button resizes automatically with the GUI, but, when I place a listener like you suggested, the callback isnt being executed.

@Karthik – simply use your figure’s ResizeFcn property in order to catch GUI resize events

I’m using the auto Resize option on the main GUI, so I dont think I have explicit control of the GUI’s resizefcn

@Karthik – of course you do: every Matlab figure has the ResizeFcn property. It doesn’t matter how you resize the figure, this callback will get invoked.

Hi ! I would like to do a round pushbutton, is that possible in matlab ?

Not easily. The simplest way would be to draw a rounded patch that looks like a button on an invisible axes and then monitor click events on this patch.

Ok, thank you !

thanks a lot for these tips Yair !

I was working on adding icons to GUI buttons today and ran into 2 troubles:
– the javax.swing.ImageIcon seems to keep the image in memory. In case of a second execution with the same file path, it would use the copy in memory and not the newer version. Is there a way to force the reloading of the file ?
– Once an icon is used in a gui, none of the properties for the text alignment work anymore. Left, Right, Center: everything is centered and the gui parameters are unresponsive.

Did I forgot something or is that a bug that you’re aware of ?

thanks
Raphael

@Raphael – ImageIcon caches files so it will not reload the same image twice. There are alternatives ( ^[18]) that you can use instead of ImageIcon. This is really a pure Java question for which you should search on pure Java forums.

Regarding alignment, you can use the HorizontalAlinment(), HorizontalTextPosition() methods (and similarly for Vertical*) of the JButton reference. It’s covered in detail in Section 6.1 of my ^[19].

Hello, Yair.

I’ve frequented your site a lot in the last few months as I’ve gotten into GUI programming in MATLAB. I recently ran into a little problem that I’m trying to work out.

I am trying to create a GUI button with one line of text that is partially left-aligned and partially right-aligned. I was hoping to use CSS within the string field as such:

h = uicontrol('Style','PushButton','Position',[20 20 150 40]);
set(h,'String','
Left Text
Right Text
');
% I know the closing tags are not necessary

However, this creates two separate lines (which are both centered in the push button) despite the float command.

Is it possible to do this at all using HTML/CSS? Or is a JAVA solution needed or, even still, possible?

@Aaron – Unfortunately, Java Swing’s support for CSS is not complete. I ^[20] a similar question on StackOverflow back in 2011 when I saw that <div> splits the text into two lines instead of continuing on the same line. The solution in that case was to use <span> rather than <div>. It might work for your case as well.

[…] to modify the button control’s obvious suspect properties:String – the button had an HTML label. One might presume that this caused the highlighting tint, perhaps an HTML image painted […]

Hi Yair,

Thanks, this info is very helpful! (Even 3+ years later :)) When I used the code on a pushbutton, it centered the icon… and had the text centered as well. I tried using the IconTextGap property but to no avail. How do you keep the text on the right and the icon on the left? (instead of both icon and text centered?)

Here’s my code…

 S.sharedyaxis = uicontrol('style','push',...
    'units','pix',...
    'HorizontalAlign','left',...
    'string','SYA', ...
    'fontsize',12,'fontweight','bold');

jshared = findjobj(S.sharedyaxis,'nomenu');
icon = javax.swing.ImageIcon('C:\SYA_turnon.gif');
y = java(jshared);
y.setIcon(icon);

@Darin –

y.setHorizontalTextPosition(javax.swing.SwingConstants.LEFT);

This is covered both in my ^[19] and my ^[21].

Hi Yair,

thanks for all the great help! I read your instruction of changing the border of a button, but it did’nt work. I want to create a button in a matlab gui with an image as ‘CData’. The buttons position should change with the figure’s position. But the image should not be resized (it is a small image with only few pixels). When resizing the figure, the border of the button becomes visible. To avoid that, I tried to create a borderless button and unfortunately that did’nt work. Here’s my code

button = uicontrol('Style','pushbutton','String','Hello');
jbutton = findjobj(button);
jbutton.border = [];

What am I doing wrong?

Best
Chris

@Chris – I’m not sure what happened in your case but why use a button control at all? you can use an invisible axes, similar to my “buttons” in ^[22].

Wow, thanks for the link. Looks great!
I am using a button because I want it to have a tooltip. Is it possible to generate a tooltip for an axes object? I tried with your function findjobj, but I didn’t manage it.
Regards
Chris

@Chris – axes are not Java objects, so you cannot use findjobj with them. And no, they don’t have tooltips.

OK, thanks.

Hello, Yair.
The methods you mention is useful，however，when I zoomed the window I found the Icon was overlapped by the String. Finally，If I let a dialog or form have a FIXED size，the problem is solved. I intended to resize dialogs or forms in the Windows without overlapping the Icon, but I didn’t handle it.

 
info_icon_path = fullfile('C:\Users\Zhang\Desktop\icons\ModelAdvisor.png');
info_aSi = uicontrol('Style','PushButton',...   
                 'position',[10,10,120,70],...
                 'TooltipString','',...  
                 'fontsize',10,...      
                 'fontweight','bold',...      
                 'String','Description',...
                 'Enable','on');

jButton_info_nFS = findjobj(info_aSi);              %find Java-Handle of Button
jButton_info_nFS.setIcon(javax.swing.ImageIcon(info_icon_path));    %add image to button
set(jButton_info_nFS,'HorizontalTextPosition',javax.swing.SwingConstants.RIGHT);    %align text
set(jButton_info_nFS,'VerticalTextPosition',javax.swing.SwingConstants.CENTER);   

Hello Yair,
Thanks for all your work on this site.

I’ve had a heck of a time trying to figure out how to do a border-less button. I tried using both the null vector ‘[]’ approach and by setting the border directly by using the methods from the border factory class from the link you posted above (see below). However none of these attempts result in a border-less button.

I followed your example of a borderless button from here:
^[23]

I just can’t understand why this won’t work here in this simplified example. My simple code looks like this so far:

f=figure('Menubar','none', 'Position',[200 200 300 200]);
p=uipanel(f, 'BackgroundColor', [0 0 1]);
h = uicontrol('parent', p, 'Style','pushbutton', 'String','click', ...
   'Units','normalized', 'Position',[0.3 0.3 0.5 0.5],'BackgroundColor', [0 0 1]);
jh = findjobj(h);
jh.setBorder(javax.swing.BorderFactory.createEmptyBorder()); %attempt 1 does not remove border
jh.border=[];                                                %attempt 2 does not remove border
jh.setBorder([]);                                            %attempt 3 does not remove border
jh.border=javax.swing.BorderFactory.createEmptyBorder();     %attempt 4 does not remove border

I’m using MATLAB 2015a and Windows7. Any way you can provide a simple complete code for a border-less button or edit above?

Thank You!

@Brian –

jh.setBorderPainted(false);  % or: jh.BorderPainted=false;

Yair, the following didn’t work for me either:

jh.setBorderPainted(false);

Regards,
Kim

Hi Yair,
First of all thanks for this great site.
I have a problem when resizing the button parent window, the icon image dissappears.

f = figure;
b = uicontrol(f);
jButton = java(findjobj(b))
jButton.setIcon(javax.swing.ImageIcon(iconPath))

I am using R2015a and Windows7

@David – you can place the relevant setIcon() code in a small function and set the parent’s SizeChangedFcn callback to this function’s handle. This way whenever the parent resizes the icon will get repainted. Add a call to jButton.repaint() after setIcon(), to ensure that it actually gets repainted.

So, I’m having trouble finding information on this.

If I change the border of a button, then change the background color, the border resets. Then I am not able to change the border whatsoever. Is there a way I can change the border and the background? I do not want to be stuck using borderless buttons if I don’t have to

Thanks

The default Java Look&Feel for UI buttons paints the border together with the contents, and apparently prevents changing both of them together ( ^[24]). ^[25] might possibly help, and of course you could always create and use a custom Java class that inherits JButton. In any case, this is a pure Java Swing issue (not Matlab) so you should search for answers in Java forums.

Cross-reference: ^[26]