Skip to content

XE3 Visual LiveBindings: Link controls to component properties

Simple controls can be linked to component properties.   TEdit is an example of a simple control.  TLabel.Text is an example of a component property.   Controls can be linked to most public properties of any component on a form.

Link controls to component properties in the LiveBindings designer

After a TEdit and TLabel are dropped on a FireMonkey form, the LiveBindings designer represents the TEdit with the member "Text" and the TLabel with the member "Text":

The LiveBindings designer can be used to connect these members:

In the form you will notice that the value of the label has been copied to the edit.  When the link is initialized, the component property value is copied to the control to give both members the same value to start off.  After initialization, the control value will be copied to the component property whenever the user modifies the edit and presses enter, or leaves the edit.

In the LiveBindings designer, the line between the components represents a link component.  Click the line to select the component in the object inspector.

The AutoActivate property indicates whether this link should be initialized when the application is run.  This property also activates the link at design time.

The InitializeControlValue property can be unchecked to prevent the component property value from being copied to the control when the link is initialized.

Multiple links

The LiveBindings designer can be used to connect a single control to multiple component properties.

Links not permitted

LiveBindings does not permit links between component properties, such as Label1.Text and Button1.Text.

The LiveBindings designer highlights members when a link is not permitted.

LiveBindings does not permit a direct link between two user input control,  such as Edit1.Text to Edit2.Text. To achieve the same effect, link both controls to a TPrototypeBindSource field.

The links shown in this image will keep all "Text" members synchronized when the user modifies one of the edits then presses Enter, or exits the edit.

The TPrototypeBindSource.RecordCount property can be set to "1" when using a TPrototypeBindSource to provide an intermediate field.

Linking to other properties

To show additional component properties in the LiveBindings designer, click "…" to open the "Bindable Members" dialog.

This dialog populates a list with properties found by scanning the type information of the component.    Some properties are skipped because the type, such as sets, is not supported in LiveBindings expressions.  Put a check mark next to a property to show it in the LiveBindings designer.

Connecting from a control to "…" is another way to get at additional properties.  For example, drag from "IsChecked" to "…" and select the "WordWrap" property.

LiveBindings-enable component properties

LiveBindings uses RTTI to read and write component properties.  So no changes are needed to make a component’s properties linkable.

To make linking to commonly used properties easier, there is a registration method to indicate which member to show, by default, in the LiveBindings designer.   For example, RegisterValuePropertyName() is used to register "Text" as the default member of a FireMonkey TLabel and "Caption" as the default member of VCL TLabel.  See Fmx.Bind.Editors.pas and Vcl.Bind.Editors.pas.  RegisterValuePropertyName() is in Data.Bind.Components.

LiveBindings-enable controls

Controls must implement the ControlValue observer in order to support linking to component properties. My previous post has information about observers, including code for a sample control called TObservableTrackbar.    TObservableTrackBar implements the ControlValue observer, so supports links to component properties.  Here a TObservableTrackBar is linked to the "Width" property of a TShape.

{ 1 } Comments

  1. Giovanni Benintende | March 24, 2014 at 9:47 pm | Permalink

    Hello Mr. Tierney,
    Your example of property binding opens new views to my eyes. Thank you for sharing.
    I have a project with big forms using tens of TEdit components binded to dataset field sources.
    But i am unable to set the field MaxLenght property to the dataset string field size. So I have to set it manually. It’s really frustrating.
    So, my question is: Do you thing a way to do bind the TEdit MaxLength property to dataset field Size property?
    Thank you for the attention, and Best Regards,
    Giovanni Benintende

Post a Comment

Your email is never published nor shared. Required fields are marked *

Bad Behavior has blocked 26 access attempts in the last 7 days.

Close