WPF Page Navigation

Overview – WPF Page Navigation

There are many ways to implement window navigation in a WPF application.  The WPF Page Navigation video for information on how to do it without writing any code using the WPFPageNavigation control.

NOTE: If you want to visualize your data in a desktop or mobile browser with zero programming, you may be interested in the OAS Open UIEngine .
The UIEngine is a robust no-code web application and HMI builder for developing rich user interfaces in a browser-based development environment.
See the UIEngine Documentation to learn more.

Videos – WPF HMI Dashboard

The following videos demonstrate how to use the Live Data Dashboard application to create your own HMI content within the Live Data Dashboard application.

This application has built in features to provide users the ability to setup and persist the information they are interested across a network, to remember the users session views and bring the information back to them for their desired information.

Live Data Dashboard Overview

How to create a WPF Dashboard application using the Live Data Dashboard template. User controlled windows that persist on server for remote recall.

Live Data Dashboard Adding Window

How to add a Window to the Live Data Dashboard.

Live Data Dashboard Reports and Documents

How to add report and document interface options to Live Data Dashboard.

Live Data Dashboard Gadgets

How to add gadgets to the Live Data Dashboard.

WPF HMI Dashboard

WPF HMI Dashboard 289

Overview – WPF HMI Dashboard

The Dashboard HMI template is a WPF VB.Net project template for .Net Framework 4.0 and is a unique tool that provides you with a number of advantages over starting from scratch.

The template comes with several demo windows to show you how that final application goes together, how to implement menus and the use of custom object to keep track of operator’s windows and preferences.

NOTE: If you want to visualize your data in a desktop or mobile browser with zero programming, you may be interested in the OAS Open UIEngine .
The UIEngine is a robust no-code web application and HMI builder for developing rich user interfaces in a browser-based development environment.
See the UIEngine Documentation to learn more.

FAQs – WPF Expression Blend

How can I learn about Expression Blend and how to use it?
View the Expression Blend for WPF video in the WPF HMI Videos section.
After updating Open Automation Software with the incremental update the project no longer compiles or the application no longer works.
Make sure to Unblock the dlls before copying to C:\Program Files\Open Automation Software\OAS\Controls\NetFramework\ or C:\Program Files\Open Automation Software\OAS\Controls\NetStandard\.
To Unblock the files copy to a trusted location for your system, Desktop works well, then right click on the file and select Properties to select Unblock. Then copy from your Desktop to the correct directory in C:\Program Files\Open Automation Software\OAS\Controls\.
My OPCWPFDashboard Button flashes when the user hovers the mouse over the button.
This is default for a WPF Button control, but the behavior can be changed with the following steps using Expression Blend.
  1. Select the button, and right click on the button, select Edit Template-Edit a Copy.  Select OK.
  2. With the new template selected reset the RenderMouseOver, and RenderPressed property.
  3. Select Triggers, and delete the IsKeyboardFocused trigger.
  4. Apply the new template to all buttons.  Select the button, right click, and select Edit Template-Apply Resource.

OPCWPF Storyboard

The OPCWPF Storyboard component performs as a storyboard controller to begin, pause, skip to fill and stop Storyboard animations with properties to automatically update from any Open Automation Software Tag Parameter.

To add an OPCWPF Storyboard select the OPCWPFStoryboard component from the ToolBox and place it on any Windows Form of your choice. See Add OPCWPFDashboard Controls Components to Visual Studio.NET to add the OPCWPFStoryboard to the ToolBox.

OPCWPF Storyboard Properties

Refer to OPCWPF help for all properties and members of the OPC WPF components. All properties can be assigned in code; however no programming is required to use the properties.

Enabled

OPCWPF Storyboard Properties 283

Story Board Begin

OPCWPF Storyboard Properties 284

Storyboard Pause

OPCWPF Storyboard Properties 285

Storyboard Resume

OPCWPF Storyboard Properties 286

Storyboard Skip to Fill

OPCWPF Storyboard Properties 287

Storyboard Stop

OPCWPF Storyboard Properties 288

Tag

 

 

Getting Started – WPF Expression Blend

Step 1

Load the default DemoTags Tag configuration if you have replaced your tag configuration with your own tags.

Start Expression Blend 4.0 and select New Project to create a new C#, or VB.

WPF Expression Blend 268

Step 2

Select WPF Application as the project type and Version 3.5 or 4.0

WPF Expression Blend 269

Step 3

From the Assets tab if OPCWPF components are not available, In the Projects Tab right click on References and select Add Reference to the following DLL.

For Version 3.5…

C:\Program Files\Open Automation Software\OAS\Blend3.5OPCWPF.dll

Or if you are using Version 4…

C:\Program Files\Open Automation Software\OAS\Blend4.0OPCWPFDashboard.dll

If it is available go to Step 4.

