カスタム複合デザイナー - Workflow Items PresenterCustom Composite Designers - Workflow Items Presenter

System.Activities.Presentation.WorkflowItemsPresenter は、格納されている要素のコレクションを編集できる、WF デザイナー プログラミング モデル内の主要な型です。The System.Activities.Presentation.WorkflowItemsPresenter is a key type in the WF designer programming model that allows for the editing of a collection of contained elements. このサンプルでは、このような編集可能なコレクションを表示するアクティビティ デザイナーの構築方法を示します。This sample shows how to build an activity designer that surfaces such an editable collection.

このサンプルでは、次の方法を示します。This sample demonstrates:

  • System.Activities.Presentation.WorkflowItemsPresenter を使用したカスタム アクティビティ デザイナーの作成Creating a custom activity designer with a System.Activities.Presentation.WorkflowItemsPresenter.

  • "折りたたまれた" ビューと "展開済み" ビューを使用してアクティビティデザイナーを作成する。Creating an activity designer with a "collapsed" and "expanded" view.

  • 再ホストされたアプリケーションでの既定のデザイナーのオーバーライドOverriding a default designer in a rehosted application.

サンプルをセットアップ、ビルド、および実行するSet up, build, and run the sample

  1. または Visual Studio 2010 の Visual Basic 用の UsingWorkflowItemsPresenter サンプルソリューションを開きます。 C#Open the UsingWorkflowItemsPresenter.sln sample solution for C# or for Visual Basic in Visual Studio 2010.

  2. ソリューションをビルドして実行します。Build and run the solution.

    再ホストされたワークフローデザイナーアプリケーションが開き、キャンバスにアクティビティをドラッグできるようになります。A rehosted workflow designer application opens, and you can drag activities onto the canvas.

サンプルの詳細Sample Highlights

