How To Articles > How to Visualize OPC Server Data from a WPF .NET Application

How to Visualize OPC Server Data from a WPF .NET Application

How to Visualize OPC Server Data from a WPF .NET Application

Open Automation Software Tags can be defined to connect to Classic OPC Data Access 2.xx and 3.0 Servers with the built in OPC Interface. This tutorial walks you though downloading and installing OAS, configuring an OPC Server, configuring tags and visualizing tag data in .NET WPF with either C# or VB. Programming is not required if you use the designer interface.

Step 1. Download and Install the Open Automation Software and Start the OAS Service

If you have not already done so, you will need to download and install the OAS platform.  Fully functional trial versions of the software are available for Windows, Windows IoT Core, Linux, Raspberry Pi and Docker on our downloads page.

On Windows run the downloaded Setup.exe file to install one or more of the Open Automation Software features. Select the default Typical installation if you are not sure what features to use or the Custom installation if you want to save disk space on the target system.  When prompted agree to the End User License Agreement to continue the installation.

For more detailed instructions and video tutorials, visit the installation guide for your system:
Windows Installation | Linux Installation | Raspberry Pi Installation | Dockers Installation

When the installation is finished the OAS Service Control application will appear.  Use this application to start the 4 Services. If this is the first time installing the software it will automatically enter Runtime with an example Tag Configuration.

Step 2. Configure OPC Server Tags

OAS provides multiple ways to add and define tags:

To add a Tag manually:

  1. In the OAS Configure Application, select Configure >> Tags from the top menu.

  2. Select localhost or the remote service you wish to modify with the Select button to the right of the Network Node list.

  3. Click on the Add Tag button located at the top of the Tag browser on the left portion of the screen.

  4. A dialog box will appear. Enter a name for your new tag and click ok.

  5. A configuration screen will appear for your new tag. Select OPC in the Data Source dropdown box.

  6. Use the Browse button to the right of the OPC Item to browse OPC Servers for the desired OPC Item.

  7. Select Local, the desired OPC Server, branch within the OPC Server, and OPC Item and click OK.

  8. Specify the desired OPC Update Rate for the Tag.

  9. Click Apply Changes at the bottom right of the window.

To add Tags with One Click OPC:

  1. In the OAS Configure Application, select Configure >> Tags from the top menu.

  2. Select localhost or the remote service you wish to modify with the Select button to the right of the Network Node list.

  3. To begin the One Click OPC process select the Group you would like to import to in the Tag configuration. If you want to import to the Root Level, select the Tags Group at the top of the tree. Then select the One Click Import button on the top menu bar.

  4. Click on the Import OPC DA 2.XX or 3.0 Items Button in the pop up window.

  5. Use the One Click OPC Wizard to browse for a branch as a starting position within an OPC Server or just select the OPC Server name itself to add all items from the selected OPC Server. For the best networking design select OPC Servers from Local even if you are configuring a remote OAS Service.

  6. Select to enable the options to Get Data Type from OPC Server and optionally the Descriptions. Additionally if you want to specify to Trend all of the points select Trend Points.

  7. Click Add Tags and it will automatically add all of the OPC Items from the OPC Server Branch you have selected and all of the sub Branches beneath it.

  8. Select the Save button on the toolbar at the top.

For more detailed instructions on Configuring OPC Server Tags, visit our Getting Started OPC tutorial or the One Click OPC tutorial or watch the video tutorial below:

Step 3. Visualize Your Data with .NET

Project Setup
HMI applications can be developed using Microsoft Visual Studio 2010 (or later). Programming is not required if you use the visual editor.

Open your existing Visual Studio application or start a new one, either VB or C#. Specify WPF App (.NET Framework) as the project type.

Verify that the Target Framework is Version 4.61 or greater.

If you have installed Open Automation Software after installing Visual Studio you should see the Open Automation Software group in your toolbox.  If it is not there you can add a reference in your project to the OPCWPFDashboard.dll.  It will be in your installation folder, most likely: C:\Program Files\Open Automation Software\OAS. Add the tools by right clicking on the toolbox and selecting Choose Items.  In the Choose Toolbox Items dialog box under the WPF tab, select all of the items that start with OPCWPF and say OK.

Add a Viewbox
If you are unfamiliar with the Viewbox control in WPF it is very useful. By setting it’s Stretch property to Uniform, it will automatically transform it’s contents to fit the user’s screen.  It is easier to develop with the Stretch Property set to “None” and then set it back to “Uniform” at the end. You will want your Grid inside of your Viewbox. Your XAML should look like this:

Add a Label Control
Add an OPCWPFLabel control to the window by double clicking on it in the toolbox. Set the Content_Tag property of the label to the Tag property that you want the label to display. Do this by either typing it in the box if you know the name (they are case-sensitive) or use the ellipse next to the property box. If you are using the demo tag configuration that installs with Open Automation Software use Ramp.Value.

Referencing Tags
In the tag browser, you will need to select your network node and then the tag and the property you want to display. Your network node will be the location you have Open Automation Software installed on. If it is your local machine, it will be localhost, otherwise, it could be a registered domain name or an IP address. Here are some examples of referencing tags based on their location:

Local Tag:

Local Tag in a Group:
myGroup. myTag.Value

Basic Networking:

Live Data Cloud Networking from Local OAS Engine:

Live Data Cloud Networking from Remote OAS Engine

Add a Button Control
Next, add a button to the window by double clicking on OPCWPFButton on the toolbox.  Use the Pump tag for the button, it is a Boolean data type. Set Content_Tag in the properties window to Pump.Value. In the ContentFormatBooleanFalse property enter The Pump is On and the in the ContentFormatBooleanTrue property enter The Pump is Off.  That way the button text will be something more meaningful than simply True or False.

To change the color of the button when it’s value changes, use the Background01_Tag property.  Set it to Pump.Value.  The BackgroundFalse and BackgroundQualityBad properties control the background color for when the value is false and bad quality.

Next, SetValue_Tag property to Pump.Value.  This specifies what value to change when the button is clicked.

Add a Radial Gauge
Drag an OPCWPFRadialGauge onto the screen. Click the ellipse next to the Needles property. This will open the Needles Collection dialog box. Click the Add button.  This adds a Needle to the Radial Gauge. Set the Value_Tag property to Ramp.Value, the Ramp Tag again.  It is a Float Data Type, enter 0 for the ValueFormatFloat property. 

Click F5 to compile and run your project. Your screen should look similar to this.

For more detailed instructions on using OAS with WPF, visit .NET WPF HMI in our knowledge base or watch the video below:

Also, see Getting Started – .NET Trend and Getting Started – .NET Alarm.