Nasıl Yapılır: Özel Etkinlik Tasarımcısı Oluşturma

Makale
03/05/2024

Özel etkinlik tasarımcıları genellikle, ilişkili etkinliklerinin tasarımcıları tasarım yüzeyine bırakılabilen diğer etkinliklerle birleştirilebilir olması için uygulanır. Bu işlevsellik, özel etkinlik tasarımcısının rastgele bir etkinliğin yerleştirilebileceği bir "bırakma bölgesi" sağlamasını ve ayrıca tasarım yüzeyinde ortaya çıkan öğe koleksiyonunu yönetme araçlarını sağlamasını gerektirir. Bu konuda, böyle bir bırakma bölgesi içeren bir özel etkinlik tasarımcısının nasıl oluşturulacağı ve tasarımcı öğelerinin koleksiyonunu yönetmek için gereken düzenleme işlevselliğini sağlayan bir özel etkinlik tasarımcısının nasıl oluşturulacağı açıklanmaktadır.

Özel etkinlik tasarımcıları genellikle belirli bir tasarımcı olmadan tüm etkinlikler için varsayılan temel etkinlik tasarımcısı türü olan öğesini devralır ActivityDesigner . Bu tür, özellik kılavuzuyla etkileşim kurmanın ve renkleri ve simgeleri yönetme gibi temel özellikleri yapılandırmanın tasarım zamanı deneyimini sağlar.

ActivityDesigner iki WorkflowItemPresenter yardımcı denetim kullanır ve WorkflowItemsPresenter özel etkinlik tasarımcıları geliştirmeyi kolaylaştırır. Alt öğeleri sürükleyip bırakma, bu alt öğelerin silinmesi, seçilmesi ve eklenmesi gibi yaygın işlevleri işler. içinde WorkflowItemPresenter tek bir alt kullanıcı arabirimi öğesine izin verir ve "bırakma bölgesini" sağlarken WorkflowItemsPresenter , öğesi de alt öğelerin sıralanması, taşınması, silinmesi ve eklenmesi gibi ek işlevler de dahil olmak üzere birden çok kullanıcı arabirimi öğesini destekleyebilir.

Özel etkinlik tasarımcısının uygulanmasında vurgulanması gereken hikayenin diğer önemli bölümü, tasarımcıda düzenlediğimiz düzenlemenin belleğinde depolanan örneğe WPF veri bağlaması kullanılarak görsel düzenlemelerin nasıl bağlandığıyla ilgilidir. Bu, değişiklik bildirimini etkinleştirmek ve durumlardaki değişiklikler gibi olayların izlenmesinden de sorumlu olan Model Öğesi ağacı tarafından gerçekleştirilir.

Bu konuda iki yordam özetlenmiştir.

İlk yordamda, diğer etkinlikleri alan bırakma bölgesini sağlayan bir WorkflowItemPresenter özel etkinlik tasarımcısının nasıl oluşturulacağı açıklanır. Bu yordam, Özel Bileşik Tasarım Aracı s - İş Akışı Öğesi Sunucusu örneğini temel alır.
İkinci yordamda, kapsanan öğeler koleksiyonunu düzenlemek için gereken işlevselliği sağlayan ile WorkflowItemsPresenter özel etkinlik tasarımcısı oluşturma işlemi açıklanmaktadır. Bu yordam, Özel Bileşik Tasarım Aracı - İş Akışı Öğeleri Sunucusu örneğini temel alır.

WorkflowItemPresenter kullanarak bırakma bölgesiyle özel etkinlik tasarımcısı oluşturmak için

Visual Studio 2010'ı başlatın.
Dosya menüsünde Yeni'nin üzerine gelin ve ardından Proje... öğesini seçin.

