Expand my Community achievements bar.

SOLVED

custom tooltip

Avatar

Former Community Member

Hello,

I need to display large amount of formatted text as a replacement of standard tooltip.

Since the text can be very large, there should be scrollbar and in addition the text should be displayed in some bubble or rounded rectangle.

This should be used on the standard pdf form ((body)page -> Subform -> form objects).

Do you have any idea, how could this be implemented ?

Is it possible to write formatted string in e.g. some markup ("<b>hello world</b>") and then set this text to a Text Object ? Web browsers supports something similar:  documentElement.innerHTML = '<b>te</b><i>xt</i>';

Thanks for any hint.

1 Accepted Solution

Avatar

Correct answer by
Level 10

Hi,

In Acrobat and LC Designer you can set the value and appearance of an object at runtime. But it is difficult to achieve the same effect that you can get in Flash/HTML.

The closest to a canvas would be a subform, as it is a basic container. But then you are basically back to a textfield with a scroll bar and validation script. You can hide the textfield/subform when it is not needed. The sample above would be an example.

You can set a textfield as rich text in the Object > Field tab, so that the user can hit Control+B for bold, but I am not sure if you can script to have specific words bold at runtime. 

The tooltips in the accessible tab are fine for a few lines. After that you need to look at other solutions.

Here is a form where I uses tooltips AND an area shaded blue under the fields for additional guidance.

Acrobat1.png

As the user hovers over each field, the text in the blue shaded area changes, supporting the tooltips.

There was one field that required a significant amount of information, so for that field, the ones on the left are hidden and a map is displayed.

Acrobat1.png

There are several ways of achieving this and each one will have advantages and disadvantages. For example the dialogs will give you great control over a read only scrollable text, but because it is modal it will be disruptive to the user in clearing the dialog.

Hope that helps,

Niall

View solution in original post

9 Replies

Avatar

Level 10

Hi,

Here is a sample that may give you some direction: https://acrobat.com/#d=jD3k1sL7PGcTo6CHHTiEOA

The third example shows/hides a subform on mouse enter/exit.

N.

Avatar

Former Community Member

Thank you for reply Niall,

I already tried something similar, but I end up with that, that it would be very difficult to handle scrollbars in this way.

Another issue might be, that if e.g. some list-box or textfield gets focus, it is rendered over this subform.

But maybe this can by still the easiest way ...

Avatar

Level 10

Hi,

If the 'tooltip' is that extensive that you need scroll bars, why not consider a dedicated help page. This could be hidden by default and then have a button next to the field.

On the click event it would change the visibility of the help page and get the focus to it. Then the help page would have a 'close help' button that would hide the page and set the focus back to the field.

This way new users could access the detailed help content, but once they know what is involved they could just fill in the data.

Good luck,

Niall

Avatar

Former Community Member

I do consider dedicated help page, thanks for hint :-).

There may be thwo issues:

1) there will be more tooltips and if they will be more often short and a few of them large, it could be confusing.

2) I think I had problems, when I have five pages and I wanted to show only one and not the first of them. The other ones prior the desired one needed to be also displayed. This could be also confusing.

Beside this I found http://www.windjack.com/resources/Examples/DialogUses.pdf and according to this, it is possible to display large textField with very large text in custom window-dialog. It does not solve the design aspect, but the scrollbars are more important.

Avatar

Level 10

Hi,

You know your form and users best. AcroDialog is excellent - very easy to develop in Acrobat and them copy/paste script into LC Designer. Because it is modal, I would recommend a button next to the field, rather than calling the dialog from a mouseEnter event. There are AcroDialog examples on the forum.

There are also examples of showing/hiding pages.

Good luck,

Niall

Avatar

Former Community Member

Ok. I am unfortunatelly not competent to choose definitive solution, I only need to explore possibilities.

My last questions about this:

1) is there in pdf (and in LC Designer) some low level component like canvas, which could be placed to a form and that would support 2D graphics methods ? i.e. is there a way how could be the tooltip rendered from scratch but still on the form together with "higher-level" form components ?

2) Is it possible to set to a container of text the value so, that the value would contain some markup ("<bold>bold me</bold>") and therefor the resulting text would be rendered with formating ? (Someting like documentElement.innerHTML = '<b>foo</b><i>bar</i>'; )

Thanks.

Avatar

Correct answer by
Level 10

Hi,

In Acrobat and LC Designer you can set the value and appearance of an object at runtime. But it is difficult to achieve the same effect that you can get in Flash/HTML.

The closest to a canvas would be a subform, as it is a basic container. But then you are basically back to a textfield with a scroll bar and validation script. You can hide the textfield/subform when it is not needed. The sample above would be an example.

You can set a textfield as rich text in the Object > Field tab, so that the user can hit Control+B for bold, but I am not sure if you can script to have specific words bold at runtime. 

The tooltips in the accessible tab are fine for a few lines. After that you need to look at other solutions.

Here is a form where I uses tooltips AND an area shaded blue under the fields for additional guidance.

Acrobat1.png

As the user hovers over each field, the text in the blue shaded area changes, supporting the tooltips.

There was one field that required a significant amount of information, so for that field, the ones on the left are hidden and a map is displayed.

Acrobat1.png

There are several ways of achieving this and each one will have advantages and disadvantages. For example the dialogs will give you great control over a read only scrollable text, but because it is modal it will be disruptive to the user in clearing the dialog.

Hope that helps,

Niall

Avatar

Former Community Member

Thank you very much for patient reply Niall,

how did you make the blue shaded area ? Is it an image and text rendered over it ?

( This whole document looks very nice and professionally ).

I didn't know, that the textfield supports formating other way then formatting whole text in one style.

I tried to modify directly the xml source, in which can be placed e.g. " ... here goas <span style="font-weight:bold;">bold</span> ..." and it works great. It is possible then hide the border of textfield and place it on some colored rectangle / image and it looks good and textfield provides us the scrollbars.

I try to find some programatic way, how to set that text at runtime and I think it should be what we have searched.

Thanks!

Avatar

Level 10

Hi,

The shaded area is just a multi-line textfield with a background fill.

You do not need to script this in the XML source, you can set this in the Design view. Sometimes it is handy to tweak things in the XML Source, but generally not recommended.

Select the textfield and select an option in the Appearance dropdown in the Object > Field tab:

Parallels Desktop1.png

Then you can set the border and fill properties and you have full control over the RGB colours:

Parallels Desktop1.png

The text appearance is set in the Font tab. In my example all of the text has the same weight.

You can change the appearance of objects at runtime, but these tend to be applied to the whole object. There is a sample here: http://assurehsc.ie/blog/index.php/2010/06/laying-out-a-form/

I hope that helps,

Niall