This is a migrated thread and some comments may be shown as answers.

Accessing RadDiagramShape of GraphSource members

4 Answers 141 Views
Diagram
This is a migrated thread and some comments may be shown as answers.
Matthias
Top achievements
Rank 1
Matthias asked on 12 May 2017, 07:18 PM

I created a setup that closely matches the MVVM examples on http://docs.telerik.com/devtools/wpf/controls/raddiagram/populating-with-data/data-databinding. The RadDiagram is populated via a Graphsource. Peeking at the behind-the-scenes, it looks like the diagram wrap each item of the InternalItems collection in a RadDiagramShape to display it. How do I actually access those RadDiagramShape objects for each node so that I can manipulate it via code?

4 Answers, 1 is accepted

Sort by
0
Matthias
Top achievements
Rank 1
answered on 12 May 2017, 07:24 PM
As an example: say I have a list of nodes that I load and feed into the diagram via the Graphsource. Links between those nodes are specified separately (and I'm not using the built-in serialization for diagram graphs, I construct it myself at runtime). I now want to construct all links between the nodes that I fed into the diagram, including which connector each link originates from and flows into. As far as I can tell, I need to modify the RadDiagramShape that each of my node objects was wrapped by. How do I actually access them? My nodes don't have any knowledge of their wrappers.
0
Matthias
Top achievements
Rank 1
answered on 12 May 2017, 07:26 PM
For example: I have a list of nodes that I load manually and feed into the diagram's GraphSource. Links are loaded seperately, and I want to create all those links between each node programmatically. (I'm not using the built-in diagram serialization and don't want to). How do I actually generate the connections, specifying which connector port they come from and go to? As far as I can see I need to do this on the RadDiagramShapes that each of my nodes got wrapped into as part of the GraphSource. Correct? If so, how do I access them? My node objects have no knowledge of their wrappers.
0
Accepted
Petar Mladenov
Telerik team
answered on 15 May 2017, 07:51 AM
Hi Matthias,

I am sedning you sample project with two ways you can add connection linking specific connectors. Basically you will see the first approach commented and the second, which is more MVVM - uncommented:
private void RadButton_Click(object sender, RoutedEventArgs e)
       {
           // Variant 1. Models => Container Generator => Shapes => AddConnection method.
           //var golf = (this.diagram.GraphSource as CarsGraphSource).InternalItems[4];
           //var audi = (this.diagram.GraphSource as CarsGraphSource).InternalItems[7];
 
           //var golfShape = this.diagram.ContainerGenerator.ContainerFromItem(golf) as RadDiagramShape;
           //var audiShape = this.diagram.ContainerGenerator.ContainerFromItem(audi) as RadDiagramShape;
 
           //this.diagram.AddConnection(golfShape, audiShape, "Top", "Bottom");
 
           // Variant 2.
           var golf = (this.diagram.GraphSource as CarsGraphSource).InternalItems[4];
           var audi = (this.diagram.GraphSource as CarsGraphSource).InternalItems[7];
 
           Link link = new Link()
           {
               Source = golf,
               Target = audi,
               SourceConnectorString = "Top",
               TargetConnectorString = "Bottom"
           };
           (this.diagram.GraphSource as CarsGraphSource).AddLink(link);
       }

The second requires the following properties and styles:
public class Link : LinkViewModelBase<NodeViewModelBase>
    {       
        private string sourceConnectorPos;
        public string SourceConnectorString
        {
            get
            {
                return this.sourceConnectorPos ?? "Auto";
            }
            set
            {
                if (this.sourceConnectorPos != value)
                {
                    this.sourceConnectorPos = value;
                    this.OnPropertyChanged("SourceConnectorString");
                }
            }
        }
 
        private string targetConnectorPos;
        public string TargetConnectorString
        {
            get
            {
                return this.targetConnectorPos ?? "Auto";
            }
            set
            {
                if (this.targetConnectorPos != value)
                {
                    this.targetConnectorPos = value;
                    this.OnPropertyChanged("TargetConnectorString");
                }
            }
        }
    }

<telerik:RadDiagram.ConnectionStyle>
              <Style TargetType="telerik:RadDiagramConnection">
                  <Setter Property="SourceConnectorPosition" Value="{Binding SourceConnectorString, Mode=TwoWay}" />
                  <Setter Property="TargetConnectorPosition" Value="{Binding TargetConnectorString, Mode=TwoWay}" />
              </Style>
          </telerik:RadDiagram.ConnectionStyle>

I hope this helps you move forward.

Regards,
Petar Mladenov
Telerik by Progress
Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
0
Matthias
Top achievements
Rank 1
answered on 16 May 2017, 05:29 AM
Thanks. Between this and hooking into the diagram.Items, diagram.Shapes and diagram.Connections collections, I've been able to do what I need to do.
Tags
Diagram
Asked by
Matthias
Top achievements
Rank 1
Answers by
Matthias
Top achievements
Rank 1
Petar Mladenov
Telerik team
Share this question
or