Yeni Proje iletişim kutusu açılır.
Yüklü Şablonlar bölmesinde tercih ettiğiniz dil kategorisinden Windows'u seçin.
Şablonlar bölmesinde WPF Uygulaması'nı seçin.
Ad kutusuna yazınUsingWorkflowItemPresenter.
Konum kutusuna projenizi kaydetmek istediğiniz dizini girin veya gözat'a tıklayarak bu dizine gidin.
Çözüm kutusunda varsayılan değeri kabul edin.
Tamam'a tıklayın.
Çözüm Gezgini MainWindows.xaml dosyasına sağ tıklayın, Sil'i seçin ve Microsoft Visual Studio iletişim kutusunda Tamam'ıonaylayın.
Çözüm Gezgini'da UsingWorkflowItemPresenter projesine sağ tıklayın, Ekle'yi ve ardından Yeni Öğe... öğesini seçerek Yeni Öğe Ekle iletişim kutusunu açın ve soldaki Yüklü Şablonlar bölümünden WPF kategorisini seçin.
Pencere (WPF) şablonunu seçin, adlandırın RehostingWFDesignerve Ekle'ye tıklayın.

RehostingWF Tasarım Aracı.xaml dosyasını açın ve uygulamanın kullanıcı arabirimini tanımlamak için aşağıdaki kodu içine yapıştırın:

<Window x:Class=" UsingWorkflowItemPresenter.RehostingWFDesigner"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:sapt="clr-namespace:System.Activities.Presentation.Toolbox;assembly=System.Activities.Presentation"
        xmlns:sys="clr-namespace:System;assembly=mscorlib"
        Title="Window1" Height="600" Width="900">
    <Window.Resources>
        <sys:String x:Key="AssemblyName">System.Activities, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35</sys:String>
    </Window.Resources>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="2*"/>
            <ColumnDefinition Width="7*"/>
            <ColumnDefinition Width="3*"/>
        </Grid.ColumnDefinitions>
        <Border Grid.Column="0">
            <sapt:ToolboxControl Name="Toolbox">
                <sapt:ToolboxCategory CategoryName="Basic">
                    <sapt:ToolboxItemWrapper AssemblyName="{StaticResource AssemblyName}" >
                        <sapt:ToolboxItemWrapper.ToolName>
                            System.Activities.Statements.Sequence
                        </sapt:ToolboxItemWrapper.ToolName>
                       </sapt:ToolboxItemWrapper>
                    <sapt:ToolboxItemWrapper  AssemblyName="{StaticResource AssemblyName}">
                        <sapt:ToolboxItemWrapper.ToolName>
                            System.Activities.Statements.WriteLine
                        </sapt:ToolboxItemWrapper.ToolName>

                    </sapt:ToolboxItemWrapper>
                    <sapt:ToolboxItemWrapper  AssemblyName="{StaticResource AssemblyName}">
                        <sapt:ToolboxItemWrapper.ToolName>
                            System.Activities.Statements.If
                        </sapt:ToolboxItemWrapper.ToolName>

                    </sapt:ToolboxItemWrapper>
                    <sapt:ToolboxItemWrapper  AssemblyName="{StaticResource AssemblyName}">
                        <sapt:ToolboxItemWrapper.ToolName>
                            System.Activities.Statements.While
                        </sapt:ToolboxItemWrapper.ToolName>

                    </sapt:ToolboxItemWrapper>
                </sapt:ToolboxCategory>
            </sapt:ToolboxControl>
        </Border>
        <Border Grid.Column="1" Name="DesignerBorder"/>
        <Border Grid.Column="2" Name="PropertyBorder"/>
    </Grid>
</Window>

Etkinlik tasarımcısını bir etkinlik türüyle ilişkilendirmek için bu etkinlik tasarımcısını meta veri deposuna kaydetmeniz gerekir. Bunu yapmak için yöntemini sınıfına RehostingWFDesigner ekleyinRegisterMetadata. yöntemi kapsamında RegisterMetadata bir AttributeTableBuilder nesnesi oluşturun ve öznitelikleri eklemek için yöntemini çağırın AddCustomAttributes . AddAttributeTable meta veri deposuna eklemek AttributeTable için yöntemini çağırın. Aşağıdaki kod, tasarımcı için yeniden barındırma mantığını içerir. Meta verileri kaydeder, araç kutusuna yerleştirir SimpleNativeActivity ve iş akışını oluşturur. Bu kodu RehostingWF Tasarım Aracı.xaml.cs dosyasına yerleştirin.

using System;
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;
using System.Windows;

