Edit

Task 3: Create the Toolbox and PropertyGrid Panes

  • Article

In this task, you will create the Toolbox and PropertyGrid panes and add them to the rehosted Windows Workflow Designer.

For reference, the code that should be in the MainWindow.xaml.cs file after completing the three tasks in the Rehosting the Workflow Designer series of topics is provided at the end of this topic.

To create the Toolbox and add it to the grid

  1. Open the HostingApplication project you obtained by following the procedure described in Task 2: Host the Workflow Designer.

  2. In the Solution Explorer pane, right-click the MainWindow.xaml file and select View Code.

  3. Add a GetToolboxControl method to the MainWindow class that creates a ToolboxControl, adds a new Toolbox category to the Toolbox, and assigns the Assign and Sequence activity types to that category.

    private ToolboxControl GetToolboxControl()
{
    // Create the ToolBoxControl.
    var ctrl = new ToolboxControl();

    // Create a category.
    var category = new ToolboxCategory("category1");

    // Create Toolbox items.
    var tool1 =
        new ToolboxItemWrapper("System.Activities.Statements.Assign",
        typeof(Assign).Assembly.FullName, null, "Assign");

    var tool2 = new ToolboxItemWrapper("System.Activities.Statements.Sequence",
        typeof(Sequence).Assembly.FullName, null, "Sequence");

    // Add the Toolbox items to the category.
    category.Add(tool1);
    category.Add(tool2);

    // Add the category to the ToolBox control.
    ctrl.Categories.Add(category);
    return ctrl;
}

  4. Add a private AddToolbox method to the MainWindow class that places the Toolbox in the left column on the grid.

    private void AddToolBox()
{
    ToolboxControl tc = GetToolboxControl();
    Grid.SetColumn(tc, 0);
    grid1.Children.Add(tc);
}

  5. Add a call to the AddToolBox method in the MainWindow() class constructor as shown in the following code:

    public MainWindow()
{
    InitializeComponent();
    this.RegisterMetadata();
    this.AddDesigner();

    this.AddToolBox();
}

  6. Press F5 to build and run your solution. The Toolbox containing the Assign and Sequence activities should be displayed.

To create the PropertyGrid

  1. In the Solution Explorer pane, right-click the MainWindow.xaml file and select View Code.

  2. Add the AddPropertyInspector method to the MainWindow class to place the PropertyGrid pane in the rightmost column on the grid:

    private void AddPropertyInspector()
{
    Grid.SetColumn(wd.PropertyInspectorView, 2);
    grid1.Children.Add(wd.PropertyInspectorView);
}

  3. Add a call to the AddPropertyInspector method in the MainWindow() class constructor as shown in the following code:

    public MainWindow()
{
    InitializeComponent();
    this.RegisterMetadata();
    this.AddDesigner();
    this.AddToolBox();

    this.AddPropertyInspector();
}

  4. Press F5 to build and run the solution. The Toolbox, workflow design canvas, and PropertyGrid panes should all be displayed, and when you drag an Assign activity or a Sequence activity onto the design canvas, the property grid should update depending on the highlighted activity.

Example

The MainWindow.xaml.cs file should now contain the following code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
// dlls added.
using System.Activities;
using System.Activities.Core.Presentation;
using System.Activities.Presentation;
using System.Activities.Presentation.Metadata;
using System.Activities.Presentation.Toolbox;
using System.Activities.Statements;
using System.ComponentModel;

namespace HostingApplication
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        private WorkflowDesigner wd;

        public MainWindow()
        {
            InitializeComponent();
            RegisterMetadata();
            AddDesigner();
            this.AddToolBox();
            this.AddPropertyInspector();
        }

        private void AddDesigner()
        {
            // Create an instance of WorkflowDesigner class.
            this.wd = new WorkflowDesigner();

            // Place the designer canvas in the middle column of the grid.
            Grid.SetColumn(this.wd.View, 1);

            // Load a new Sequence as default.
            this.wd.Load(new Sequence());

            // Add the designer canvas to the grid.
            grid1.Children.Add(this.wd.View);
        }

        private void RegisterMetadata()
        {
            var dm = new DesignerMetadata();
            dm.Register();
        }

        private ToolboxControl GetToolboxControl()
        {
            // Create the ToolBoxControl.
            var ctrl = new ToolboxControl();

            // Create a category.
            var category = new ToolboxCategory("category1");

            // Create Toolbox items.
            var tool1 =
                new ToolboxItemWrapper("System.Activities.Statements.Assign",
                typeof(Assign).Assembly.FullName, null, "Assign");

            var tool2 = new ToolboxItemWrapper("System.Activities.Statements.Sequence",
                typeof(Sequence).Assembly.FullName, null, "Sequence");

            // Add the Toolbox items to the category.
            category.Add(tool1);
            category.Add(tool2);

            // Add the category to the ToolBox control.
            ctrl.Categories.Add(category);
            return ctrl;
        }

        private void AddToolBox()
        {
            ToolboxControl tc = GetToolboxControl();
            Grid.SetColumn(tc, 0);
            grid1.Children.Add(tc);
        }

        private void AddPropertyInspector()
        {
            Grid.SetColumn(wd.PropertyInspectorView, 2);
            grid1.Children.Add(wd.PropertyInspectorView);
        }

    }
}

See also