wpfvisual-studioworkflowworkflow-foundation-4

Rehosted Microsoft Workflow Designer UI

I have recently created a rehosted Workflow Designer application and noticed that the UI looks outdated when compared with how it looks in Visual Studio. Does anyone know which could be the problem?

No matter what version of .NET I'm using (for example 4.6 or 4.7), the UI still doesn't update. I have also followed the next article to enable Workflow 4.5 features, but without any success on the UI side.

(WF4.5) Enabling new .Net framework 4.5 features in your rehosted designer application https://blogs.msdn.microsoft.com/tilovell/2012/06/04/wf4-5-enabling-new-net-framework-4-5-features-in-your-rehosted-designer-application

In the rehosted WF application it looks like this:

enter image description here

While in Visual Studio 2017 Community Edition if looks like this (notice the updated colours, icons and toolbox):

enter image description here

Any clues? Thanks!

Solution

  • I know it's an old topic but i finally found the solution to this problem after alot of googling with no real results. CoreWF won't help with the visuals, just with the .net update. The solution to your problem, aka to have the same visual representation in the rehosting as it is in visual studio is adding WorkflowDesignerIcons.UseWindowsStoreAppStyleIcons(); to your code anywhere really. I added it after initializing the Workflow Designer.

            WorkflowDesigner WF = new WorkflowDesigner();
        WorkflowDesignerIcons.UseWindowsStoreAppStyleIcons();

        WF.Context.Services.GetService<DesignerConfigurationService>().PanModeEnabled = true;
        WF.Context.Services.GetService<DesignerConfigurationService>().AutoSurroundWithSequenceEnabled = true;
        WF.Context.Services.GetService<DesignerConfigurationService>().AutoConnectEnabled = true;
        WF.Context.Services.GetService<DesignerConfigurationService>().MultipleItemsContextMenuEnabled = true;
        WF.Context.Services.GetService<DesignerConfigurationService>().MultipleItemsDragDropEnabled = true;

    I also added some other features you might want to enable for the designer.