namespace UsingWorkflowItemPresenter
{
    // Interaction logic for RehostingWFDesigner.xaml
    public partial class RehostingWFDesigner
    {
        public RehostingWFDesigner()
        {
            InitializeComponent();
        }

        protected override void OnInitialized(EventArgs e)
        {
            base.OnInitialized(e);
            // Register metadata.
            (new DesignerMetadata()).Register();
            RegisterCustomMetadata();
            // Add custom activity to toolbox.
            Toolbox.Categories.Add(new ToolboxCategory("Custom activities"));
            Toolbox.Categories[1].Add(new ToolboxItemWrapper(typeof(SimpleNativeActivity)));

            // Create the workflow designer.
            var wd = new WorkflowDesigner();
            wd.Load(new Sequence());
            DesignerBorder.Child = wd.View;
            PropertyBorder.Child = wd.PropertyInspectorView;

        }

        void RegisterCustomMetadata()
        {
            var builder = new AttributeTableBuilder();
            builder.AddCustomAttributes(typeof(SimpleNativeActivity), new DesignerAttribute(typeof(SimpleNativeDesigner)));
            MetadataStore.AddAttributeTable(builder.CreateTable());
        }
    }
}

Çözüm Gezgini'da Başvurular dizinine sağ tıklayın ve Başvuru Ekle ...öğesini seçerek Başvuru Ekle iletişim kutusunu açın.
.NET sekmesine tıklayın, System.Activities.Core.Presentation adlı derlemeyi bulun, seçin ve Tamam'a tıklayın.
Aynı yordamı kullanarak aşağıdaki derlemelere başvurular ekleyin:
1. System.Data.DataSetExtensions.dll
2. System.Activities.Presentation.dll
3. System.ServiceModel.Activities.dll
App.xaml dosyasını açın ve StartUpUri değerini "RehostingWF Tasarım Aracı.xaml" olarak değiştirin.
Çözüm Gezgini'da UsingWorkflowItemPresenter projesine sağ tıklayın, Ekle'yi ve ardından Yeni Öğe... öğesini seçerek Yeni Öğe Ekle iletişim kutusunu açın ve soldaki Yüklü Şablonlar bölümünde İş Akışı kategorisini seçin.
Etkinlik Tasarım Aracı şablonunu seçin, adlandırın SimpleNativeDesignerve Ekle'ye tıklayın.

SimpleNative Tasarım Aracı.xaml dosyasını açın ve içine aşağıdaki kodu yapıştırın. Bu kodun kök öğeniz olarak kullandığını ActivityDesigner ve bileşik etkinlik tasarımcınızda bir alt türün görüntülenebilmesi için bağlamanın tasarımcınızla tümleştirmek WorkflowItemPresenter için nasıl kullanıldığını gösterdiğine dikkat edin.

Not

için ActivityDesigner şeması, özel etkinlik tasarımcısı tanımınıza yalnızca bir alt öğenin eklenmesine izin verir; ancak bu öğe bir , Gridveya başka bir StackPanelbileşik UI öğesi olabilir.

<sap:ActivityDesigner x:Class=" UsingWorkflowItemPresenter.SimpleNativeDesigner"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:sap="clr-namespace:System.Activities.Presentation;assembly=System.Activities.Presentation"
    xmlns:sapv="clr-namespace:System.Activities.Presentation.View;assembly=System.Activities.Presentation">
    <sap:ActivityDesigner.Resources>
        <DataTemplate x:Key="Collapsed">
            <StackPanel>
                <TextBlock>This is the collapsed view</TextBlock>
            </StackPanel>
        </DataTemplate>
        <DataTemplate x:Key="Expanded">
            <StackPanel>
                <TextBlock>Custom Text</TextBlock>
                <sap:WorkflowItemPresenter Item="{Binding Path=ModelItem.Body, Mode=TwoWay}"
                                        HintText="Please drop an activity here" />
            </StackPanel>
        </DataTemplate>
        <Style x:Key="ExpandOrCollapsedStyle" TargetType="{x:Type ContentPresenter}">
            <Setter Property="ContentTemplate" Value="{DynamicResource Collapsed}"/>
            <Style.Triggers>
                <DataTrigger Binding="{Binding Path=ShowExpanded}" Value="true">
                    <Setter Property="ContentTemplate" Value="{DynamicResource Expanded}"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </sap:ActivityDesigner.Resources>
    <Grid>
        <ContentPresenter Style="{DynamicResource ExpandOrCollapsedStyle}" Content="{Binding}" />
    </Grid>
