![Page 1: Custom Widgets Tutorial InTouch Machine Edition (ITME)](https://reader035.vdocuments.mx/reader035/viewer/2022062522/58e6aba41a28abfd418b5b3d/html5/thumbnails/1.jpg)
Custom Widgets TutorialInTouch Machine Edition (ITME)
Confidential Property of Schneider Electric
by Fabio Terezinho
![Page 2: Custom Widgets Tutorial InTouch Machine Edition (ITME)](https://reader035.vdocuments.mx/reader035/viewer/2022062522/58e6aba41a28abfd418b5b3d/html5/thumbnails/2.jpg)
Agenda
Overview Demonstration
![Page 3: Custom Widgets Tutorial InTouch Machine Edition (ITME)](https://reader035.vdocuments.mx/reader035/viewer/2022062522/58e6aba41a28abfd418b5b3d/html5/thumbnails/3.jpg)
Overview
Main Benefits and Architecture
Page 3Confidential Property of Schneider Electric |
![Page 4: Custom Widgets Tutorial InTouch Machine Edition (ITME)](https://reader035.vdocuments.mx/reader035/viewer/2022062522/58e6aba41a28abfd418b5b3d/html5/thumbnails/4.jpg)
Benefits
Ability to integrate third-party web-based controls into the HMI/SCADA project screens.
Engineers with HTML/JScript can easily create Custom Widgets and define Properties/Events through the IDE. Users can use the Custom Widgets on the local Viewer and Thin Clients.
Ability to create a ecosystem where different users build and share library of controls that can be easily integrated into applications and accessible through multiple platforms.
Openness and Flexibility
![Page 5: Custom Widgets Tutorial InTouch Machine Edition (ITME)](https://reader035.vdocuments.mx/reader035/viewer/2022062522/58e6aba41a28abfd418b5b3d/html5/thumbnails/5.jpg)
Design and IntegrationCustom Widgets can be designed and integrated into application in two phases:
Phase 1: Create the Custom Widget and add it to the project library.
Design the Custom Widget name, properties, and events through the standard IDE
Implement the Custom Widget functionality, editing a HTML (index.html) and JScript (custom_widget.js) files.
Phase 2: Add instances of the Custom Widget into the project screens and link its properties and events to application tags and scripts.
![Page 6: Custom Widgets Tutorial InTouch Machine Edition (ITME)](https://reader035.vdocuments.mx/reader035/viewer/2022062522/58e6aba41a28abfd418b5b3d/html5/thumbnails/6.jpg)
Demonstration
Tutorial – show time!
Page 6Confidential Property of Schneider Electric |
![Page 7: Custom Widgets Tutorial InTouch Machine Edition (ITME)](https://reader035.vdocuments.mx/reader035/viewer/2022062522/58e6aba41a28abfd418b5b3d/html5/thumbnails/7.jpg)
Page 7Confidential Property of Schneider Electric |
THANK YOU
![Page 8: Custom Widgets Tutorial InTouch Machine Edition (ITME)](https://reader035.vdocuments.mx/reader035/viewer/2022062522/58e6aba41a28abfd418b5b3d/html5/thumbnails/8.jpg)