MHTML HTTP Esupport - Wonderware.ch Home Downloads Wonde

Configuring InTouch® Windows for Scrolling and Panning Page 1 of 9
Tech Note 429

Configuring InTouch® Windows for Scrolling and Panning
All Tech Notes and KBCD documents and software are provided "as is" without warranty of any kind. See the Terms of
Use for more information.
Topic#: t002115
Created: May 2005
Introduction
Users frequently have the need to create InTouch applications with windows larger than the
screen resolution to be able to properly view the information all in one page (screen). Typical
applications include:
 Aerial depictions of plant, city, or area
 Piping diagrams
 System details that, if squeezed into the screen resolution, would appear too small or too
cramped.
When InTouch applications are developed with a window sized larger than the video resolution,
the system does not automatically place scroll bars to allow the end user to pan the entire
contents on the window.
This Tech Note provides a step-by step procedure for configuring Windows that are larger than
the screen resolution. In addition, it shows how to pan to these areas of the screen, and how to
use the application in a NAD environment, even though clients may use different screen
resolutions.
Items that will be covered:
• Creating applications with windows larger than the screen resolution

• Panning the Windows
Application Versions
 InTouch 9.0.
 Microsoft Flat Scrollbar Control 6.0 (SP4):
mhtml:http://esupport.wonderware.ch/Home/Downloads/Wonderware/Tech%20Notes/InT... 2/25/2012
FIGURE 1: MICROSOFT FLAT SCROLLBAR INSTALLATION
 The WWVirtualMonitorWidth, WWVirtualMonitorHeight, GetWindowPosition, and

MoveWindow functions. The functions are a part of the Tech Support Script Function
Library. Download them from our website
www.wonderware.com/support/mmi/comprehensive/kbcd/html/tech_sup.htm.
The functions are also included in the Add-on Functions folder within the application files.
Download the Sample Application.
Scroll Bar Window
The sample application was created in InTouch 9.0 with a resolution of 1024x768. For the
purposes of the test we used the Microsoft Flat Scrollbar Control 6.0 (SP4).
Note: The control must be installed and instantiated in InTouch before opening the sample
application.
You may choose to use a different scroll bar control for your application, which may include
better features. The ActiveX control used in this Tech Note is included with the OS and does not
require 3rd party software.
If the ActiveX control is not already listed under the Wizard Selection/ActiveX controls
menu, select Special/Configure/Wizard/ActiveX Installation, and add the ActiveX control.
1. Create the Horizontal Scroll Bar window with the following properties:
FIGURE 2: HORIZONTAL SCROLL BAR WINDOW PROPERTIES
The window scripts are configured in subsequent steps, after the ActiveX control is placed
in the screen. You may initially want to change the window height to a value greater than
16 (i.e. 200) while you insert and resize the scroll bar ActiveX control.
FIGURE 3: FLATSCROLLBAR ACTIVEX CONTROL
2. Insert the ActiveX control and configure the following properties (Figures 4 and 5 below):
FIGURE 4: PROPERTIES - CONTROL NAME TAB
FIGURE 5: PROPERTIES - GENERAL TAB
3. Open the Window Properties and type the following While Showing window script
(every 200msec):
Horizontal_Position = #HorzScrollBar.Value;
MoveWindow( WindowName, 0 - Horizontal_Position, 0 - Vertical_Position,
ThisWindowWidth, ThisWindowHeight);
WHERE:
• WindowName is a Memory Message tag. The value of this tag will be set by a
Window in the OnShow script to map the name of the window so it can be used in this
script.
• Horizontal_Position is a Memory Integer tag: 0 – 10,000 EU, or as needed for the
horizontal scroll bar ActiveX control to map to a tagname.
• Vertical_Postion is a Memory Integer tag: 0 – 10,000 EU, or as needed for the
vertical scroll bar ActiveX control to map to a tagname.
• ThisWindowWidth is a Memory Integer tag: 0 – 10,000 EU, or as needed. The
value of this tag will be set by a Window in the OnShow script to map the width value of
the window so it can be used in this script.
• ThisWindowHeight is a Memory Integer tagname 0 – 10,000 EU, or as needed. The
value of this tag will be set by a Window in the OnShow script to map the height value of
the window so it can be used in this script.
• The value of Horizontal_Position is updated every 200msec, or at the interval
specified in the window While Showing window script.
• The MoveWindow( WindowName, Left, Top, Width, Height ) command moves the
window to the coordinates specified at Left, and Top.
4. Create a Vertical Scroll Bar window with the following properties:
FIGURE 6: VERTICAL SCROLL BAR WINDOW PROPERTIES
You may initially want to change the window width to a value greater than 16 (i.e. 200)
while you insert and resize the scroll bar ActiveX control.
5. Insert the Scroll Bar ActiveX control and label it Vertical Scroll Bar. Notice the
Orientation property in the General tab: It is Vertical.
6. Configure the following properties:
FIGURE 7: VERTICALSCROLLBAR PROPERTIES - CONTROL NAME TAB
FIGURE 8: VERTICALSCROLLBAR PROPERTIES - GENERAL TAB
7. Open the Window Properties and add the following While Showing script (every
200msec):
Vertical_Position = #VerticalScrollBar.value;
MoveWindow( WindowName, 0 - Horizontal_Position, 0 - Vertical_Position,
ThisWindowWidth, ThisWindowHeight);
This is all that needs to be configured for the scrollbar windows.
Panning Window
The following section describes creating the "panning" window and a menu bar.
Note: The window to be panned must be the Overlay type. The Replace type will close the
scrollbar or any other pop-up window that happens to be within its coordinates.
1. Create a panning window with the following properties:
• Window Type = Overlay.
• The Window Width and Height are also larger than the configured monitor width and
height.
FIGURE 9: WORLD TIME ZONES OVERLAY WINDOW
2. Type the following On Show window script:
WindowName = "World Time Zones";

