ActiveX ToolWorXV 6.1

ICONICS

AGENDA

• Introduction & Overview

• Demonstration: GWXGauge

• ActiveX Toolkit Architecture

• Programming Techniques

• Demonstration: Creating a New ActiveX Control with ActiveX ToolWorX

Introduction/Overview

Part 1

Recommended Knowledge

• Visual C++ 6.0

• MFC

• Microsoft Developer’s Studio

• OLE Automation

• Win 32

• Building ActiveX controls with MFC

ActiveX Controls• Component/modular software design

• Can be embedded into any ActiveX container– Visual Basic Forms– HTML pages for Internet Explorer– ICONICS’ GraphWorX32 HMI Application– Your own custom built container

• Methods, Properties, and Events

• Usually In-process

ActiveX ToolWorX• A development toolkit for easy creation

of OPC (OLE for Process Control) enabled ActiveX controls

• Featuring– OPC Connectivity– Powerful Animation Capabilities– Built-in UI controls (sliders, buttons, etc.)

OPC Connectivity• Easy support for connection to OPC

servers– Automatically handles OPC data updates

(reads and writes); just provide a tag name, the toolkit takes care of the rest.

– OPC Tag Browser included for tag name selection user interface

Powerful Animation• Includes all the animation capabilities of

ICONICS’ GraphWorX32 HMI product– Compose images with rectangles, lines,

ellipses, text, bitmaps, and more...– Transform images: Size, Location,

Rotation, Color, and more...

• Updates are fast and flicker-free

Built-in UI Controls• Toolkit includes handling of User Input

controls– Sliders and dials for writing analog values– Numeric/text entry fields– Buttons for downloading/toggling values

• No need to worry about handling mouse clicks, mouse moves, or keystrokes for these input controls; the toolkit takes care of it.

Origins of ActiveX ToolWorX• Toolkit was created by ICONICS to

assist in development of ICONICS component ActiveXs

• Leverages functionality developed by ICONICS for GraphWorX32 HMI Application

• Resulting toolkit is “general purpose” (useful to developers other than ICONICS).

Advantages of Using ActiveX ToolWorX

• Rapid development because there is no need to implement features already supported by the toolkit (OPC connectivity, animation, UI controls, etc.)

• Permits focus on component-specific functionality (build desired “intelligence” into your component)

• Don’t even need to understand OPC (the toolkit abstracts it)

What is Included in the Toolkit?

• ICONICS ActiveX ToolWorX Wizard– Automatically generates the framework source

code for developing ActiveX controls using ActiveX ToolWorX

• ActiveX ToolWorX Developer’s Guide Documentation– Detailed instructions on how to use the toolkit– Explanation of the toolkit’s architecture– GraphWorX32 OLE Automation Reference

What is Included in the Toolkit?

• GwxExtDll.DLL– Dynamic link library containing HMI

functionality (more on this later)

• olexpress.DLL– Contains OPC related functionality (this

DLL is used by GwxExtDll; you will not need to use this DLL directly)

• TagBrowser.DLL– OPC tag browser

What is Included in the Toolkit?

• Gwx32.TLB– Type library for OLE Automation

supported by GwxExtDll

• GWXGauge ActiveX– Example ActiveX control created using the

toolkit

• Source code of GWXGauge– A valuable resource for understanding how

to create controls using the toolkit

• Other miscellaneous support files

GWXGauge

• GWXGauge is an OPC enabled ActiveX control developed with ActiveX ToolWorX

• Gauge has over 100 properties making it a highly flexible component

• Source code for the gauge included in the toolkit demonstrates a wide variety of programming techniques that can be used with the toolkit

Architecture

Part 2

GwxExtDll.DLL

• Significant portions of ICONICS’ GraphWorX32 HMI product have been encapsulated in this DLL

• This DLL is an MFC Extension DLL• The extention DLL exports a single class

CGwxControl (a COleControl derived class). Your new controls are derived off of CGwxControl (instead of COleControl), thus inheriting all of the functionality in GwxExtDll

• GwxExtDLL exposes a rich set of OLE automation properties/methods for manipulating the base control

ActiveX Toolkit Architecture

OLExpress FrameWorX

ActiveX “B” Code

OLE Automation

GwxExtDll.DLL Code

ActiveX “A” Code

ActiveX Container ApplicationActiveX Container Application

OPC ServerOPC Server

OLE Automation

OPC Data

OPC Data

Instances of your ActiveX Controls

OPC Data

GwxExtDll Data GwxExtDll Data

ActiveX ToolWorX Wizard

• The released version of the toolkit will include a wizard for automatically generating framework source code for developing ActiveX controls using ActiveX ToolWorX

• To help understand the toolkit better, the tasks automated by the wizard are described in the ActiveX ToolWorX documentation

Tasks Performed by the Wizard

• Create a new Visual C++ project using Microsoft’s MFC ActiveX Control Wizard

• In Build-Settings-Link-Release add GwxExtDll.LIB

• In Build-Settings-Link-Debug add GwxExtDlld.LIB– When you are building a debug version of your

ActiveX, you need to use the debug version of GwxExtDll to ensure that the ActiveX registers properly

Tasks Performed by the Wizard

• Change your control class to be derived from CGwxControl instead of COleControl– Replace all instance of COleControl in

your control class (.cpp and .h file)– Include Control.h in the .cpp files of your