</sap:ActivityDesigner>

Çözüm Gezgini'da UsingWorkflowItemPresenter projesine sağ tıklayın, Ekle'yi ve ardından Yeni Öğe... öğesini seçerek Yeni Öğe Ekle iletişim kutusunu açın ve soldaki Yüklü Şablonlar bölümünde İş Akışı kategorisini seçin.
Kod Etkinliği şablonunu seçin, adlandırın SimpleNativeActivityve Ekle'ye tıklayın.

SimpleNativeActivity SimpleNativeActivity.cs dosyasına aşağıdaki kodu girerek sınıfını uygulayın:

using System.Activities;

namespace UsingWorkflowItemPresenter
{
    public sealed class SimpleNativeActivity : NativeActivity
    {
        // this property contains an activity that will be scheduled in the execute method
        // the WorkflowItemPresenter in the designer is bound to this to enable editing
        // of the value
        public Activity Body { get; set; }

        protected override void CacheMetadata(NativeActivityMetadata metadata)
        {
           metadata.AddChild(Body);
           base.CacheMetadata(metadata);

        }

        protected override void Execute(NativeActivityContext context)
        {
            context.ScheduleActivity(Body);
        }
    }
}

Derleme menüsünden Çözüm Derle'yiseçin.
Yeniden barındırılan özel tasarım penceresini açmak için Hata Ayıklama menüsünden Hata Ayıklama Olmadan Başlat'ı seçin.

WorkflowItemsPresenter kullanarak özel etkinlik tasarımcısı oluşturmak için

İkinci özel etkinlik tasarımcısının yordamı, ilki birkaç değişiklikle paraleldir ve bunlardan ilki ikinci uygulamayı UsingWorkflowItemsPresenteradlandırmaktır. Ayrıca bu uygulama yeni bir özel etkinlik tanımlamaz.

Önemli farklar CustomParallel Tasarım Aracı.xaml ve RehostingWF Tasarım Aracı.xaml.cs dosyalarında bulunur. Kullanıcı arabirimini tanımlayan CustomParallel Tasarım Aracı.xaml dosyasındaki kod aşağıdadır:

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

Yeniden barındırma mantığını sağlayan RehostingWF Tasarım Aracı.xaml.cs dosyasındaki kod aşağıda verilmiştir:

using System;
using System.Activities.Core.Presentation;
using System.Activities.Presentation;
using System.Activities.Presentation.Metadata;
using System.Activities.Statements;
using System.ComponentModel;
using System.Windows;

namespaceUsingWorkflowItemsPresenter
{
    public partial class RehostingWfDesigner : Window
    {
        public RehostingWfDesigner()
        {
            InitializeComponent();
        }

        protected override void OnInitialized(EventArgs e)
        {
            base.OnInitialized(e);
            // Register metadata.
            (new DesignerMetadata()).Register();
            RegisterCustomMetadata();

            // Create the workflow designer.
            var wd = new WorkflowDesigner();
            wd.Load(new Sequence());
            DesignerBorder.Child = wd.View;
            PropertyBorder.Child = wd.PropertyInspectorView;

        }

        void RegisterCustomMetadata()
        {
            var builder = new AttributeTableBuilder();
            builder.AddCustomAttributes(typeof(Parallel), new DesignerAttribute(typeof(CustomParallelDesigner)));
            MetadataStore.AddAttributeTable(builder.CreateTable());
        }
    }
}

Aracılığıyla paylaş

Nasıl Yapılır: Özel Etkinlik Tasarımcısı Oluşturma

WorkflowItemPresenter kullanarak bırakma bölgesiyle özel etkinlik tasarımcısı oluşturmak için

WorkflowItemsPresenter kullanarak özel etkinlik tasarımcısı oluşturmak için

Ayrıca bkz.

Geri Bildirim

Ek kaynaklar