#HorzScrollBar.Value = 0;
#VerticalScrollBar.Value = 0;
WHERE:
• Variable:WindowName (memory message)

is used as a dynamic parameter in Data Change Scripts (DCS) "Horizontal_Position" and
Vertical_Position" as the window name for the MoveWindow() function.
The same script will be used in other application windows. The window name value is
replaced with the name of the window. This only applies for windows that are used for
panning purposes.
Two other windows are provided in the application. They contain grid-like graphics with
row/column numbering. As you pan or scroll the window notice the row/column value.
These are the minimum requirements necessary to use the scroll bars.
Now, a menu window may be necessary to call windows or other functions of the
application.
3. Create a menu window with the following properties:
FIGURE 10: MENUBAR WINDOW
4. The menu screen may look something like this:
FIGURE 11: MENUBAR RUNTIME
The World button for example will have an action script as follows:
Hide WindowName;
Show "World Time Zones";
The Hide WindowName line in the action script closes the screen that was previously
assigned to the tag WindowName.
Using NAD and Dynamic Video Resolution
The previous steps work for an application that will run at the developed resolution. In a NAD
environment, or if the user deploys the application where it needs to be run at a different video
resolution, the scroll bars and panning will not work properly.
The following steps add features to the application that address the issue of dynamic video
resolution.
In the previous example, we had hard-coded the tags ThisWindowWidth and

ThisWindowHeight with a number corresponding to the window width and the window height
at the time of development. With dynamic video resolution, this value becomes unusable, and a
multiplier would be necessary to make it usable.
Instead of a multiplier, use the GetWindowPosition script function to dynamically provide the
information for the window that has been called.
1. Create a Data Change script with the WindowName variable.
2. In the Action script area use the GetWindowPosition script function as follows:
Success = GetWindowPosition( WindowName, "LeftCoord", "TopCoord",

"ThisWindowWidth", "ThisWindowHeight", 1 );
The MoveWindow() function in the Horizontal and Vertical Scroll Bar windows can use
the size of the window no matter what resolution is being used for the application.
A cosmetic issue that arises with the scroll bars is that they need to be assigned a proper
maximum limit of scrolling, so just the proper panning is performed for the size of the
window, when the slider is moved to the maximum location (rightmost side on the
horizontal scroll bar).
3. Add the following lines to the script Data Change script:
#HorzScrollBar.Max = ThisWindowWidth - WWVirtualMonitorWidth();

