Skip to content

2. Button types

Gary Criblez edited this page Feb 14, 2020 · 1 revision

AJUI_Button offers two main types of buttons.

  • Simple button
  • Composite button

A simple button is a rectangle whose corners can be rounded or a circle containing text OR a picture.

A composite button is a rectangle whose the corners can be rounded or a circle containing text AND a picture. The picture and text are placed according to the area allocated to each one, but they can also be padded together. In this case, we speak of a linked composite button. We assign a position to the picture (left, right, top, bottom). The text will be the opposite of this position.

Button anatomy

Simple button

A simple button includes a text OR a picture. Its graphic representations and geometric properties are as follows.

Text :

Picture :

Composite button

A composite button includes a text AND a picture. Its graphic representations and geometric properties are as follows.

Left position :

Right position :

Top position :

Bottom position :

Linked :

Sizing a button

By default, the button generated by the component will match the dimensions defined in the form editor. However, it is possible to redefine them using the member functions of an instance of AJUI Button.

The size of the picture can be defined with the member functions but for consistency, the component will always resize the picture if it exceeds the limits of the button or the allocated size in the case of a composite button.

The text will automatically be shortened and ended with"..." if it exceeds the limits of the button or the allocated size in the case of a composite button.