Introduction

Framework controls are user-specific controls that are not created with the graphical WYSIWYG editor. Framework controls are used if the desired behavior cannot be mapped with the standard controls or a user control. Unlike a Code Behind file, a framework control can be used independently of the HMI project, so that the source code can be reused.

Technology

Framework controls are developed using web development tools.

• HTML: Type and structure of the elements of the framework control
• CSS: Design of the elements of the framework control
• JavaScript: Logic behind the elements of the framework control

Developers are no longer bound to the TwinCAT HMI controls and can use all the elements and functionalities they are already familiar with from web development within a framework control. The standard TwinCAT HMI controls are implemented on the same basis as a framework control. It is also possible to reuse the TwinCAT HMI controls in the framework control or to add user-specific properties.

Application scenarios

Framework controls can map customer-specific and application-specific requirements. The following use cases can be implemented with a framework control:

• Implementation of complex JavaScript logic
• Reusing HTML, JS and CSS in a control
• Integration of external libraries and realization of own libraries
• Dynamic elements: Adding and removing HTML elements and controls at runtime
• Developing responsive controls
• Realizing and integrating 3D models

Use

The framework controls can be integrated directly as references in a TwinCAT HMI project if both projects are in the same solution. Furthermore, it is possible to export the framework control as a package and install it in different HMI projects. In this way, it is possible to implement application-specific control libraries. Within the HMI project, a framework control is used like a standard TwinCAT HMI control.