Development environment

A framework control project is created within a solution in Visual Studio. Multiple framework control projects and associated HMI projects can be placed in a solution. A framework control project can be configured using the standard Visual Studio functions (for example, Build Solution).

A framework control project contains the following elements when it is created:

Development environment 1:
  1. References: This project node is not required and is automatically provided by the project type in Visual Studio.
  2. Icons: This folder contains all icons relating to the control.
  3. Icon: The .png elements are control icons in different sizes.
  4. Schema: This folder contains JSON schema files that are required for the control. Additional JSON schema files for project-specific data types can be added to this folder.
  5. ControlDescription.Schema.json: Standard schema describing Description.json.
  6. Themes: This folder contains all themes relating to the control. New themes can be added to this folder.
  7. Base: This folder contains the base theme of the control. Additional theme-based files can be added to this folder.
  8. Image: This folder serves as a container for images that are assigned to the base theme.
  9. Style.css: This stylesheet file contains the properties for the base theme.
  10. Description.json: This file contains all Engineering interfaces for the TwinCAT HMI
  11. Mainfest.json: This file describes control data required for creating a TwinCAT HMI package.
  12. Source.js: This file contains the JavaScript logic required for the control.
  13. Style.css: This file contains all style properties that are to apply to the control regardless of the theme.
  14. Template.html: This file contains the static HTML framework of the control and is included in the HMI as HTML code for the control during subsequent instantiation on the HMI.
Development environment 2:

Please note from version 1.8

To program framework controls, a full version of Visual Studio is required for editing the HTML, CSS, and JavaScript code. The Visual Studio shell is not sufficient.