This page is is for application designers who need to create forms. It explains techniques for associating label text with a data field.

Overview

PhixFlow has different components that you can use to add text to a screen.

For specific text that you want to show on a screen, use a static text field.
For text that changes depending on a selected record, use a dynamic text field linked to the attribute in a grid.
For the labels on data fields, use labelled fields.
For a clean form, where an empty field displays its name or instructions to the user, use the static text field property Place Holder Text.

When you are designing a form, first add a form component. The form component is the container for all the data fields and labels; see Understanding Components and Layouts. You bind the form component to a stream or view; Showing Data on a Screen. This tells PhixFlow what attributes are available to display in data fields or labels.

Opening the List of Attributes

To open the list of available attributes for a form component:

either right-click on the form in the dashboard and select Show Attributes
or open the properties tab for a stream or view and expand the Attributes section.

Sections on this page

Adding a Static Text Label

Use a static text component to add your own text to a dashboard. This is useful for headings or instructions that you want the screen to display.

To add a static text field:

From the palette, drag a static text field component onto a form container.
In the properties, in Basic Settings → Display Text, enter the fixed text you want to appear.
Use the Style Settings section to format the text, for example to set the colour select bold or italic formatting
Save your changes.

Adding a Dynamic Text Label

You can create a label or heading that changes depending on the user-selected record, using a dynamic text component. This is useful to add headings to a form or card that change depending on the selected record. This is illustrated for a form heading on the right.

To bind the component to the attribute, give the dynamic text component the same name as the attribute.
todo-Fiona any attribute or just primary keys?
todo-Fiona anything else

This is useful to add headings to a form or card.

todo-Fiona - Name fields are often the display name for the primary key

For a Grid

Create a dashboard with a grid and form, both bound to the same stream or view.
Add a dynamic text component to the form.
Bind the component to an attribute.

For a Card

Drag a stream onto a dashboard. In the pop-up window, select the card component.
Optionally select related attributes.
In the card header, add a dynamic text component.
Bind the component to an attribute.

To bind the dynamic text component to an attribute, do one of the following:

In the dynamic text properties, give it the same name as the attribute you want to show.
on the dashboard, drag an attribute from the grid header onto the dynamic text component
open the list of available attributes and drag one onto the dynamic text component.

Illustration of Dynamic Text

A dashboard has a heading that displays the business name from the selected record.

Dashboard with grid (top) and form (below)

In the dashboard below, the first record, for the business Avaveo, is selected.

The heading is a dynamic text component. It is set to display the attribute Name from the selected record in a grid.

Both the data grid and the form are bound to a stream called Business, which includes the attribute called Name.

Stream that is bound to the grid and the form

In the dynamic text field properties, the Name property is set to Name. PhixFlow recognises that Name is an attribute. This creates a link between the dynamic text field and the attribute.

Creating Labelled Fields on a Form

For forms that display data or in which the application user can add or edit data have data fields. The easiest way to add a label to a data fields is to add a labelled field component to the form:

either by starting with data
or by starting with components from the palette.

We recommend starting with data, as PhixFlow automatically:

chooses a component that matches the attribute's data type.
names the components
binds the field to the attribute.

All the fields on a form must display data from the same stream or view. You can create a view that includes attributes from different streams, provided the streams are related: see Understanding ERDs and Views.

see Understanding Labelled Fields, below.

A form with labelled fields

Starting with Data

In the dashboard or dashboard element, to add a form container, right-click and select Create New Form.
From a list of attributes, drag an attribute onto the form container.
For the first attribute you add, PhixFlow asks you to confirm that you want to bind this form container to the stream or view.
PhixFlow recognises that you want to add fields to a form. It adds a labelled field component designed to display the attributes data.

PhixFlow uses the default labelled field, which is set in the Application properties or in System Configuration.

Where the attribute name is a good reflection of it's data, you can use this to add a label. To change the label to something that is more helpful to the application user:

Click on the data field, then click again to select the label. PhixFlow opens the label's property tab.
In Basic Settings change the Display Text, then save your changes.

You cannot drop an attribute directly onto a dashboard, dashboard element or area as PhixFlow does not know what type of component you want to add.

The default component to use when you drag attributes onto a dashboard are set in the Application properties or in System Configuration.

Starting with Components from the Palette

