Implementing tooltips for all widgets

Question

Implementing tooltips for all widgets

Closed this issue 2 years ago · 25 comments

I noticed that ToggleButtons have tooltips implemented where if hovering over the button a tooltip appears with some text specified in:

widgets.Button(description='Button', width='10%', tooltip='This is the tooltip')

which results in:

Now this is quite useful because it gives the ability to provide more info than possible in text on the button if the width is small as in the above example.

It seems to me this is a useful feature on a number of other widgets aswell, e.g. the Text widget, Checkbox widget, etc. Often not a lot of textual information can be given through the 'description' attribute without making the widget excessively long:

widgets.Text(description='Enter the name of this Text field')

I have a couple of questions:

Is there a specific reason why tooltips aren't implemented on all widgets by default (it could ofcourse be disabled by default, e.g. using tooltip=None?
Are the devs and community at all interested in such a feature?
I would like to see this implemented and willing to do some work to get it done but i need some pointers. I made some attempts at implementing a tooltip on the label of a TextField. Unfortunately, it is not working at all which is probably the result of my limited understanding of Javascript. Is my approach at all correct? If not, how should i approach this?

Answer 1 · 2016-03-14T07:07:43.000Z

Regarding 3: Nevermind, i managed to fix the problem getting a tooltip on a label in a TextField. Issuing:

widgets.Text(description='Name: ', tooltip='Enter the name of the Text field')

gives:

I would still like to know the answer to specifically question 2 before making a PR.

Answer 2 · 2016-03-14T15:26:19.000Z

I am open to us having tooltips on the widgets, but would recommend the tooltips text follow guidelines such as these:

https://developer.apple.com/library/mac/documentation/UserExperience/Conceptual/OSXHIGuidelines/Assistance.html

Answer 3 · 2016-03-15T10:25:35.000Z

Ok that's great to know, i will start preparing a PR. Considering your recommendation; I distilled the main points of a good tooltip according to those guidelines to 10 points:

For the best user experience, don’t create a custom help viewer.
Only display a Help button in a window when there is contextually relevant help available.
In general, don’t name the interface element in the tag.
Describe only the element that the pointer is resting on.
Describe controls that are unique to your app.
Focus on the action users can perform using the control.
Use the fewest words possible.
Use sentence-style capitalization.
In general, use a sentence fragment.
Consider creating contextually sensitive help tags.

We can of course limit the string length of the tooltip which would satisfy point 7. In my opinion, however, satisfying the other guidelines is up to the discretion of the person writing the tooltip. How do you propose to enforce users to follow most of these guidelines?

Answer 4 · 2016-03-15T18:18:34.000Z

Two points:

The guidelines should probably be enforced using code review.
Thinking more about the actual content of the tooltips. In reality,
having a tooltip like "Enter text here" isn't very useful. What you want is
information that is domain specific like, "Enter your first and last name
here"

Because of this, would it make more sense to expose the tooltip text as an
attribute on the widgets themselves that users can set in python?

On Tue, Mar 15, 2016 at 3:25 AM, Niels Looije notifications@github.com
wrote:

Ok that's great to know, i will start preparing a PR. Considering your
recommendation; I distilled the main points of a good tooltip according to
those guidelines to 10 points:

For the best user experience, don’t create a custom help viewer.

Only display a Help button in a window when there is contextually
relevant help available.

In general, don’t name the interface element in the tag.

Describe only the element that the pointer is resting on.

Describe controls that are unique to your app.

Focus on the action users can perform using the control.

Use the fewest words possible.

Use sentence-style capitalization.

In general, use a sentence fragment.

Consider creating contextually sensitive help tags.

We can of course limit the string length of the tooltip which would
satisfy point 7. In my opinion, however, satisfying the other guidelines is
up to the discretion of the person writing the tooltip. How do you propose
to enforce users to follow most of these guidelines?

—
You are receiving this because you commented.
Reply to this email directly or view it on GitHub:
#421 (comment)

Brian E. Granger
Associate Professor of Physics and Data Science
Cal Poly State University, San Luis Obispo
@ellisonbg on Twitter and GitHub
bgranger@calpoly.edu and ellisonbg@gmail.com

Answer 5 · 2016-03-15T22:13:50.000Z

Maybe my example in my first post was badly chosen; i agree that the purpose of the tooltip should be to provide more useful info than 'Enter the name of the text field'.
My aim with the tooltips is exactly that the tooltip, like e.g. description, should be an attribute the user can set.

Answer 6 · 2016-03-16T01:08:11.000Z

