Hatthi

Layouts are not automatically saved. Clicking on the save button () will store the current changes for future editing.

Layouts show two different group types - small and large. To make it easier to work with them without interfering with each other, Hatthi offers a toggle view, to switch between them. Click on the small group check () to view and edit small groups and on the large group check () to work with large ones.

It may be useful to select more groups at once. To do so, click on the selection button () and then click on the upper left corner of the area you want to select on the layout canvas, drag the mouse and click on the bottom right corner to define the selection area.

You may optionally want to define new groups on the layout canvas, which were not detected by Hatthi. To define a generic group, just click on the draw button () and draw the group on the canvas starting from the upper left corner and pointing the bottom right one.

Additionally you can draw specific group types directly by selecting one of the following from the menu that appears after clicking on the more options button

• Text
• Image
• Link
• Button

To help you better design a layout, the image from which the layout was generated is displayed as the background of the layout canvas. There may be situations in which you prefer not to view the background image. Toggle the background visibility check ().

When the layout definition is complete you'll want to transform it into a view. By clicking the confirmation button () the layout will be stored as a view and will be available in the views list.

There are various actions available when selecting a layout element.

To change the element type, click on one of the 5 available types: container(<div>) - default, text(<p>), image(<img>), link(<a>) and button(<button>).

Hatthi might misinterpret the element as being small or large, so you can change its definition by clicking the large group button or the small group button accordingly.

To delete the element click the delete button ().

By selecting multiple elements all the actions described above will be applied to all selected elements. Additionally, two more actions are available.

You may group multiple elements together in a element that contains them all by clicking the group button ().

When selecting an element which is not a container, you may opt to capture the underlying content when transforming the layout into a view. While OCR scans should perform well, keep in mind that the captured underlying images may end up being blurry, depending on the resolution of the original image.

On many occasions, like when working with texts, Hatthi will consider each letter as an element. In this case you may select all the letters and "glue" them in a single element by clicking the glue button ().

Based on the type of element that was selected, you may define a few main options for the future HTML element in the lower part of the options popup .

You may choose a (background) image and a background color () for containers and images.

For texts, links and buttons you may set the font size and unit, the font style and decoration and color () as well as the background-color ()