In the dashboard or dashboard element, to add a form container, right-click and select Create New Form. The form container has not data bound to it.
If the palette tab is not shown on the right, in the dashboard toolbar, click the Palette icon.
Expand a palette that has field or labelled field components, such as:
- Basic Components
- Labelled Fields
- Theme 1 - App Builder Base Components
- Theme 2 - App Builder Base Components
Drag components onto a form container.

Select a field or labelled field that matches the type of data that it will display.
Enter a name so that PhixFlow can save the component to the repository. For labelled fields, enter a name that reflects the label you want to see on the dashboard.
Bind the form container to a stream or view; see Showing Data on a Screen.
For each labelled field, rename the area to be the same as the name of an attribute in the backing data.
PhixFlow automatically renames the data field and displays its data. The label remains unchanged.

You have to change the labelled field name to bind it to an attribute. If you drag an attribute onto an existing labelled field, PhixFlow adds a new labelled field for the attribute.

Understanding Labelled Fields

Basic Components: individual data field and text components

Labelled fields: a composite component comprising a data field and a static text field

Components

A labelled field is made up of:

an area that contains:
- a static text field
- a data field that displays data from the attribute.

Naming

PhixFlow uses the same text for:

the area name
the data field name
the static text Basic Settings → Display Text.

When you start with data, the text is the name of the attribute.
When you start with a labelled field from the palette, the text is the name you give the component.

Properties

The area for a labelled field has the properties:

Basic Settings → Composite Component ticked
This groups the child components together. If you drag the data field, the text field moves with it: see Grouping Components.
Advanced → View Type: Field container, to link the component with an attribute.
When the area or data field name is the same as an attribute in the backing stream or view, PhixFlow display the attribute data in the field.

Illustration

In the following screenshot shows the different components of a labelled field.

The orange box highlights the containing area.
The green box highlights static text field, which has the Display text Name.
The grey box is a data field, in this case for a string.

The components are grouped together. If you drag one on the dashboard, all three components move.

PhixFlow displays the data from the Name attribute because the containing area and the data field have the same name as the attribute.

Changing Names and Labels

PhixFlow binds the data field to an attribute in the backing data that has the same name. To bind the data field to a different attribute, change

either the data field's name
or the containing area's name.

If you change the name of either the data field or the area, PhixFlow automatically:

updates the name of the other component, so the names always match
looks in the backing data for an attribute with the same name
displays data from the attribute, if there is one that matches.

The static text field is called Label. Edit the static text properties to change it's name or the Display Text.

To add additional static or dynamic text fields to a labelled field; see Changing a Labelled Field.

Setting Place Holder Text

It can be useful to display information in the field itself. For example, a labelled field could have placeholder text giving instructions to the user, such as "Add customer's request here". Placeholder text is only displayed when a field has no data to display. This means you can use placeholder text instead of a label when a form has easily-identifiable data, such as a name, address and phone number.

On a dashboard, select the field to display it's properties tab.
In Basic Setting:
- either enter the placeholder text in Place Holder Text
- or tick Use Field Name as Place Holder. PhixFlow uses field's name as the placeholder text.
Click Apply and Close.

Changing a Labelled Field

When you drag an attribute onto an area, PhixFlow adds the default labelled field

A labelled field that you add from the palette is a composite component that includes:

a container with:
- property → Basic Settings → Composite Component ticked
- property → Advanced → View Type: Field container
- child components:
  - a static text field, with properties → Basic Settings:
    - Name is Label
    - Display Text is the name of the attribute.
  - a data field that displays data from the attribute.

For information about composite components, see Grouping Components.

You may want to add another text component to a labelled field. For example, you could add:

a static text component, to explain what the user can do.
a dynamic text component, to show information from a selected record.

However, the property View Type Field container prevents additional components being added to the container. To add another text field:

From the palette, drag a static text or dynamic text component onto a form container.
In the dashboard right-click the existing labelled field and select Find in Repository.
PhixFlow opens the repository listing Layouts. In the layouts list, find the container for the labelled field and double-click it to open its properties.
In the Advanced section, the View Type is set to Field container. Expand the drop-down list and select the empty row. Apply the properties. This "opens" the container so you can add more components to it.
In the layouts list, shift-click and drag the new text component into the container. PhixFlow moves your component to be a child of the container.
Go back o the container properties to reset Advanced →View Type back to Field container and Apply and Close.

All child components are now grouped as a composite component in the container.

Field Containers

todo-fiona What is it field containers do related to sharing data...

Adding Text and Labels