WPF Expression Blend 270

Step 4

From the Assets Tab add an OPCWPFLabel component onto the Window.

WPF Expression Blend 271

Choose the Selection Tool and then click on the label.

Select the Content_Tag property and use the browse button at the right to set the Open Automation Software Tag to Ramp.Value.

WPF Expression Blend 272

Note: If you wish to run this application on remote PCs make sure to include the Network Node or IP Address of the OAS Service source.

Note: All Tag names are case sensitive. Ramp.Value is valid, ramp.value is not.

Note: You can use the DirectOPC interface to connect directly to OPC Server Items is you just need to gain access to the server items without having to create Open Automation Software Tags.

Step 5

Add an OPCWPFButton to the Window.

WPF Expression Blend 273

Set the Content_Tag to Pump.Value.  If the Pump Tag does not exist create a Boolean Tag using Configure-Tags with the name Pump.

Set the Format fields as defined below…

WPF Expression Blend 274

Set the Background01_Tag to Pump.Value.

WPF Expression Blend 275

Set the SetValue_Tag to Pump.Value.

WPF Expression Blend 276

Step 6

Add an OPCWPFTextBox to the Window.

WPF Expression Blend 277

Set the Text_Tag property to Pump.Value. The Format properties for Boolean to Off and On.

WPF Expression Blend 278

Step 7

Add an OPCWPFDashboard360Gauge.

WPF Expression Blend 279

Set the Value_Tag to Ramp.Value.

WPF Expression Blend 280

Step 8

Select Build from the Project Menu to Build the application.

WPF Expression Blend 281

Step 9

Use Windows Explorer to browse for the application located in the binRelease directory and run the application.

WPF Expression Blend 282

Step 10

To deploy the application to remote nodes first make sure the Tags as described in steps 4, 5, and 6 are set to a Network Node or IP Address. Then simply copy the files in the binRelease directory to the target systems or follow the Smart Client deployment section in this help file to deploy your application using Click Once Deployment.

Note: You can also use the OPCWPFNetworkNodes component and assign a network node alias to change all “localhost” tags to the desired remote node. This is done with the AddNetworkNodeAlias method. Refer to the WinForm Example Code on the exact syntax of how to use this method. Notice how all OPC Controls data sources for a particular node can be reassigned to a remote node with one simple call.

Step 11

There are many different properties to each control. In WPF you can convert graphics to an Image Brush. The Image Brush can then be used as a background in most OPCWPF Controls.

The OPC WPF Data component can be used to access data via code with very simple methods.  Refer to the Forms FormReadValues and FormWriteValues in the WinForm Example Code.

Refer to the WPF Example application for demonstration example of all properties of all controls.

Expression Blend

Microsoft Blend for Visual Studio (formerly Microsoft Expression Blend) is a user interface design tool developed and sold by Microsoft for creating graphical interfaces for web and desktop applications that blend the features of these two types of applications. It is an interactive, WYSIWYG front-end for designing XAML-based interfaces for Windows Presentation Foundation, Silverlight and UWP applications.

NOTE: If you want to visualize your data in a desktop or mobile browser with zero programming, you may be interested in the OAS Open UIEngine .
The UIEngine is a robust no-code web application and HMI builder for developing rich user interfaces in a browser-based development environment.
See the UIEngine Documentation to learn more.

Learn how to develop OAS Visualizations using Microsoft Blend or Expression Blend.

FAQs – WPF Visual Studio

WPF Properties Edit Ellipses Missing in VS 2022
Visual Studio 2022 design time properties no longer support custom property editors for WPF applications.  Use Visual Studio 2019 to develop WPF applications. The free Community Edition of Visual Studio 2019 can be download from https://visualstudio.microsoft.com/vs/older-downloads/. WinForm applications are still well supported in Visual Studio 2022.
Bad Data Quality in .NET Application.
Below are some possible reasons your .NET application is not able to read OAS tag values.

Data Source Quality

Use Configure-Tags to verify that the data quality of the source tags is "Good Quality". Menu Configure Tags
Quality Good

Security

The Default security group on either the local or remote OAS Engine may have Disable All Tags from Reading checked under the Read Tags Tab.  See Restrict Tag Access of Security setup to see how read, write, and browse access can be restricted. View how to Implement User Credentials in Client Applications to provide log in method for each user in the .NET application.

Network

.NET applications can be defined to communicate to remote OAS Engines.  See Network Communications Troubleshooting to verify that port 58727 is allowing both incoming and outgoing traffic through your firewall.

Tag Path

The full tag path would include the full tag name including its parent groups and the variable of the Tag.
MyGroup.MyTag.Value
Tag names are case sensitive and the current value of a tag would be .Value as the most common variable.
If the tag is from a remote OAS Engine see Basic Networking for standard remote tag syntax or Live Data Cloud Networking if the OAS Engine system has a dynamic IP address.
\\192.168.0.1\TagName.Value

