Extensibilidade da grelha de propriedades

Você pode personalizar a grade de propriedades exibida quando uma determinada atividade é selecionada no designer, criando uma experiência de edição avançada. O exemplo PropertyGridExtensibility mostra como isso pode ser feito.

Demonstra

Extensibilidade da grade de propriedades do designer de fluxo de trabalho.

Discussão

Para estender a grade de propriedades, um desenvolvedor tem opções para personalizar a aparência embutida de um editor de grade de propriedades ou fornecer uma caixa de diálogo que aparece para uma superfície de edição mais avançada. Há dois editores diferentes demonstrados nesta amostra; um editor embutido e um editor de diálogo.

Editor em linha

O exemplo do editor interno demonstra o que se segue:

• Cria um tipo que deriva de PropertyValueEditor.

• No construtor, o InlineEditorTemplate valor é definido com um modelo de dados do Windows Presentation Foundation (WPF). Isso pode ser vinculado a um modelo XAML, mas neste exemplo, o código é usado para inicializar a associação de dados.

• O modelo de dados tem um contexto de dados do item PropertyValue renderizado na grade de propriedades. Observe no código a seguir (de CustomInlineEditor.cs) que, neste contexto, se associa à propriedade Value.

  FrameworkElementFactory stack = new FrameworkElementFactory(typeof(StackPanel));
  FrameworkElementFactory slider = new FrameworkElementFactory(typeof(Slider));
  Binding sliderBinding = new Binding("Value");
  sliderBinding.Mode = BindingMode.TwoWay;
  slider.SetValue(Slider.MinimumProperty, 0.0);
  slider.SetValue(Slider.MaximumProperty, 100.0);
  slider.SetValue(Slider.ValueProperty, sliderBinding);
  stack.AppendChild(slider);
  

• Como a atividade e o designer estão no mesmo assembly, o registro dos atributos do designer de atividade é realizado no construtor estático da própria atividade, conforme mostrado no exemplo a seguir do SimpleCodeActivity.cs.

  static SimpleCodeActivity()
  {
      AttributeTableBuilder builder = new AttributeTableBuilder();
      builder.AddCustomAttributes(typeof(SimpleCodeActivity), "RepeatCount", new EditorAttribute(typeof(CustomInlineEditor), typeof(PropertyValueEditor)));
      builder.AddCustomAttributes(typeof(SimpleCodeActivity), "FileName", new EditorAttribute(typeof(FilePickerEditor), typeof(DialogPropertyValueEditor)));
      MetadataStore.AddAttributeTable(builder.CreateTable());
  }
  

Editor de diálogo

O exemplo de editor de diálogo demonstra o seguinte:

1. Cria um tipo que deriva de DialogPropertyValueEditor.

2. Define o valor de InlineEditorTemplate no construtor com um modelo de dados WPF. Isso pode ser criado em XAML, mas neste exemplo, isso é criado em código.

3. O modelo de dados tem um contexto de dados do item PropertyValue renderizado na grade de propriedades. No código a seguir, isso então se liga à Value propriedade. É fundamental incluir também um EditModeSwitchButton para fornecer o botão que abre a caixa de diálogo em FilePickerEditor.cs.

   this.InlineEditorTemplate = new DataTemplate();
   
   FrameworkElementFactory stack = new FrameworkElementFactory(typeof(StackPanel));
   stack.SetValue(StackPanel.OrientationProperty, Orientation.Horizontal);
   FrameworkElementFactory label = new FrameworkElementFactory(typeof(Label));
   Binding labelBinding = new Binding("Value");
   label.SetValue(Label.ContentProperty, labelBinding);
   label.SetValue(Label.MaxWidthProperty, 90.0);
   
   stack.AppendChild(label);
   
   FrameworkElementFactory editModeSwitch = new FrameworkElementFactory(typeof(EditModeSwitchButton));
   
   editModeSwitch.SetValue(EditModeSwitchButton.TargetEditModeProperty, PropertyContainerEditMode.Dialog);
   
   stack.AppendChild(editModeSwitch);
   
   this.InlineEditorTemplate.VisualTree = stack;
   

4. Substitui o ShowDialog método no tipo de designer para manipular a exibição da caixa de diálogo. Neste exemplo, um elemento básico FileDialog é apresentado.

   public override void ShowDialog(PropertyValue propertyValue, IInputElement commandSource)
   {
       Microsoft.Win32.OpenFileDialog ofd = new Microsoft.Win32.OpenFileDialog();
       if (ofd.ShowDialog() == true)
       {
           propertyValue.Value = ofd.FileName;
       }
   }
   

5. Como a atividade e o designer estão no mesmo assembly, o registro dos atributos do designer de atividade é realizado no construtor estático da própria atividade, conforme mostrado no exemplo a seguir do SimpleCodeActivity.cs.

   static SimpleCodeActivity()
   {
       AttributeTableBuilder builder = new AttributeTableBuilder();
       builder.AddCustomAttributes(typeof(SimpleCodeActivity), "RepeatCount", new EditorAttribute(typeof(CustomInlineEditor), typeof(PropertyValueEditor)));
       builder.AddCustomAttributes(typeof(SimpleCodeActivity), "FileName", new EditorAttribute(typeof(FilePickerEditor), typeof(DialogPropertyValueEditor)));
       MetadataStore.AddAttributeTable(builder.CreateTable());
   }
   

Para configurar, compilar e executar o exemplo

1. Crie a solução e abra Workflow1.xaml.

2. Arraste um SimpleCodeActivity da caixa de ferramentas para a tela do designer.

3. Clique em SimpleCodeActivity e, em seguida, abra a grade de propriedades onde há um controle deslizante e um controle de seleção de arquivos.