Overview General parameters


Properties widget

The properties window first shows the entries that every control element has, below them the parameters of the respective element. Not every entry appears with every element – the text alignment for instance only where text is displayed.

Page, default parameters and element

Page The button Properties... opens the dialog with all properties of the visu page, see Properties Page. It can also be used when no control element is selected at all.
Default parameters The button save remembers the current settings as the default for new control elements of the same type. Stored are transparency, background, text alignment, offset, zoom, width and height as well as the parameters of the element. The defaults apply to all projects, they are kept on the computer and not in the project.
Element With lock the control element can no longer be moved or resized with the mouse. Handy for background elements that you otherwise keep catching while working. Through the fields size/position it stays changeable.

Transparency

Transparency Slider and input field, range 0 to 100. 100 means not transparent, 0 completely transparent. Depending on the control element not all parts are displayed transparently: with the element Text static for instance the background becomes see-through, but the text does not.
Background If the box is ticked, the background area of the control element is drawn. Without the tick it stays completely free, so the page shows through – independently of the transparency.

Size/position

Position X / Position Y Position of the upper left corner in pixels. The value refers to the page size before the zoom factor is applied.
Width / Height Size of the control element in pixels, also before the zoom factor.

Text alignment (visible depending on the control element)

Horizontal Left, centred or right.
Vertical Top, middle or bottom.
Offset X / Offset Y Moves the text away from that alignment, given in percent of the width respectively height of the control element. Negative values move to the left respectively upwards. Because the value is a percentage, the text sits in the same place on every screen.
Zoom type
  • Automatic: The text is fitted into the available area automatically.
  • Height: The text is scaled by the height of the control element. This makes sense when elements are arranged in a list view – single-line and multi-line texts are then displayed at the same size.
Zoom value Zoom factor in percent, 0 to 200. It allows the calculated font size to be adjusted.

Frame

Type
  • Flat: Flat frame. Only here can the four sides be selected individually.
  • Raised rectangle: Frame in a raised representation with a shadow.
  • Raised gradient (test): as above, but with a colour gradient. This representation is still being tried out.
Line Thickness of the frame line. 0 means no frame.
Round corners Rounds the corners, given in percent of the shorter side of the control element (0 to 100). The row only appears with elements that support rounded corners.
Colour Frame colour. The flat and the raised frame each have their own colour.
Left, Right, Top, Bottom Only with the type Flat: here it is set on which side the frame is drawn. That way only a separating line at the bottom can be shown, for instance.

Properties Page


The page properties are shown in a dialog of their own. It appears when a new page is created and can be reopened at any time with the Page - Properties... button in the properties window or with the Properties entry in the context menu of the page list. All settings are on the left, a preview showing every change immediately is on the right. The selection below the preview lets you pick a target screen to see how the page is fitted on the device later. With Apply the page behind the dialog is redrawn without closing the dialog.

Several sections have the Transfer to pages button. It transfers the settings of that section to all or selected other pages. With To all pages you can choose whether horizontal, vertical or all pages are meant - the orientation of the current page is always suggested.

The Template section sets size, orientation and grid of a page in one step. Templates apply to all projects, can be edited and can be passed on as a file.

General

Title
Title of the page
Orientation
  1. Full screen horizontal/vertical: With this orientation the visualization page is scaled so that it fits into the screen without deformation (keep aspect radio). This orientation is suitable for tablets that are kept horizontal.
  2. Height (vertical scrolling): This orientation uses the entire available width of the screen and scales the height. The height is then scrolled. This orientation is suitable for mobile phones if they are held vertically (e.g. List mode).
Show gridShows a grid while editing the page as a placement aid for the block controls. The setting also defines the view that newly added block controls on this page are preset to: without grid with a header, or with grid without a header. The view can be changed individually on every control.
Columns / RowsNumber of tiles of the grid. The tiles are square and fill the width of the page between a margin of 8 pixels. Vertically they are centred between the header and the footer.
Header / FooterHeight of the header and the footer as a percentage of the page height. A newly added "Block page header" or "Block page footer" control gets this height, all other block controls the size of one grid tile.
Snap gridStep size in page pixels a control snaps to when it is moved or resized. 0 switches snapping off. When the tile size of the grid changes, the value is scaled by the same ratio so that a block control still lies exactly on a tile. Projects that do not know this setting yet use the value that was set globally so far.
Transfer to pagesTransfers the grid of this page (show grid, columns, rows, header and footer, snap grid) to all or selected other pages.
Allow zoomAllows the page to be enlarged on the target device with two fingers.
Expand page to full screenThe page uses the entire screen area instead of being fitted proportionally. The page images follow their own settings "Zoom to page" and "Zoom proportional" - a background image without "Zoom proportional" therefore reaches the edge of the screen and covers the otherwise black borders. The controls remain proportional and centred, exactly as the page was created. The effect is only visible on the target device, nothing changes in the editor.
Stretch controls as wellOnly effective if the page is expanded to the full screen. Defines what the controls are aligned to. Their aspect ratio is preserved in every case, a round element stays round.
  • Do not stretch: The controls stay proportional and centred, exactly as the page was created.
  • With page: The controls are distributed over the entire screen area.
  • With background image or With overlay image: The controls follow exactly the scaling and alignment of that image and therefore still sit over the same spot of the picture. If the image contains a floor plan, the controls stay in their rooms. If "Zoom proportional" is active for the image, the controls also move proportionally only.
Enlarge controls as wellOnly effective if the controls are stretched. Without this option they keep their size and only the spacing between them grows. With the option they grow undistorted with the gained area; controls placed close together may move into each other.
Address page visibleAddress in the format x/x/x which is set to 1 as soon as the page becomes visible and to 0 when the page is left.
Transfer to pagesTransfers the general settings of this page (allow zoom, expand page, stretch controls, address) to all or selected other pages. Title and orientation remain unchanged on the target pages.
User With this option a user can be assigned to the page, see user management. With Transfer to pages the user selection can be applied to all or selected other pages.

Size

width / height Here you can set the height and width in pixels, but this is only used to determine the aspect ratio. If the target device has a higher or lower resolution, it will always scale into the available range without distortion.
ProportionalIf this option is active, the width is always changed correctly in aspect ratio when the height is changed.
width / height (hidden area)Enlarges the working area in the editor beyond the page size. Controls can be parked there without being visible on the target device.
Transfer to pagesTransfers the size of this page to all or selected other pages.

Colour

Background Here you can specify the color for the background.
FrameColour of the borders that appear when the target device has a different aspect ratio than the page: same as the page colour, or black. If the page is expanded to the full screen, these borders are no longer visible.
Transfer to pagesTransfers the colours of this page to all or selected other pages.

Background image / Overlay image

A page can show two images on top of each other. The background image lies behind the controls, the overlay image above them. Both areas have the same settings and are independent of each other. A typical setup is a wallpaper as background and a transparent floor plan as overlay.
Image
Selection of the graphic, see Graphic Import
Horizontal / Vertical
Alignment of the image on the page. Only effective as long as the image does not fill the page completely.
Zoom to page
With this option the image is scaled to the page size. Without the option it is shown in its original size.
Zoom proportional
With this option the image keeps its aspect ratio and is fitted without distortion; borders may remain free. Without the option it is stretched over the entire page area. This is exactly how a background image is stretched across the whole screen together with the option "Expand page to full screen".
Offset X / Offset YMoves the image by a percentage of its own width or height.
Factor width / Factor heightAdditional enlargement or reduction of the image in percent.
Common factorIf this option is active, factor width and factor height are always changed together.
Transfer to pagesTransfers the image of this page including alignment, zoom and offset to all or selected other pages.