Concept provides a mechanism to edit a data model effortlessly. To illustrate this mechanism, we will use the machine model shown below.

The first step is to implement your model - for instance the upper one -  using the explanations of chapter designing and implementing a model. As soon as the UML diagram is implemented, you are almost ready to use the automatic edition feature of Concept. The final step is define the ConceptEditor control in your XAML.

<concept:ConceptEditor x:Name="Editor" DataContext="{Binding Path=Machine, Mode=OneWay}" IsExpanded="True"/>

The picture below shows the automatic edition view generated from the data model. Without creating any specific view, ConceptEditor offers the possibility to navigate through the Concept object tree and edit each object with the default views provided by Concept.

ConceptEditor

ConceptEditor is a control which is able to display the entire hierarchical model from a given root (Machine) and edit the selected item. The discovery of the Concept object tree is facilitated with the help of the ConceptContainer which enables creation and navigation through a hierarchical model.

On the left-hand side of the screen, the Concept object tree is displayed. When an object is selected in this tree view, the edition view for this object is displayed on the right-hand side of the screen.

If the selected item has no custom view defined, Concept automatically provides a default view.

Default View provided by Concept Hmi

By default Concept Hmi provides a view which contains an editor for each property declared inside a component. The right property editor is automatically chosen based on the property type.

To explain how the default view works, we will use the machine class below. This class contains four properties and several attributes provided by ConceptHmi. We will see the impact of these attributes have on the default view :

• ConceptName : Defines the display name of the component . Available on class or property. 
• ConceptSmallImage and ConceptLargeImage :  Sets a small and large image to display next to the component. Available on class.
• ConceptSerialized : Adds the property to the concept serialization mechanism. With this attribute, the property is automatically visible in default view. Available on property.
• ConceptViewVisible : Defines if this property should appear in the default editor view. Available on property.
• ConceptDefaultValue : Sets the default value of the property. Available on property.

To make the display name of an element translatable use the IntlConceptName attribute instead of ConceptName attribute. For more information see translating a complete application.

To work with vector images replace ConceptSmallImage and ConceptLargeImage with ConceptVectorImage.

[ConceptName("My Machine")]
[ConceptSmallImage(typeof(Machine), "/Images/Machine32x32.png")]
[ConceptLargeImage(typeof(Machine), "/Images/Machine64x64.png")]
public class Machine : ConceptComponent
{
    [ConceptSerialized]
    public string Description {get; set;}

    [ConceptViewVisible]
    [ConceptDefaultValue("1.0.0")]
    public string Version {get; set;}

    [ConceptViewVisible(true)]
    [ConceptName("Is Working")]
    public bool IsWorking1 { get; set; }
    public bool IsWorking2 { get; set; }
}

Below, you can see the default view provided by ConceptHmi for the machine class above.

Each basic Concept component has its own default editing view. In this section we will explain how these views work. These views are also used by default by the ConceptEditor.

ConceptDynamicComponent View

ConceptDynamicComponent enables us to create an optional polymorphous composition. In this example, the component allows the selection of a tool.

The default edtion view of a ConceptDynamicComponent enables us to define a tool of a selected type and clear the current tool. When a tool is defined, it is accessible in the tree view of the ConceptEditor and can be selected to edit its properties.

ConceptStaticList View

ConceptStaticList enables us to manage elements of the same nature. In this example, we have a list of MachinePoint

The default edition view of a ConceptStaticList enables us to add a new element, remove the selected element, clone the selected element and move the selected element in the list. Each element of the list is accessible in the tree view of the ConceptEditor and can be selected to edit its properties.

ConceptDynamicList View

ConceptDynamicList enables us to manage elements of different nature but which inherit from the same abstract class. In this example, we have a list of MachineElement

The default edition view of a ConceptDynamicList enables us to add a new element of a chosen type, remove the selected element, clone the selected element and move the selected element in the list. Each element of the list is accessible in the tree view of ConceptEditor and can be selected to edit its properties.

 ConceptSingleLink View

A ConceptSingleLink enables us to link an element to another element. In this example, we create a link between a Robot and an Axis

The default edition view of a ConceptSingleLink enables us to select an Axis contained somewhere in the model.  To select the element to link, press the button with the three points located on the right. A pop-up opens and lists all the axes available to be linked contained in the model. Select the axis of your choice and click Ok to set the linked element.

ConceptMultipleLink View

A ConceptMultipleLink enables us to link an element to other elements. In this example, we create a multiple link between a Robot and Axes.

The default edition view of a ConceptMultipleLink enables us to select axes contained somewhere in the model.  To select the elements to link, press the button with the three points located on the right. A pop-up opens and lists all the axes available to be linked contained in the model. Select the axes of your choice and click Ok to set the linked elements.