Associating a WF4 activity designer to a custom activity using MetadataStore

In VS2010 Beta 2 you can associate your own activity designer with a custom activity in one of two ways:

Using System.ComponentModel.DesignerAttribute on the custom activity
Implementing System.Activities.Presentation.Metadata.IRegisterMetadata, using the Register() method to set up the association at run-time

It should be obvious that option (1) couples your custom activity directly to a specific designer. While not ideal, in many cases this is sufficient. But, there are some scenarios that require a looser coupling. For example, I may want to choose one of several designers at run-time – based on the user’s authorization. This post describes the steps needed to implement option (2) – because it’s a little tricky.

First, let’s assume we have a project in our solution called MyActivities. Let’s also assume that this project contains a custom activity called SendEmailActivity. This activity derives from CodeActivity and simply uses System.Net.Mail.SmtpClient to send an email within the Execute() method. Our SendEmailActivity activity has several InArguments – to allow the user to set the email address, subject, body, etc. The code for our SendEmailActivity might look like this:

        1: using System;

       2: using System.Activities;

       3: using System.Net.Mail;

       4:  

       5: namespace MyActivities

       6: {

       7:     public class SendEmailActivity : CodeActivity 

       8:     {

       9:         public InArgument<string> To { get; set; }

        public InArgument<string> From { get; set; }

        public InArgument<string> Subject { get; set; }

        public InArgument<string> Body { get; set; }

        public InArgument<string> Host { get; set; }

  

        protected override void Execute(CodeActivityContext context)

        {

            SmtpClient client = new SmtpClient(Host.Get(context));

  

            try

            {

                client.Send(

                    From.Get(context),

                    To.Get(context),

                    Subject.Get(context),

                    Body.Get(context));

            }

            catch (Exception ex)

            {

                string error = ex.Message;

                if (ex.InnerException != null)

                {

                    error = ex.InnerException.Message;

                }

                Console.WriteLine("Failure sending email: " + error);

            }

        }

    }

}

So now, to create an activity designer and associate it to the SendEmailActivity:

Create a Workflow Activity Designer Library project in the same solution with a name that appends ".VisualStudio.Design" to the name of the project where the custom activity resides. In this example, the name would be MyActivities.VisualStudio.Design
Create your activity designer. We'll call the designer class SendEmailActivityDesigner. (I’ve pasted the XAML for this designer at the end of this post)
From the new designer project (MyActivities.VisualStudio.Design), reference the following:
1. MyActivities - as a project reference
2. PresentationFramework
3. System.Activities.Core.Presentation
4. System.Activities.Presentation
In the code behind for the activity designer's XAML (SendEmailActivityDesigner.xaml.cs), implement the IRegisterMetadata interface. This includes utilizing Metadatastore in the IRegisterMetadata.Register() method. The code should look like this:

       1: using System.Activities.Presentation.Metadata;

       2: using System.ComponentModel;

       3:  

       4: namespace MyActivities.VisualStudio.Design

       5: {

       6:     public partial class SendEmailActivityDesigner : IRegisterMetadata

       7:     {

       8:         public SendEmailActivityDesigner()

       9:         {

      10:             InitializeComponent();

      11:         }

      12:  

      13:         public void Register()

      14:         {

      15:             AttributeTableBuilder builder = new AttributeTableBuilder();

      16:             builder.AddCustomAttributes(

      17:                 typeof(SendEmailActivity), 

      18:                 new DesignerAttribute(typeof(SendEmailActivityDesigner)));

      19:             MetadataStore.AddAttributeTable(builder.CreateTable());

      20:         }

      21:     }

      22: }

Now, in order for the VS activity designer to "see" your designer for the corresponding activity you need to make sure the MyActivities.VisualStudio.Design.dll file ends up in the same folder as MyActivities.dll. I've done this so far with a simple post-build event on the MyActivities.VisualStudio.Design project.

Then, finally, in the project that contains the workflow on which you want to drag-and-drop the SendEmailActivity make sure you add project references to both MyActivities and MyActivities.VisualStudio.Design.

* Note that this works only for the Visual Studio hosted workflow designer. If you re-host the designer in your own application you need to remove the "VisualStudio" part of the project/DLL name from your activity designer project. In our example this would be: MyActivities.Design.

Here’s the XAML code for the SendEmailActivityDesigner designer. The code-behind content is above, under step 4. (I’m certainly no WPF expert so go easy on me!)

       1: <sap:ActivityDesigner x:Class="MyActivities.VisualStudio.Design.SendEmailActivityDesigner"

       2:     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

       3:     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

       4:     xmlns:sap="clr-namespace:System.Activities.Presentation;assembly=System.Activities.Presentation"

       5:     xmlns:sapv="clr-namespace:System.Activities.Presentation.View;assembly=System.Activities.Presentation" 

       6:     xmlns:sapc="clr-namespace:System.Activities.Presentation.Converters;assembly=System.Activities.Presentation">

       7:     <sap:ActivityDesigner.Resources>

       8:         <sapc:ArgumentToExpressionConverter

       9:             x:Key="ArgumentToExpressionConverter"

            x:Uid="swdv:ArgumentToExpressionConverter_1" />

    </sap:ActivityDesigner.Resources>

  

    <Grid>

        <Grid.RowDefinitions>

            <RowDefinition></RowDefinition>

            <RowDefinition></RowDefinition>

            <RowDefinition></RowDefinition>

            <RowDefinition></RowDefinition>

            <RowDefinition></RowDefinition>

        </Grid.RowDefinitions>

        <Grid.ColumnDefinitions>

            <ColumnDefinition Width=".4*"></ColumnDefinition>

            <ColumnDefinition Width=".6*"></ColumnDefinition>

        </Grid.ColumnDefinitions>

  

        <TextBlock 

            Grid.Row="0"

            Grid.Column="0"

            Text="Host: " />

  

        <sapv:ExpressionTextBox

            Name ="HostTextBox"

            Grid.Row="0"

            Grid.Column="1"

            Expression="{Binding Path=ModelItem.Host, Mode=TwoWay,

                Converter={StaticResource ArgumentToExpressionConverter},

               ConverterParameter=In}" OwnerActivity="{Binding Path=ModelItem}"

                MinLines="1" MaxLines="1" MinWidth="100"

                HintText="Host"/>

  

        <TextBlock 

            Grid.Row="1"

            Grid.Column="0"

            Text="From: " />

  

        <sapv:ExpressionTextBox 

            Grid.Row="1"

            Grid.Column="1"

            Expression="{Binding Path=ModelItem.From, Mode=TwoWay,

                Converter={StaticResource ArgumentToExpressionConverter},

               ConverterParameter=In}" OwnerActivity="{Binding Path=ModelItem}"

                MinLines="1" MaxLines="1" MinWidth="100"

                HintText="From"/>

  

        <TextBlock 

            Grid.Row="2"

            Grid.Column="0"

            Text="To: " />

  

        <sapv:ExpressionTextBox 

            Grid.Row="2"

            Grid.Column="1"

            Expression="{Binding Path=ModelItem.To, Mode=TwoWay,

                Converter={StaticResource ArgumentToExpressionConverter},

               ConverterParameter=In}" OwnerActivity="{Binding Path=ModelItem}"

                MinLines="1" MaxLines="1" MinWidth="100"

                HintText="To"/>

  

        <TextBlock 

            Grid.Row="3"

            Grid.Column="0"

            Text="Subject: " />

  

        <sapv:ExpressionTextBox 

            Grid.Row="3"

            Grid.Column="1"

            Expression="{Binding Path=ModelItem.Subject, Mode=TwoWay,

                Converter={StaticResource ArgumentToExpressionConverter},

               ConverterParameter=In}" OwnerActivity="{Binding Path=ModelItem}"

                MinLines="1" MaxLines="1" MinWidth="100"

                HintText="Subject"/>

  

        <TextBlock 

            Grid.Row="4"

            Grid.Column="0"

            Text="Body: " />

  

        <sapv:ExpressionTextBox 

            Grid.Row="4"

            Grid.Column="1"

            Expression="{Binding Path=ModelItem.Body, Mode=TwoWay,

                Converter={StaticResource ArgumentToExpressionConverter},

               ConverterParameter=In}" OwnerActivity="{Binding Path=ModelItem}"

                MinLines="10" MaxLines="15" MinWidth="700" MinHeight="100"

                HintText="Body"/>

    </Grid>

</sap:ActivityDesigner>

Posted on Tuesday, January 26, 2010 9:27 AM | Back to top

Comments on this post: Associating a WF4 activity designer to a custom activity using MetadataStore

# re: Associating a WF4 activity designer to a custom activity using MetadataStore

Hi, Excellent article.
Helped me a lot. I'm very new to workflow and started off with custom activities.
they work absolutely fine. My next step is to associate a designer to it.
Bit silly question, but the xaml was not generated but you had to write all the fields? :(
Apologies if i'm sounding bit silly

Left by Kavya on Feb 07, 2011 9:41 AM

Very interesting especially the IRegisterMetadata interface

Left by Sheshonq on Jul 27, 2011 1:08 PM

how would I add xaml ui ?
For example, a box to hold the Body, To, from Etc.

Left by peter cli on Dec 08, 2011 7:42 PM

@ peter cli

Adding the UI for the custom Activity Designer is what I did above - i.e. the XAML is used in the .xaml file for the custom designer when you are creating it in Visual Studio.

Does that answer your question?

Left by Jamie on Dec 09, 2011 2:39 PM

please remove the line numbers, we are in 2012 :)

Left by Alex on Dec 06, 2012 2:00 PM

Very clear and useful ... thanks for posting it.

Left by Manuel Sánchez on May 05, 2016 3:20 AM