Spicing up Matlab uicontrol tooltips

May 27, 2009 20 Comments

Outside the official Matlab blogs, perhaps the most widely known Matlab-related active blog is BlinkDagger. This blog is certainly worth following, especially for novice Matlab users who could gain fresh angles on regular programming tasks that have a simple solution in Matlab.
In one of their latest posts, BlinkDagger described how to use tooltips in Matlab GUI. In one of this blog’s very first posts, I described how HTML can easily be used with Matlab uicontrols. Let’s now combine these ideas to show how HTML support can easily be used to spice-up the tooltips.
Let’s start with a simple styled multi-line tooltip:

str = '<html>line #1 line#2';
set(hControl,'tooltipString',str);
str = '<html>line #1 line#2'; set(hControl,'tooltipString',str);

Multi-line HTML'ed tooltip

This technique was used to display the informative tooltip for my Java-based data table utility on the Matlab file Exchange:

Tooltips can also be used to present images, using the HTML <img> tag. However, the image src (filename) needs to be formatted in a URL-compliant format such as ‘https://undocumentedmatlab.com/images/table.png‘ or ‘file:/C:\Yair\Undocumented Matlab\Images\table.png’.
If you try to use a non-URL-format filename, the image will not be displayed. Instead, a placeholder box will appear. For example, let’s take the table screenshot above and try to place its filename directly in the tooltip HTML:

filePath = 'C:\Yair\Undocumented Matlab\Images\table.png';
str = ['<html><center><img src="' filePath '"> ' filePath];
set(hButton,'tooltipString',str);
filePath = 'C:\Yair\Undocumented Matlab\Images\table.png'; str = ['<html><center><img src="' filePath '"> ' filePath]; set(hButton,'tooltipString',str);

Tooltip with invalid HTML img source URL

If we fix filePath to be a valid URL, it now looks as intended:

filePath = 'C:\Yair\Undocumented Matlab\Images\table.png';
filePath = strrep(['file:/' filePath],'\','/');
str = ['<html><center><img src="' filePath '"> ' ...
 '' filePath];
set(hButton,'tooltipString',str);
filePath = 'C:\Yair\Undocumented Matlab\Images\table.png'; filePath = strrep(['file:/' filePath],'\','/'); str = ['<html><center><img src="' filePath '"> ' ... '' filePath]; set(hButton,'tooltipString',str);

Note that the tooltip looks enormous (it’s actually even downsized to fit this post…). This is because our HTML <img> was not limited in size and so the tooltip was created to display the screenshot in its original large size. In order to limit the tooltip size, simply add the height and width attributes to the HTML <img> tag, remembering to preserve the original image aspect ratio.
Now that we know the basics, we can really go wild with HTML and CSS formatting. Have you configured any kick-butt tooltip in your application? If so, please share it here.

20 Responses

wei May 29, 2009 at 07:37 Reply

Yair, Could handle2struct/struct2handle pair be extended to cover all java objects?

Yair Altman June 3, 2009 at 10:18 Reply

@wei – handle2struct/struct2handle are internal Matlab functions that cannot be modified. However, you can easily build your own m-file version that try’s to call the built-in version and if an error is thrown, then the catch segment will create the necessary output object based on inspection of the Java object.

This could be a nice File Exchange submission – care to tackle it?

You can get some pointers by looking at the code within my UIInspect utility on the File Exchange.

MATLAB GUI - Tool Tips are your Friends! | blinkdagger May 31, 2009 at 02:09 Reply

[…] Yair’s Undocumented Tips on How to Spice up Tooltips […]
Ben Shepherd June 3, 2009 at 07:39 Reply

That looks like a really handy feature! On a slightly related note, do you know of any way of forcing a tooltip to display (or update one that is already being displayed)?

Yair Altman June 3, 2009 at 10:10 Reply
@Ben – this was challenging: Until you asked I thought I knew the standard answer, which is “no” – tooltips use the system’s ToolTipManager object that can’t be modified. But then I found this Java hack, which I’m not even sure is documented in Java… Assuming you get the Java reference in jHandle:
import java.awt.event.ActionEvent; action = jHandle.getActionMap.get('postTip'); actionEvent = ActionEvent(jHandle, ActionEvent.ACTION_PERFORMED, 'postTip'); action.actionPerformed(actionEvent);
import java.awt.event.ActionEvent; action = jHandle.getActionMap.get('postTip'); actionEvent = ActionEvent(jHandle, ActionEvent.ACTION_PERFORMED, 'postTip'); action.actionPerformed(actionEvent);
The mouse does not even have to be anywhere near the GUI object!

Unfortunately, this hack requires the Java reference of the GUI object, and is not available for Matlab handles. To get a Matlab handle’s underlying Java reference you can use my FindJObj utility on the File Exchange and then use the hack.

Alan June 3, 2009 at 14:19 Reply

Offtopic, sorry, but just wanted to reiterate – great blog idea, you should definitely keep it up. How about a post on systemdependent() ?

Yair Altman June 3, 2009 at 14:41 Reply

@Alan – thanks.

I’ll do a post or two about systemdependent but look at my long TODO list: so little time, so much to do…

Zeilenumbruch für Tooltips in Matlab | House-Tiere -d(~_~)b- April 16, 2010 at 18:46 Reply

[…] Was aber funktioniert ist html, es gibt ein undokumentiertes Feautre, mit dem einfach html eingefügt werden kann – Java machts möglich. […]
Koelemay December 2, 2010 at 08:05 Reply

Great post as usual — any idea how to get this to work on the text popups when using datacursormode?? It seems like it would be similar to the tooltips but doesn’t seem to work by default. Thanks in advance for your time!

Yair Altman December 2, 2010 at 10:11 Reply

@Koelemay – take a look at my DataMatrix utility, which does this:

Koelemay December 3, 2010 at 06:42 Reply

Hi Yair,
Sorry I think my question was too ambiguous; I was wondering if it is possible to get html markup in the datacursor mode popups. So, for example, using datamatrix I’d like to use html markup in the strings for the dataTips input. Hopefully I’m not missing something horribly obvious! Thanks again for your help!

Yair Altman December 4, 2010 at 11:45 Reply

@Koelemay – datacursor popups are not tooltips and they don’t support HTML to the best of my knowledge. There’s probably a way to make them HTML-aware, if you dig deep enough in the datacursor code (\toolbox\matlab\graphics\@graphics\@datacursor\*.m, \@datatip\*.m and their relatives within \@graphics). Let us all know if you find a workaround.

Multi-line tooltips | Undocumented Matlab November 2, 2011 at 19:11 Reply

[…] In this blog, I have already posted several articles about how to tweak tooltip contents (here, here, and here). Today I would like to expand on one of the aspects that were already covered, […]
Nick August 9, 2012 at 13:33 Reply

Is it possible to use HTML to reference an image file from a compiled MATLAB executable? Is the format for the HTML “img” tag the same?

img src=”file:\c:/user/mypic.png” worked when running my application in MATLAB, but I think the path isn’t correct when I run from my compiled exe. (Crazy MCR!)

Also, are relative paths accepted? I could only get this to work with a full path so far.

Nick August 10, 2012 at 07:16 Reply
I ended up getting this working by adding the image file to the executable’s CTF archive (using the -a option to MCC) and then referencing it in my code by:
imagePath = fullfile(ctfroot,'mypic.png');
imagePath = fullfile(ctfroot,'mypic.png');
Then I provided imagePath as the path in the “img” tag. So…this was less of an HTML question, more about proper use of MCC.

Kai April 29, 2014 at 01:11 Reply
@Yair,

The code to display tooltips programmatically does not work for uitables in newer Matlab versions anymore:
import java.awt.event.ActionEvent; u = uitable('data',zeros(4,4),'tooltip','text...'); jScroll = findjobj(u); jTable = jScroll.getViewport.getView; action = jTable.getActionMap.get('postTip')
import java.awt.event.ActionEvent; u = uitable('data',zeros(4,4),'tooltip','text...'); jScroll = findjobj(u); jTable = jScroll.getViewport.getView; action = jTable.getActionMap.get('postTip')
matlab output:
action = []
action = []
Laurent September 30, 2014 at 21:38 Reply

Hi Yair ,
Thanks for the tremendous amount of good tips on this blog, it s really helpful.
i was wondering how to put tooltip on a matlab toolbar icon.
As ‘TooltipString’ is not an accessible property for an instance of class ‘uitoolbar’.

any idea how to work around this ?

Thanks,

L.

Yair Altman September 30, 2014 at 22:05 Reply

@Laurent – set the TooltipString property on the toolbar icon’s handle (uipushtool, uitoggletool, uisplittool, or uitogglesplittool) – not on the toolbar handle.

Konstantin October 11, 2018 at 11:18 Reply

Hi Yair. Your article is excellent, but i see in column “Names” you realized different data for popup in different rows. Please, can you says how you do this?

Yair Altman October 21, 2018 at 18:25 Reply

@Konstantin – you can set up a custom cell-editor that displays a different list of drop-down/pop-up values based on certain conditions (such as the data in another column in the same row). I explain how to do this in my book Undocumented Secrets of Matlab-Java Programming or in my uitable customization report:

HTML tags such as or are accepted.
Wrap code fragments inside <pre lang="matlab"> tags, like this:

<pre lang="matlab">
a = magic(3);
disp(sum(a))
</pre>

I reserve the right to edit/delete comments (read the site policies).
Not all comments will be answered. You can always email me (altmany at gmail) for private consulting.

Click here to cancel reply.

Related posts:

20 Responses

Leave a Reply