License

Use Configure-License to verify that a product feature .NET Data Connector, WinForm HMI, or WPF HMI is enabled on the data source system where the tags are located. Menu Configure License
Enabled Products

Target Framework for WPF and WinForm Applications

The project type for WinForm and WPF applications should be set to include (.NET Framework) and target .NET Framework 4.6.1 or greater. WinForm Target Framework See the correct project type for WinForm above that is listed as Windows Forms App (.NET Framework) while Windows Forms App would not be the correct project type.

Assembly References

Visual Studio on some operating systems will assign a legacy assembly to the project causing an incompatibility due to an older version of the reference assembly.  A common assembly that can be incorrect is Newtonsoft.Json that has been registered in the GAC by another software product. Select Newtonsoft.Json under the Project References to verify the correct path and version as 13.0.0.0.
Newtonsoft.Json Assembly Reference If the Path does not reference the OAS installation directory remove the reference and select to Add Reference and browse for dll from the respective directory for the specific product feature. For .NET Framework applications include the .dlls located in C:\Program Files\Open Automation Software\OAS\Controls\NetFramework\. The Target Framework set for the VS project must be .NET Framework 4.6.1 or greater. For .NET Standard supporting the following targets include the. dlls located in C:\Program Files\Open Automation Software\OAS\Controls\NetStandard\. See a list of locations for the correct type in the troubleshooting type After updating to OAS Version 17 the project no longer compiles for a list of correct project reference paths for each type of Visual Studio Project.

.NET Assembly is Blocked

If you have copied an application or project to another computer you may need to Unblock one or more the .dll files. Right click on the .dll file that you have downloaded. Check the Unblock checkbox for security as shown in the example below, then click Apply or OK. Excel Add-In

Legacy .NET Application with OAS Version 17

 If the OAS .NET assemblies are from OAS version 16 or less contact support@oasiot.com for compatibility instructions.
Tag Browse in Visual Studio Missing
Microsoft Visual Studio 2022 no longer supports custom property editors to browse for tags. Use Visual Studio 2019 to develop WPF applications. The free Community Edition of Visual Studio 2019 can be download from https://visualstudio.microsoft.com/vs/older-downloads/. If you prefer Visual Studio 2022 with WPF application development use the OAS Excel Tag browser to browse for the full tag path of a remote or local tag and copy the full tag path from the Tag field and paste into the desired Tag property in Visual Studio.
After updating to OAS Version 17 the project no longer compiles

OAS version 17 implements an improved network interface which requires some additional assemblies.

All dependent .dlls are located in the relative subdirectory of the Controls directory of the OAS installation directory, typically C:\Program Files\Open Automation Software\OAS\Controls\.

To add a reference to a Visual Studio project right click on References in the Solution Explorer.

Add Reference

Select Browse to browse the directory for each application feature.

Browse Assemblies

Include all .dlls files in the respective directory for the specific product feature.

For .NET Framework applications include the .dlls located in C:\Program Files\Open Automation Software\OAS\Controls\NetFramework\.

The Target Framework set for the VS project must be .NET Framework 4.6.1 or greater.

For .NET Standard supporting the following targets include the. dlls located in C:\Program Files\Open Automation Software\OAS\Controls\NetStandard\.

  • .NET 5 or greater
  • .NET Core 2.0 or greater
  • .NET Framework 4.61 or greater
  • Xamarin.iOS 10.14 or greater
  • Xamarin.Android 8.0 or greater
  • UWP 1.0.0.16299 or greater

WPF HMI Assemblies

  • C:\Program Files\Open Automation Software\OAS\Controls\NetFramework\OPCWPFDashboard\

WinForm HMI Assemblies

  • C:\Program Files\Open Automation Software\OAS\Controls\NetFramework\OPCControls\

Alarm .NET Assemblies

  • C:\Program Files\Open Automation Software\OAS\Controls\NetFramework\OPCAlarmControl\
  • C:\Program Files\Open Automation Software\OAS\Controls\NetFramework\OPCAlarmDataOnly\
  • C:\Program Files\Open Automation Software\OAS\Controls\NetStandard\OASAlarms\

Trend .NET Assemblies

  • C:\Program Files\Open Automation Software\OAS\Controls\NetFramework\OPCTrendControl\
  • C:\Program Files\Open Automation Software\OAS\Controls\NetFramework\OPCTrendDataOnly\
  • C:\Program Files\Open Automation Software\OAS\Controls\NetStandard\OASTrends\

.NET Data Connector Assemblies

  • C:\Program Files\Open Automation Software\OAS\Controls\NetFramework\OPCSystemsDataConnector\
  • C:\Program Files\Open Automation Software\OAS\Controls\NetStandard\OASData\

