AJUI_Tip must be placed in the component folder (Components) of your application.

In this section, we describe the sequence of operations to be performed in order to generate a simple Tip in the context of the main form.

AJUI_Tip has a shared form (container) that is used to visually create all the elements of the Tip. However, it must be made available on the main application form. For this, AJUI_Tip needs a subform object that will serve as a model. This object is provided with the AJUI_Library that you can open from your application (/File/Open/Object Library...) and you just have to drag & drop the "subform Tip" object on your main form.

Why is that necessary? Because when you want to display a Tip with the "Show" method, the component will use the name passed in properties to see if a Tip object corresponding to it already exists. If this is not the case, it will duplicate the template subform you have already added and it will associate an instance of the shared form to it.

So, the first thing, when you have decided which form will host the Tip(s) you will use, is to add this object.

The component uses names or properties that are specific to it and that it considers to be reserved.

• AJUI_Tip_container : Name of the form shared by the component.
• AJUI_Tip_sf : Name to be used by the subform used as a template (see prerequisites).  

The first step consists in calling the initialization method (new AJUI_Tip) in order to retrieve in an object, an instance containing all the properties of a default Tip as well as its formulas. We recommend that you use the "Form" variable directly to store the current instance in order to easily navigate between your form method and those of your form objects.

The second step consists in using the formulas of your object to define the properties of the Tip instance according to your needs. The minimum consists in defining the name of a target, i.e. the form object, to which the Tip instance will be attached. It is also possible to define precise coordinates if necessary, if the tip does not apply to a 4D form object. Then you need to define a name that will remain associated with the Tip instance. And finally make sure you define a text to display. This text can be multi-style text, it will be possible to put words or letters in bold, italic or color inside a text box.

$evt:=Form event code
Case of
  :($evt=On Load)
  
  Form.tip:=New AJUI_Tip

  Form.tip.TargetName("test_tip")
  Form.tip.TipName("Test")
  Form.tip.TextLabel("Hello world")
End Case

Finally, you must use the "Show" formula to launch the generation of the Tip instance. For example, do it on one of your form objects with an "On Clicked" event.

$evt:=Form event code
Case of
  :($evt=On Clicked)
  
  Form.tip.Show()

End Case

If the previous steps have been properly followed, you should see your Tip.

The steps in this chapter are the same except that it is possible to associate a form rather than text in a Tip. To do this, use the "SubformName" formula to associate the name of the form of your application you want to display in the tipBox with it.

It is not possible to define the display of a text AND a form in a Tip and therefore in such a case the component will use the form first. ⚠️ Be careful when displaying a form, it disables fade in and fade out effects.

AJUI_Tip provides users with the ability to animate a tooltip. (see chapter on life cycle).

Currently, the component allows the following animations to be created:

• Fade in
• Blink
• Jump
• Fade out

Fades have their own animation cycle so it is possible to activate them all. On the other hand, the other animations have a common cycle so only one can be added to the fade effects.

Let's move on to the implementation of the animations. We assume that you have prepared your tooltip as described in the subchapter "Setting up your first Tip". All that remains is to define the properties of the animations you want to apply.

The implementation of these two effects is about the same. It is necessary to activate the effects (activateFadeIn, activateFadeOut) using the formulas. It is also possible to specify the duration of each effect.

Form.tip.ActivateFadeIn (True)
Form.tip.ActivateFadeOut (True)

Form.tip.TimerFadeIn (3000)
Form.tip.TimerFadeOut (300)
Form.tip.TipDuration (3000)

Form.tip.Show()

To set up the blink effect, three properties must be defined, including a mandatory one (BlinkNumber) that defines the number of cycles of the effect (a value of zero will not activate the effect). The other two properties concern the duration of a cycle as well as the proportion of time allocated (in percentage) to its visibility.

Form.tip.BlinkNumber (5)
Form.tip.BlinkDuration (1000)
Form.tip.BlinkOn (50)

Form.tip.Show()

The setting of the jump effect is similar to that of the blink effect. It requires at least to specify the number of cycles of the effect. It is also possible to modify the duration of a cycle, the distance to be covered by the jump and the distribution (in percentage) of the duration between the first phase of the jump and the second phase.

Form.tip.JumpNumber (3)
Form.tip.JumpDuration (1000)
Form.tip.JumpOn (50)
Form.tip.JumpOffset (20)

Form.tip.Show()

It is recommended to use a different container for each different tip. A tip is different when its tip name is different. If you define an "info" tip and then an "alert" tip with specific properties, it is recommended to use a container specific to each of these definitions to avoid instance conflicts during animations (e. g. Form.info and Form.alert).

Since V18R3, you can replace the returned instance by New AJUI_Tip with the call of the Tip class. The functions of the Tip class use the same names and parameters as for the formulas obtainable by New AJUI_Tip. The default values are also the same.

The only difference in terms of code is when the instance is created:

  //with formulas
    $myTip:=new AJUI_Tip ()

  //with class
    $myTip:= AJUI_Tip.new ()