このサンプルのコードには、次の内容が表示されます。The code for this sample shows the following:

  • デザイナーをビルドするアクティビティは Parallel です。The activity a designer is built for: Parallel

  • System.Activities.Presentation.WorkflowItemsPresenter を使用してカスタム アクティビティ デザイナーを作成します。The creation of a custom activity designer with a System.Activities.Presentation.WorkflowItemsPresenter. 次の点に注意してください。A few things to point out:

    • ModelItem.Branches にバインドする WPF のデータ バインディングの使用に注意してください。Note the use of WPF data binding to bind to ModelItem.Branches. ModelItem は、デザイナーが使用されている、基になるオブジェクト (この例では WorkflowElementDesigner) を参照する Parallel のプロパティです。ModelItem is the property on WorkflowElementDesigner that refers to the underlying object the designer is being used for, in this case, our Parallel.

    • WorkflowItemsPresenter.SpacerTemplate は、コレクション内の個々の項目間にビジュアル表示を配置するために使用できます。The WorkflowItemsPresenter.SpacerTemplate can be used to put a visual to display between the individual items in the collection.

    • WorkflowItemsPresenter.ItemsPanel は、コレクション内の項目のレイアウトを決定するために提供できるテンプレートです。WorkflowItemsPresenter.ItemsPanel is a template that can be provided to determine the layout of the items in the collection. この例では、水平方向のスタック パネルが使用されます。In this case, a horizontal stack panel is used.

    このコード例を次に示します。This following example code shows this.

    <sad:WorkflowItemsPresenter HintText="Drop Activities Here"
                                  Items="{Binding Path=ModelItem.Branches}">
        <sad:WorkflowItemsPresenter.SpacerTemplate>
          <DataTemplate>
            <Ellipse Width="10" Height="10" Fill="Black"/>
          </DataTemplate>
        </sad:WorkflowItemsPresenter.SpacerTemplate>
        <sad:WorkflowItemsPresenter.ItemsPanel>
          <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal"/>
          </ItemsPanelTemplate>
        </sad:WorkflowItemsPresenter.ItemsPanel>
      </sad:WorkflowItemsPresenter>
    
  • DesignerAttributeParallel 型への関連付けを実行し、報告された属性を出力します。Perform an association of the DesignerAttribute to the Parallel type and then output the attributes reported.

    • 最初に、すべての既定のデザイナーを登録します。First, register all of the default designers.

      このコード例を次に示します。The following is the code example.

      // register metadata
      (new DesignerMetadata()).Register();
      RegisterCustomMetadata();
      
      ' register metadata
      Dim metadata = New DesignerMetadata()
      metadata.Register()
      ' register custom metadata
      RegisterCustomMetadata()
      
    • 次に、RegisterCustomMetadata メソッドで parallel をオーバーライドします。Then, override the parallel in RegisterCustomMetadata method.

      次に、C# と Visual Basic のコード例をそれぞれ示します。The following code shows this in C# and Visual Basic.

      void RegisterCustomMetadata()
      {
            AttributeTableBuilder builder = new AttributeTableBuilder();
            builder.AddCustomAttributes(typeof(Parallel), new DesignerAttribute(typeof(CustomParallelDesigner)));
            MetadataStore.AddAttributeTable(builder.CreateTable());
      }
      
      Sub RegisterCustomMetadata()
         Dim builder As New AttributeTableBuilder()
         builder.AddCustomAttributes(GetType(Parallel), New DesignerAttribute(GetType(CustomParallelDesigner)))
         MetadataStore.AddAttributeTable(builder.CreateTable())
      End Sub
      
  • 最後に、さまざまなデータ テンプレートとトリガーを使用して、IsRootDesigner プロパティに基づいて適切なテンプレートを選択していることに注目してください。Finally, note the use of differing data templates and triggers to select the appropriate template based on the IsRootDesigner property.

    このコード例を次に示します。The following is the code example.

    <sad:ActivityDesigner x:Class="Microsoft.Samples.CustomParallelDesigner"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:sad="clr-namespace:System.Activities.Design;assembly=System.Activities.Design"
        xmlns:sadv="clr-namespace:System.Activities.Design.View;assembly=System.Activities.Design">
      <sad:ActivityDesigner.Resources>
        <DataTemplate x:Key="Expanded">
          <StackPanel>
            <TextBlock>This is the Expanded View</TextBlock>
            <sad:WorkflowItemsPresenter HintText="Drop Activities Here"
                                        Items="{Binding Path=ModelItem.Branches}">
              <sad:WorkflowItemsPresenter.SpacerTemplate>
                <DataTemplate>
                  <Ellipse Width="10" Height="10" Fill="Black"/>
                </DataTemplate>
              </sad:WorkflowItemsPresenter.SpacerTemplate>
              <sad:WorkflowItemsPresenter.ItemsPanel>
                <ItemsPanelTemplate>
                  <StackPanel Orientation="Horizontal"/>
                </ItemsPanelTemplate>
              </sad:WorkflowItemsPresenter.ItemsPanel>
            </sad:WorkflowItemsPresenter>
          </StackPanel>
        </DataTemplate>
        <DataTemplate x:Key="Collapsed">
          <TextBlock>This is the Collapsed View</TextBlock>
        </DataTemplate>
        <Style x:Key="ExpandOrCollapsedStyle" TargetType="{x:Type ContentPresenter}">
          <Setter Property="ContentTemplate" Value="{DynamicResource Collapsed}"/>
          <Style.Triggers>
            <DataTrigger Binding="{Binding Path=IsRootDesigner}" Value="true">
              <Setter Property="ContentTemplate" Value="{DynamicResource Expanded}"/>
            </DataTrigger>
          </Style.Triggers>
        </Style>
      </sad: ActivityDesigner.Resources>
      <Grid>
        <ContentPresenter Style="{DynamicResource ExpandOrCollapsedStyle}" Content="{Binding}"/>
      </Grid>
    </sad: ActivityDesigner>
    

重要

サンプルは、既にコンピューターにインストールされている場合があります。The samples may already be installed on your machine. 続行する前に、次の (既定の) ディレクトリを確認してください。Check for the following (default) directory before continuing.

<InstallDrive>:\WF_WCF_Samples

このディレクトリが存在しない場合は、 Windows Communication Foundation (wcf) および Windows Workflow Foundation (WF) のサンプルの .NET Framework 4にアクセスして、すべての WINDOWS COMMUNICATION FOUNDATION (wcf) と WFWF サンプルをダウンロードしてください。If this directory does not exist, go to Windows Communication Foundation (WCF) and Windows Workflow Foundation (WF) Samples for .NET Framework 4 to download all Windows Communication Foundation (WCF) and WFWF samples. このサンプルは、次のディレクトリに格納されます。This sample is located in the following directory.

<InstallDrive>:\WF_WCF_Samples\WF\Basic\CustomActivities\CustomActivityDesigners\WorkflowItemsPresenter

関連項目See also