#VerticalScrollBar.Max = ThisWindowHeight - WWVirtualMonitorHeight();
These lines set the proper maximum value of the scroll bars so the application can be
ported seamlessly to different resolutions.
In a NAD environment, if the client node is configured for a different video resolution, use the
InTouch Application Manager to set the client node properties Resolution tab to Allow
WindowViewer to dynamically change resolution and Convert to screen video
resolution.
A. Martinez
Tech Notes are published occasionally by Wonderware Technical Support. Publisher: Invensys Systems, Inc., 26561
Rancho Parkway South, Lake Forest, CA 92630. There is also technical information on our software products at
www.wonderware.com/support/mmi
For technical support questions, send an e-mail to support@wonderware.com.
back to top
©2012 Invensys Systems, Inc. All rights reserved. No part of the material protected by this copyright may be
reproduced or utilized in any form or by any means, electronic or mechanical, including photocopying, recording,
broadcasting, or by anyinformation storage and retrieval system, without permission in writing from Invensys Systems,
Inc. Terms of Use.

MHTML HTTP Esupport - Wonderware.ch Home Downloads Wonde

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

MHTML HTTP Esupport - Wonderware.ch Home Downloads Wonde

Uploaded by

Copyright:

Available Formats

Configuring InTouch® Windows for Scrolling and Panning Page 1 of 9

Tech Note 429

 Aerial depictions of plant, city, or area

Items that will be covered:

• Creating applications with windows larger than the screen resolution

 Microsoft Flat Scrollbar Control 6.0 (SP4):

FIGURE 1: MICROSOFT FLAT SCROLLBAR INSTALLATION

 The WWVirtualMonitorWidth, WWVirtualMonitorHeight, GetWindowPosition, and

Download the Sample Application.

Scroll Bar Window

FIGURE 2: HORIZONTAL SCROLL BAR WINDOW PROPERTIES

FIGURE 3: FLATSCROLLBAR ACTIVEX CONTROL

FIGURE 4: PROPERTIES - CONTROL NAME TAB

FIGURE 5: PROPERTIES - GENERAL TAB

4. Create a Vertical Scroll Bar window with the following properties:

FIGURE 6: VERTICAL SCROLL BAR WINDOW PROPERTIES

6. Configure the following properties:

FIGURE 7: VERTICALSCROLLBAR PROPERTIES - CONTROL NAME TAB

FIGURE 8: VERTICALSCROLLBAR PROPERTIES - GENERAL TAB

This is all that needs to be configured for the scrollbar windows.

1. Create a panning window with the following properties:

• Window Type = Overlay.

FIGURE 9: WORLD TIME ZONES OVERLAY WINDOW

2. Type the following On Show window script:

WindowName = "World Time Zones";

• Variable:WindowName (memory message)

3. Create a menu window with the following properties:

FIGURE 10: MENUBAR WINDOW

4. The menu screen may look something like this:

FIGURE 11: MENUBAR RUNTIME

Using NAD and Dynamic Video Resolution

In the previous example, we had hard-coded the tags ThisWindowWidth and

1. Create a Data Change script with the WindowName variable.

Success = GetWindowPosition( WindowName, "LeftCoord", "TopCoord",

3. Add the following lines to the script Data Change script:

#HorzScrollBar.Max = ThisWindowWidth - WWVirtualMonitorWidth();

For technical support questions, send an e-mail to support@wonderware.com.

You might also like