control class and application class• Control.h is the class definition file for

CGwxControl

Tasks Performed by the Wizard

• Replace the default drawing code in OnDraw() to:– CGwxControl::OnDraw(pdc, rcBounds, rcInvalid)

– This allows the base class, CGwxControl, to do all the drawing

• In InitInstance(), just before returning, add the following code:– InitialGraphWorXExtensionDll();

– This function insures the MFC properly handles the current module state

Tasks Performed by the Wizard

• Inherit desired properties and methods of the base class by modifying the ODL file of your project– Copy the properties/methods you want

from GWXview32.ODL (file provided in the toolkit)

– Modify the ID numbers such that the first bit of the hi-word is set

Tasks Performed by the Wizard

• Using Class Wizard, add a new class by importing the GwxDisplay object type from Gwx32.TLB– This provides easy access to exposed

methods/properties of GwxExtDll– To use the new class (IGwx32) add a new

member variable to your control class. Initialize the variable as follows:

• LPDISPATCH lpDispatch = GetDisplay();

• m_lpDispatch = new IGwx32(lpDispatch);

– Delete this member in the destructor of your control class

Tasks Performed by the Wizard

• Optionally override default settings of the base control’s properties in the constructor of your control class– The following example would turn on the

scrollbars by default in your derived control:

• m_verticalScrollbar = TRUE;

• m_horizontalScrollbar = TRUE;

Programming Techniques

Part 3

Programming Tasks

• Create GraphWorX32 objects which make up the control– Create lines, rectangles, dynamic

transformations, etc. that define the look and behavior of your ActiveX

• Manipulate existing GraphWorX32 objects in the control– Associate properties of your ActiveX

control with properties of the lines, rectangles, dynamic transformations, etc. that comprise your control.

Creating Objects

• There are two primary techniques you can use to create GraphWorX32 objects with the toolkit– Dynamic programmatic creation of objects

via OLE automation– Loading a pre-created set of objects created

visually using GraphWorX32 HMI application

Programmatic Creation

• Use OLE automation methods defined in Gwx32.TLB to create the GraphWorX32 objects, based on the current values of your ActiveX’s properties– Use methods such as CreateRectangle()

and CreateSizeDynamic() to build up the visual appearance and behavior of your ActiveX

Visual Creation

• Create the objects for your ActiveX visually using GraphWorX32

• Bind the resulting display file directly into your ActiveX resources

• Load the display from the resource area via FileOpen() method

Programmatic vs. Visual Creation

• Programmatic Creation is highly flexible but more difficult to program– Layout of objects is unrestricted, but logic for

intelligent layout can be tricky

– This is the technique used by GWXGauge

• Visual Creation is very easy to program, but tends to be less flexible– Layout of objects is done visually, but this layout

is generally fixed

– Can include bitmaps in the layout

– This technique is good for controls which are visually complex, but tend not to vary much in their appearance

Example: Programmatic Creation

• To create a resizing barm_lpDispatch->CreateRectangle(l,t,w,h,filled,fillColor,lineColor,

lineWidth,lineStyle,shadow,shadowColor,edgeStyle,hidden,”bar1”,rounded)->Release();

LPDISPATCH lpDisp = m_lpDispatch->CreateSizeDynamic(“bar1”,”size1”,sizeType,clip,startSize,endSize);

IGwxDynamic sizeDispDrv(lpDisp);sizeDispDrv.SetDataSource(dataSource);sizeDispDrv.SetRangeOverride(rangeOverride);if (rangeOverride){

sizeDispDrv.SetLowRange(lowRange);sizeDispDrv.SetHighRange(highRange);

}

Don’t forget to release dispatch pointers

Example: Creation by FileOpen()• First, visually create the control’s display using

GraphWorX32• Import the display into your project via

Insert/Resource/Custom– Specify the resource type as “GWX32_DISPLAY”

– Store the resource id of the display as a string name (for instance, “GWX32_MYCONTROL1”)

• Load the display from the resource area using FileOpen() method, passing the file name in the special format:– “LoadDisplayFromResource:string representation of

module handle:resource name string”

Example: Creation by FileOpen()

• Sample Code:HINSTANCE hModule = AfxGetResourceHandle(); CString strModuleHandle;strModuleHandle.Format(_T("%ld"),(long)hModule); CString strDisplayName(_T("LoadDisplayFromResource:"));strDisplayName += strModuleHandle; strDisplayName += _T(":GWX32_MYCONTROL1");m_lpDispatch->FileOpen(strDisplayName);

Note: you can bind more than one display file into your ActiveX, loading any one of those displays based on property value

Handling Property Changes• When a property of your ActiveX changes, you

need to update the object(s) affected by that property

• Get the dispatch pointer of the appropriate object, given the object’s name (the name of an object is specified when the object is first created).

• Example: changing the data source

LPDISPATCH lpDisp = m_lpDispatch->GetDynamicObjectFromName(objName);

if (lpDisp != NULL) {IGwxDynamic lpDispDrv(lpDisp);lpDispDrv.SetDataSource(newDataSource); }

Demonstration

Creating a new ActiveX Control with ActiveX ToolWorX

Summary

• ICONICS’ ActiveX ToolWorX allows you to rapidly develop OPC enabled ActiveX controls with fast, flicker-free animation, and user input capabilities

• Components made with ActiveX ToolWorX can be embedded into any ActiveX container