DevPartner 2018 Workshop : Maximize Your Traditional Synergy Development with Visual Studio

Exercise 5: UI/UX Improvements with .NET API

Previous Exercise Home Next Exercise

This is the fifth of a series of exercises that demonstrate the abilities of developing Traditional Synergy inside Visual Studio.

If you have not completed the previous exercises you can find the first one here.

This exercise is going to demonstrate how to build the code to wrap the Synergy .NET API to enhance the UI capabilities of our existing Synergy/DE UI Toolkit application.

To begin the exercise, follow these simple steps:

This will create a WPF User Control Library project. After the project is created it will open up the UserControl1.xaml file. Close this window. We can also delete the default source file from the project:

To ensure the correct version of the software is built:

We are going to add a WPF user control to the project. The files that make up the control are called OnVinylUIControl.xaml and OnVinylUIControl.xaml.dbl. Combined together these files define the new user interface control that we are going to utilize. We are also supplying a simple class to map the Synergy data types to native .NET types and a simple View Model class to provide the bindings between the UI and the data. The required files can be downloaded from here. Download (when prompted by the browser select “open”) and open the zip file and copy the source files to the OnVinylUX project folder you have just created. This folder will be under the DevPartner2018 solution folder.

To add the new WPF user control to the project follow these steps:

This will add the WPF user control to the project.

The next task is to define where our repository structures are to be loaded from. We need to define a reference between our UX Library and our Repository. To define the project reference:

Finally for the OnVinylUX project will be to define a post-build script to copy the built assembly into the correct executable folder:

copy "$(SolutionDir)OnVinylUX\bin\x64\Debug\OnVinylUX.dll" "$(SolutionDir)Debug\x64"

Now we can try to execute the build process:

The project should build.

Now we need to build our .NET Interop library. This library allows us to communicate with our new UX:

This will create an Executable Library project. After the project is created it will open upthe Routine.dbl default program file. Close this window. We can also delete the default source file from the project:

We now need to create the pre-build script to generate the .NET API wrappers. The script is quite complex so we have provided the contents for you. The script file can be downloaded from here. Download (when prompted by the browser select “open”) and open the zip file and copy the script file to the OnVinylInterop project folder you have just created. This folder will be under the DevPartner2018 solution folder.

We can now execute this script as part of the build process. To do this we will utilize a pre-build event. Please note this is a pre-build script and not a post-build script! To define the pre-build event:

"$(ProjectDir)\DotNetInterop.bat" "$(ProjectDir)" %TEMP%

From the Build menu select the Rebuild Solution entry to rebuild the solution

The project will fail to build because we have not specified any input files for the new OnVinylInterop project:

This will add the required files to the project. At this point we need to change the file properties:

The final step to enable the building of the interop project is to set some additional compiler properties:

From the Build menu select the Rebuild Solution entry to rebuild the solution.

**At this point if you are prompted that files have changed after executing the build, simply close down any open edit tab pages.

We must make changes to the object library to reference the interop project:

We also need to make changes to the way the code builds inside the object library:

We must make changes to the executable library to reference the interop project:

The final step is to indicate that we are running WPF mode and not UI Toolkit mode:

Now we can try to execute the build process and run the target executable:

The UI Toolkit maintenance program now has an updated user experience showing the vinyl collection in a grid with images and an imbedded input form. If you would like to compare you results, click here.

Previous Exercise Home Next Exercise