Server Configuration Assemblies

  • C:\Program Files\Open Automation Software\OAS\Controls\NetFramework\OPCSystems\
  • C:\Program Files\Open Automation Software\OAS\Controls\NetStandard\OASConfig\
 
Can WPF applications be deployed to remote systems for Internet communications?
Yes, applications communicate using WCF over a standard TCP port which is adjustable. The default port number is 58724. View the Networking – LAN, WAN, and Internet Videos on how to implement standard communications over the Internet and also the Live Data Cloud networking on how to host your own data without a fixed IP address or registered domain name.
The .NET controls do not appear in the Toolbox after selecting to add them to the Toolbox.
If you right click Toolbox and Choose to Add Items and select the OPCWPFDashboard controls, yet they do not appear in the Toolbox you may have installed Visual Studio after Open Automation Software.  If so uninstall Open Automation Software and reinstall it.  It will then register correctly with Visual Studio for adding the controls.
After updating Open Automation Software with the incremental update the project no longer compiles or the application no longer works.
Make sure to Unblock the dlls before copying to C:\Program Files\Open Automation Software\OAS\Controls\NetFramework\ or C:\Program Files\Open Automation Software\OAS\Controls\NetStandard\.
To Unblock the files copy to a trusted location for your system, Desktop works well, then right click on the file and select Properties to select Unblock. Then copy from your Desktop to the correct directory in C:\Program Files\Open Automation Software\OAS\Controls\.
My OPCWPFDashboard Button flashes when the user hovers the mouse over the button.
This is default for a WPF Button control, but the behavior can be changed with the following steps using Expression Blend.
  1. Select the button, and right click on the button, select Edit Template-Edit a Copy.  Select OK.
  2. With the new template selected reset the RenderMouseOver, and RenderPressed property.
  3. Select Triggers, and delete the IsKeyboardFocused trigger.
  4. Apply the new template to all buttons.  Select the button, right click, and select Edit Template-Apply Resource.
I want to have my HMI application automatically scale in size when the user changes the size of the application or it is run on different PC with different screen resolution.
Use a ViewBox in the Window XAML code. When you create a WPF application by default the first container in the window is a Grid. Each container has an opening and closing statement in the XAML file. For example:
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
.....
</Grid>
</Window>

All of your content will be in the grid. To create a window with resizable content add a ViewBox to the window and put the grid in the ViewBox. Example:
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Viewbox>
<Grid>
....
</Grid>
</Viewbox>
</Window>

Select the view box and set the stretch property the way you want the application to respond. The options are None, Fill, Uniform and Uniform to Fill. The default is uniform.
Does OPCWPFHMI.NET support MVC?
Yes
I get a thread exit message in Visual Studio 2013.
The thread exit message is a bug in Visual Studio 2013. https://connect.microsoft.com/VisualStudio/feedback/details/812144/vs2013-reports-incorrect-thread-exit-code Check to see if you have CTP 5 installed for up to date fixes. https://www.visualstudio.com/news/vs2013-update5
How do I implement Data Binding from an Open Automation Software Tag Value?
Use the OPCWPFContent control.  Following is an example:
<Slider Height=""41"" HorizontalAlignment=""Left"" Margin=""70,190,0,0"" Name=""Slider1"" VerticalAlignment=""Top"" Width=""421"" Maximum=""100""
TickPlacement=""BottomRight""
Value=""{Binding Content, ElementName=OPCWPFContent1}"" />
 
<my:OPCWPFContentControl x:Name=""OPCWPFContent1""  Height=""27"" Margin=""222,104,287,0"" VerticalAlignment=""Top""
ToolTipBadQualityText=""0"" ContentBadQualityText=""0"" Content_Tag=""Ramp.Value""/>

I receive an error stating that the Microsoft.Expression.Drawing.dll and Microsoft.Expression.Effects.dll is missing and not found.
These assemblies are included in the installation directory of Open Automation Software and can be included as a Reference in your project as local copy. Or you can install the Blend SDK from the following link that also includes these files. https://www.microsoft.com/downloads/details.aspx?displaylang=en&FamilyID=75e13d71-7c53-4382-9592-6c07c6a00207
What assemblies do I need to deploy with my application?
Include the following in References as Local Copy:
  • C1.Win.C1FlexGrid2.dll
  • Microsoft.Expression.Drawing.dll
  • Microsoft.Expression.Effects.dll
  • Microsoft.Expression.Interactions.dll
  • Nevron.Chart.dll
  • Nevron.Chart.WinForm.dll
  • Nevron.GraphicsGL.dll
  • Nevron.Presentation.dll
  • Nevron.System.dll
  • OPCAlarmControl.dll
  • OPCSystemsInterface.dll
  • OPCTrendControl.dll
  • OPCWPFDashboard.dll