Introduction To Data Bindings In C++ Cross Platform Apps

What are LiveBindings? How can I create LiveBindings in C++ Builder FMX applications? How can I use LiveBindings in C++ Cross Platform Apps? What are the LiveBindings Visual Components? Is there a simple LiveBindigs example for C++ Builder FMX applications? Let’s answer these questions.

What are C++ data bindings?

C++ Builder comes with the LiveBindings feature which is a data-binding technique supported by both the VCL and FireMonkey frameworks in RAD Studio. LiveBindings is an expression-based framework, which means it uses bindings expressions to bind objects to other objects or to dataset fields.

There is an official DockWiki web page by Embarcadero about the LiveBindings here, please check this official link if you want to see latest changes. Let’s copy some of parts from there and give a simple example,

How do LiveBindings work in C++?

LiveBindings is based on relational expressions, called binding expressions, that can be either unidirectional or bidirectional. LiveBindings is also about control objects and source objects. By means of binding expressions, any object can be bound to any other object, simply by defining a binding expression involving one or more properties of the objects you want to bind together. For example, you can bind a TEdit control to a TLabel so that, when the text changes in the edit box, the text of the label is automatically adjusted to the value evaluated by your binding expression. Another example is binding a track bar control to a progress bar so that the progress rises or lowers as you move the track bar.

We can connect to dataset fields, alter one or more properties of different objects, and so on. Because LiveBindings propagate, we can even alter properties of objects that are connected to other objects that are bound to a control object.

Is there a simple example of using LiveBindings?

With the RAD Studio C++ Builder, you can directly bind components visually. In general you can bind each element of a component with another element of a component. You just need to right click to a visual component that you want to bind.

1. How to bind FMX Components visually?

In general you can bind each element of a component with another element of a component. We just need to right click to a visual component that we want to bind. Let’s create a new C++ Builder VCL Windows application, drag an Edit (TEdit) and Label (TLabel) components from palette to your form and right click to a Label1 component, you will the pop-up menu and click to “Bind Visually…” menu as below,

You will see that LiveBindings Designer window is opened with the visual components listed as below,

2. How do I link LiveBindings members together?

In this LiveBindings Designer,
Here we can select all component by clicking the top bar of the component or you can select members of component that can bind with another member of the component. In this example we will bind Edit->Text property with Label1->Text property. Thus, if we do any change in the Text of Edit1 this will be automatically copied to Text of Label1. To do this, select Text of Edit1 and drag to Text of Label1 as below,

You will see a link moving with your mouse movements and the Text is now in Green fill color that means Text property is Bindable with the Text property of Label1.Now you can release your mouse button to create a link between Text and the Text. You will see your line will be changed to arrow.

3. How to run FMX Applications with LiveBindings?

Livebindings are automatically comes with your applications. Now we can run our simple application with live bindings, press F9 or choice Project->Run menu to run your application. When you change your Edit1 and press Enter key you will it is copied to the Text of the Label1 as below,

4. How do I delete a link in the LiveBindings designer?

We can easily select the link that want to delete and then you will see it is selected, you can use right click and the “Remoe Link” menu to delete or you can simply click Del key to delete them.

5. How can I see more bindable properties?

Note that components have a lot of properties and methods, here listed basic properties. If you want to see more properties just left click to “…” at the bottom bar of the listed component in the LiveBindings Designer.

6. How do I drag components and links in LiveBindings?

You can easily drag listed components in the LiveBindings by using their top bar, drag them as you drag windows. You will see their links will be extended automatically, you can also drag links your proper positions for the better view.

7. How do I zoom in, zoom out, rearrange, fit, and restore the LiveBindings view?

In LiveBindings Designer, there is right bar with small icons. You can easily use these to zoom in, zoom out, rearrange items, fit the view into the window and restore the LiveBindings view.

A summary of using LiveBinding in C++ apps

This is a very simple FMX example about how you can use LiveBindings with components. There is an official DockWiki web page by Embarcadero about the LiveBindings here, please check this official link if you want to see the latest changes.

Note that you can bind each members of this to any Data components too. For example USERNAME to Label2->Text, AGE to Label3->Text. For more detailed examples please check Database Section of LearnCPlusPlus.org and DocWiki of Embarcadero. There are many official and 3rd party components that supports many ways to display your data.

C++ Builder has a lot of components and ways to connect different databases and to visualize results with many components like TTeeChart, TViewport3D, … and as a 3rd party components TMS components etc. RAD Studio 11 have new updates on the most of these kind of components while it is just released. Embarcadero and 3rd party component developers are updating these tools. They can be updated by using GetIt Package Manager easily.

C++ Builder is the easiest and fastest C and C++ IDE for building simple or professional applications on the Windows, MacOS, iOS & Android operating systems. It is also easy for beginners to learn with its wide range of samples, tutorials, help files, and LSP support for code. RAD Studio’s C++ Builder version comes with the award-winning VCL framework for high-performance native Windows apps and the powerful FireMonkey (FMX) framework for cross-platform UIs.

There is a free C++ Builder Community Edition for students, beginners, and startups; it can be downloaded from here. For professional developers, there are Professional, Architect, or Enterprise versions of C++ Builder and there is a trial version you can download from here.