EditeTemplate を利用することで、XamDiagram の DiagramNode に、デフォルト以外のユーザーコントロールを配置することができます。

XAML での設定は下記ヘルプページを参照下さい。

ダイアグラム項目の内容の視覚化の構成 (xamDiagram)
https://jp.infragistics.com/help/wpf/20.2/xamdiagram-styling-items-templates

下記、C# での設定方法となります。

private void diagram_Loaded(object sender, RoutedEventArgs e)
{
    // StackPanel
    var stackPanelFactory = new FrameworkElementFactory(typeof(StackPanel));
    stackPanelFactory.SetValue(StackPanel.MarginProperty, new Thickness(15.0));

    // TextBox
    var textBoxFactory = new FrameworkElementFactory(typeof(TextBox));
    textBoxFactory.SetValue(TextBox.BackgroundProperty, Brushes.Purple);
    textBoxFactory.SetValue(TextBox.ForegroundProperty, Brushes.White);
    textBoxFactory.SetBinding(
        TextBox.TextProperty, 
        new Binding { 
            Path = new PropertyPath("Content"),
            RelativeSource = new RelativeSource(RelativeSourceMode.FindAncestor, typeof(DiagramNode), 1),
            Mode = BindingMode.TwoWay
        }
    );
    textBoxFactory.AddHandler(LoadedEvent, new RoutedEventHandler(textBoxLoadedEvent), true);

    // Grid
    var gridFactory = new FrameworkElementFactory(typeof(Grid));
    gridFactory.SetValue(Grid.BackgroundProperty, new SolidColorBrush(Colors.Green));
    gridFactory.SetValue(Grid.HeightProperty, 30.0);

    // StackPanel 内に TextBox を配置する。
    stackPanelFactory.AppendChild(textBoxFactory);
    // StackPanel 内に Grid を配置する。
    stackPanelFactory.AppendChild(gridFactory);
    
    var template = new DataTemplate { VisualTree = stackPanelFactory };

    var node = this.diagram.Items[0] as DiagramNode;
    // EditorTemplate に、StackPanel、TextBox、Grid を設定する。
    node.EditTemplate = template;
}

private void textBoxLoadedEvent(object sender, RoutedEventArgs e)
{
    var textBox = sender as TextBox;
    textBox.Focus();
    textBox.SelectAll();
}

実行結果

Tagged:

製品について

Ultimate UI for WPF