Ahh great!

On Tue, Mar 15, 2016 at 3:13 PM, Niels Looije notifications@github.com
wrote:

Maybe my example in my first post was badly chosen; i agree that the
purpose of the tooltip should be to provide more useful info than 'Enter
the name of the text field'.
My aim with the tooltips is exactly that the tooltip, like e.g.
description, should be an attribute the user can set.

—
You are receiving this because you were mentioned.
Reply to this email directly or view it on GitHub
#421 (comment)

Brian E. Granger
Associate Professor of Physics and Data Science
Cal Poly State University, San Luis Obispo
@ellisonbg on Twitter and GitHub
bgranger@calpoly.edu and ellisonbg@gmail.com

Answer 7 · 2016-07-29T19:53:47.000Z

I am +1 for adding tooltip for Text and TextArea. Sometimes I don't want to use Description or Label to make the GUI nicer.

Answer 8 · 2016-07-29T23:36:39.000Z

You might mention in docs that touch devices don't have a natural way to access tooltips, to help people understand the UI issues.

Answer 9 · 2017-07-20T17:59:05.000Z

Is their now a possibility to adjust the tooltip for the SelectMultiple widget?
If a set

widgets.SelectMultiple(options=['Just','a','test'], description='Select', tooltip='Nice tooltip!')

I will always see the description and not text I mention for the tooltip.

Answer 10 · 2017-07-20T18:06:18.000Z

I don't think anyone has implemented this.

Answer 11 · 2017-07-20T18:07:18.000Z

(If you would like to implement it, a PR would be welcome!)

Answer 12 · 2018-12-13T12:23:49.000Z

I'd like to implement this, but I'm not fully understanding the relationship between description and tooltip.

I have a slider with a description (appears alongside the slider) but would like to add a tooltip (appears upon mouse hover). Do tooltips default to descriptions if no description is given? The same applies for the dropdown widget. Is there another thread that this would be more relevant in?

Answer 13 · 2019-04-02T12:29:03.000Z

Anything one can do to make this happen more quickly?

Answer 14 · 2019-04-02T14:29:04.000Z

Hello all
FYI, part of the job is done on PR #2342 : for Text input, if description is void.

Answer 15 · 2019-04-05T08:32:09.000Z

Anything one can do to make this happen more quickly?

@deeplook what exactly do you need?

Answer 16 · 2019-04-06T18:57:36.000Z

@zerline The title says it all, doesn't it? "Implementing tooltips for all widgets"

Answer 17 · 2019-04-08T07:59:56.000Z

@deeplook do you have some use cases in particular?

Answer 18 · 2019-04-08T11:40:11.000Z

@zerline Ermmm, I have a textarea and I want it to show a tooltip. What else do you need?

Answer 19 · 2019-04-08T13:02:29.000Z

@deeplook do you think, or not, that you could use description_tooltip? and in case description_tooltip does not help, do you actually need a different tooltip when mouse over the description, compared to when mouse over the textarea itself or should it be the same? I'm asking those questions because the core developers seem reluctant to introduce tooltips "everywhere", so I'm looking for a consensus

Answer 20 · 2019-04-15T09:04:37.000Z

@zerline I really don't see a reason for adding so much complexity here. People expect a single tooltip from a widget. I don't see why a textarea should have two tooltips? In a normal GUI widget library anybody would expect a Widget base class to have a tooltip attribute and the subclasses get it "for free". Why is this so much different for ipywidgets?

Answer 21 · 2020-09-23T14:58:20.000Z

do you think, or not, that you could use description_tooltip?

@zerline A lot of times we don't want to show the description of the widget (it's hard to style it). Showing the tooltip for the widget makes more sense than having the tooltip attached to the description

Answer 22 · 2020-09-29T13:59:34.000Z

A bit more work, but https://github.com/mariobuikhuizen/ipyvuetify can do it (see the binder link for an example)

Answer 23 · 2020-11-08T16:04:10.000Z

Regarding 3: Nevermind, i managed to fix the problem getting a tooltip on a label in a TextField. Issuing:

widgets.Text(description='Name: ', tooltip='Enter the name of the Text field')

gives:

I would still like to know the answer to specifically question 2 before making a PR.

In 7.5.1, tooltip on a text field is not showing. Should there be any specific conditions met before it's being displayed?

Answer 24 · 2022-09-14T21:37:13.000Z

PR #2680 seems to have resolved this. Can this be closed?

Answer 25 · 2022-09-15T02:37:33.000Z

Yes, thanks!