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 enease working 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 point the upper left corner of the area you want to select on the layout canvas, drag the mouse and point 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 appearing after clicking 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 willbe available inthe 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 may have misinterpreted the element as being small or large, 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 above described actions will apply to all selected elements. Additionally to 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 other than a container, you may opt to capture the underlying content when transforming the layout in view. While OCR scans should perform well, keep in mind that captured underlying images may result blurry, depending on the resolution of the original image.

In many occasions, like for 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 typew of the selected element in the lower part of the options popup you may define a few main options for the future HTML element.

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 ()