Agile Toolkit forms may have several classes applied on them to change the way how they look:
This class will make labels appear on top of input elements.
For non-stacked form, this will slightly increase width of the label field.
Each field of a form is wrapped inside a div with class atk-form-row. This is defined in template form.html. This class will align label and input element properly. Additionally the row div may have .has-error class. This will make label red and will also highlight the field.
Placing <ins> element inside field's row will produce a gray "hint" next to the field. To add this field in the form, use the following code:
$form = $page->add('Form');
$field = $form->addField('line','test');
Form field can have some additional HTML added above or below it. In HTML it's done by placing code either before or after input field or div.input-row. In PHP you can do this by calling $field->abovefield() and $field->belowField(); Those methods will insert and return an element which you can change the way you see fit:
In several cases you would want to have a button linked with the field. In the HTML, this requires wrapping input field inside <div class="input-row">. You can explore the actual markup on the "playground" page. The PHP code for a similar operation looks relatively simple
$button = $field->addButton('Hello');
Second argument to addButton() can be either "before" or "after" and is "after" by default. There are also functions afterField and beforeField() which work similarly to aboveField()/belowField()