Data Set Creation

Data Sets can be created by hovering over any Data Structure and clicking the ⊕ (Create) icon:

Using this method, unlimited amounts of parallel Data Sets, each with unique Data Values can be created:

With the Data Sets created, their Values can then be populated using the techniques outlined in 📑 Data Set Population.

Data Set Assignment

For any Data Set and its Data Values to be served to the interface it powers, it must first be made available through assignment. In most cases when developing interfaces, a Data Set is assigned to a specific scope (such as to an entire Page, or to the root of a Template).

Noesis Studio offers a quick and convenient method to quickly perform this operation by hovering over any created Data Set, and clicking the ⌂ (Home) icon. This will automatically assign it, and make it available to all Elements within the selected scope.

Once this assignment has been set, it will be evidenced by a blue badge, visible on both the assigned Data Set within the 📘 Data Panel, as well as on the Root element within the 📘 Navigator Panel that the Data Set was assigned to.

It is important to note that only one Data Set can be active at a time, and that assigning a different Data Set than the one currently assigned, will automatically unassign the previous one in the process. This makes it incredibly easy to quickly jump back and forth between multiple Data Sets.

Any currently-assigned Data Set can be unassigned by hovering over it and clicking on the ☍ (Unassign) icon.

Data Set Population

With one or many Data Sets created, their Values can be easily modified by selecting a Data Set from the 📘 Data Panel. This exposes its 📘 Properties Panel from where its individual Data Values can be freely edited:

When manipulating any Data Sets containing Collections, additional items can be added to the array by clicking the + (Add) icon at the top-right of the Data Set Properties Panel:

An individual member of the collection can be duplicated or removed by hovering over it, clicking on its ⋮ (3-Dot) menu icon, and selecting the desired operation:

Data Generation Properties

To maintain a level of control over the Values produced by the Sample Data Generation, each of the 📘 Data Structure Properties contain an expander which can be opened, and from where the constraints of the Data Values generated can be set. The options available for each depend on which Data Type was assigned to each Data Property.

In the example above, the generator will produce:

• A number between 1 and 128 (with no decimals) for the Number Data Property.
• A text string between 1 and 4 words for the String Data Property
• A random roll as to whether the Boolean Data Property is set to 'Checked' or 'Unchecked'.
• A random image from a pre-defined folder of bitmaps.
• A random opaque solid color brush from the entire spectrum.

Data Generation

Once the Data Generation constraints for each Data Property are set, the Generation can then be run either by hovering over a Data Set, and clicking on its 🛢(Generate) icon. Alternately, a Data Generation can be started by selecting a Data Set from the 📘 Data Panel, and clicking on the from its 🛢(Generate) icon in the upper-right of its 📘 Properties Panel.

The Values output by the Sample Data Generation can be manually overwritten at any time following the techniques outlined in 📑 Data Set Population

Binding Types

A Data Property can be bound to a compatible Element Property by hovering over it, clicking on its ⋮ (3-Dot) menu icon, and selecting one of the two Binding types:

☍+ Create Binding uses one Data Property to relay a single Data Value to the Element's Property:

In the example above, the Data Value of the Speed Data Property is rendered in a TextBlock's 'Text' Property.

☍+ Create MultiBinding allows multiple Data Properties to be mixed, to relay a composite output to the Element's Property:

In the example above, a ('Current Fuel Level') Fuel Data Value is subtracted from a ('Full Tank') Fuel_Max Data Value to output what amounts to displaying a 'Fuel Consumed' value within a TextBlock's Text Property.

In MultiBindings, the Path field corresponds to the name of the Data Property.

Additionally, referencing each Binding is performed in written formats using {0} for the first Binding, {1} for the second Binding, {2} for the third Binding, and so on and so forth. This allows them to be used in powerful and creative ways to generate brand new outputs.

Single Binding

To bind an Element's Property to a single Data Property, once a 📑 Binding Type has been selected from the Element Property's ⋮ (3-Dot) menu, within the 'Context' tab, the 'Path' toggle can then be clicked to expand and expose the list of Data Properties to select from. Clicking any Data Property in the list instantly binds it to the Element's Property.

Collection Binding

Noesis Studio includes a wide selection of 📘 Collection Elements which become particularly powerful when paired with Data Collections.

Among their most salient features, Collection Elements are able to procedurally display the individual members of a Data Collection as an array in an automated fashion:

In the example above, each character tile is automagically generated from a single 'tile' Template (which internally contains Data Bindings). The amount of characters displayed on-screen, as well as the unique content of each is fully controlled by the attributes of the Data Collection itself.

Binding a Collection Element to Data is a two-step process:

In the first step, the Collection Element itself is bound to the Data Collection itself:

Once a 📑 Binding Type has been selected from the Element Property's ⋮ (3-Dot) menu, within the 'Context' tab, the 'Path' toggle can then be clicked to expand and expose the list of Data Properties to select from. Clicking any Data Collection in the list instantly binds it to the Collection Element's Property.

In addition to populating the Collection Element with the Data Collection's individual members, it also provides access to the Elements within the Template to access this Data too.

In the second step, Elements within the Collection Element Template are then bound to a desired Data Property.

This can be done using the same method outlined in 📘 Single Binding, and selecting the assigned Collection's appropriate Property from those exposed to the internals of the Template in the first step:

Advanced Operations

One particularly empowering feature of Bindings is the ability to add another layer of configuration to the output of the relayed Data at the destination. Some features and capabilities include the ability to:

• Apply custom formatting rules to the value that will be displayed or used, such as setting number of decimals, or enabling advanced concatenation.
• Apply Converters, such as being able to change a Data Value with math, or setting a specific letter casing.
• Setting whether the Data Value only Reads the Data Value, or if it is also capable of writing to the Data Values too.

These advanced options can easily be accessed by opening the expander at the bottom of the Binding Selector: