Switch to: V12V11V10V9V8V7V6V5

Form Editor - Overview

Valentina Studio incorporates a visual form system that lets you create and deploy native forms usable by other Valentina Studio users. Any version of Valentina Studio can act as a runtime for Valentina Forms. With a rich set of scriptable objects, this allows you to create and distribute royalty free solutions on one operating system and deploy to any other supported operating system.

The Valentina Form Editor is a tool that allows you to create custom input and output forms for data sources, such as

  • MySQL
  • PostgreSQL
  • SQLite (local and Valentina Server databases)
  • ValentinaDB (local and Valentina Server databases)

The forms are stored in Valentina Studio Project files (VSP).

Creating a form with Form Editor involves specifying a data source, defining what data the form is bound to, the visual elements to display the data.

Valentina Projects can be used in different editions of the Valentina Studio:

  • Valentina Studio (free) - execute forms prepared by others
  • Valentina Studio Pro - build, modify, execute your forms

Valentina Form Editor UI

The Valentina Form Editor is an easy to use system for creating and testing Valentina Forms.

Usually, a new form appears in Form Editor prepopulated with controls that show data from the datasource defined in the Form Wizard:

Alternatively, a form can be independent of the datasource, in that case, it appears with an empty area that you can populate with visual objects:

Check out the tutorials on how to use the Form Editor.

Form Editor TAB Panel

You can open one or more forms in their own tab panel using the Form Editor.

TAB-panel with a modified form have the star “*” before the name of the panel, so you can see that this form should be saved. You can save it using standard command SAVE with shortcut CMD+S, or SAVE ALL (CMD+SHIFT+S).


A toolbar contains the buttons to switch modes and to execute a form:

  • Documentation – Shows the reference for classes, enumerations, constants that can be used in scripts.
  • Editor – Switches to the form layout.
  • Methods – Switches to the form methods where you can edit and add custom methods.
  • Execute – Executes the current form.

On the right side of the toolbar there are two comboboxes:

  • DataSource – Allows the user to select the datasource for the current form from the list of created datasources.
  • Records – Used to define a method for getting records to show in the form:
    • Table – Shows the records from one table of the datasource.
    • View – Shows the records from one view of the datasource.
    • Query – Shows the records from the user-defined query. It may include data from the multiple tables, SQL expressions, etc.

Each submenu contains the list of available items for each method.

Left Side

Form Editor - Widgets

The left side of Form Editor has at maximum three tab-panels: Palette, Inspector and Database.

  • Palette - this tab-panel contains available controls and layout management items to be used for form design.
  • Inspector - this tab-panel contains all controls and layouts of the form in a tree view.
  • Database - this tab-panel contains the structure of the database chosen as a base for this form.

Palette Tab

The Palette tab has a few sub-groups:

  • Database - the group of controls that can be bound to the table or field in the database.
  • Layouts - set of available layout management objects.
  • Widgets - set of independent controls.

Inspector Tab

The Inspector tab can be used to examine the structure of the form, select objects and open the context menus for them.

Database Tab

The Database tab is used to drag schema objects (tables or fields) right to the form.

Layout Area

In the central part of the Form Editor, you can see the shaded area to design a form layout. When you click this area you select a form object itself. In the Property Inspector, you will see properties of this form. You can also right-click this area to see the contextual menu for the form object.

You can change the size of the form dragging circle markers at its bottom and its right side.

Property Inspector

On the right side of the Form Editor, you can see the Property Inspector, which displays properties and signals of a selected object.

There are several different versions of Property Inspector for working with properties of controls, layouts and objects, each described in detail as Custom Property Inspectors.


The most frequently used properties can be modified within a Property Inspector:

 Valentina Forms Property Inspector

Other properties are accessible programmatically. Complete list of properties can be found in the JavaScript reference within the Valentina Studio.


Signals and slots are used for communication between objects. A signal is emitted when a particular event occurs. Controls have many predefined signals:  Valentina Forms Property Inspector

The signals are grouped by the parent class names from who they were inherited.

A slot is a JavaScript function that is called in response to a particular signal.

If you need to respond to some signal of the form control – it is necessary to define a slot. It can be done in two different ways:

  • Using the built-in script editor of the Property Inspector.
  • In the JavaScript code using the connect method of the control.

The signal may provide additional information to the slot, for example, when LineEdit's textEdited signal is emitted a new text is passed to connected function-slot. Access to arguments is available through the arguments array of the slot (arguments[0], arguments[1], etc).

Information about available signals can be found in the JavaScript reference within the Valentina Studio.