Page Index Toggle Pages: 1 Send TopicPrint
Normal Topic use Diagram in MVVM model (Read 3935 times)
esri_test
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 44
Joined: Aug 21st, 2013
use Diagram in MVVM model
Oct 4th, 2013 at 2:22pm
Print Post  
It is requested to use Diagram in MVVM model. The diagram component can be put in "View" XAML with no code in XAML.cs, but binding to something in "View Model" cs file. When "View Model" got updated, the "View" will get updated.

In XAML, we declare <diag:Diagram DataContext="{Binding Path=viewmodelDiagram}"

In View Model cs file, we define this viewmodelDiagram as a public properties and we do code like this:

Diagram temp = new Diagram();
var diagramNode = temp.Factory.CreateShapeNode….
var diagramLink=temp.Factory.CreateDiagramLink….            
new OrthogonalRouter().Arrange(temp);            
viewmodelDiagram = temp;

This is our final goal.

Right now, we did test outside MVVM model.
with XAML defined as this:
<diag:Diagram x:Name="diagram"….

In XAML cs file, we did as:
Diagram temp = new Diagram();
var diagramNode = temp.Factory.CreateShapeNode….
var diagramLink = temp.Factory.CreateDiagramLink….            
new OrthogonalRouter().Arrange(temp);            
diagram = temp;

it doesn't show the flowchart. The nodes and links are passed from temp to diagram, but it doesn't display. We tried new OrthogonalRouter().Arrange(diagram); to arrange the layout, but it doesn’t display any flowchart.

But code like this will work in XAML cs file,
var diagramNode = diagram.Factory.CreateShapeNode….
var diagramLink = diagram.Factory.CreateDiagramLink….            
new OrthogonalRouter().Arrange(diagram);
it does show the flowchart.

Can we "new" a Diagram?
if We can't new a diagram, how can we binding the diagram to properties passed from other CS file?

Thanks,

  
Back to top
 
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: use Diagram in MVVM model
Reply #1 - Oct 4th, 2013 at 4:27pm
Print Post  
You will have to add that new Diagram to the view's visual tree somehow. E.g. one possible way to do that would be binding a ScrollViewer's Content property to the model's Diagram property. However, that would allow only a single instance of the view to be used, because the same diagram cannot be added to more than one parent scroll viewer.

If you need to display more than one view, you could use the DiagramView class for that. Its Diagram property can be set to a shared Diagram instance displayed by many DiagramViews. However at this time it isn't a dependency property and you cannot bind it. Instead, you could derive from DiagramView to define a bindable property:

Code
Select All
public class BoundDiagramView : DiagramView
{
	public static DependencyProperty DiagramModelProperty = DependencyProperty.Register(
		"DiagramModel",
		typeof(Diagram),
		typeof(BoundDiagramView),
		new PropertyMetadata(OnModelChanged));

	public Diagram DiagramModel
	{
		get { return (Diagram)GetValue(DiagramModelProperty); }
		set { SetValue(DiagramModelProperty, value); }
	}

	private static void OnModelChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
	{
		var instance = (BoundDiagramView)d;
		instance.Diagram = (Diagram)e.NewValue;
	}
} 



Now you can add a BoundDiagramView object to your view Xaml:

Code
Select All
<local:BoundDiagramView DiagramModel="{Binding DiagramModel}" /> 



Where DiagramModel is also the name of the Diagram property in your model class:

Code
Select All
public Diagram DiagramModel
{
	get { return diagramModel; }
	set
	{
		diagramModel = value;
		if (PropertyChanged != null)
			PropertyChanged(this, new PropertyChangedEventArgs("DiagramModel"));
	}
} 



I hope that helps,
Stoyan
  
Back to top
 
IP Logged
 
esri_test
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 44
Joined: Aug 21st, 2013
Re: use Diagram in MVVM model
Reply #2 - Oct 7th, 2013 at 3:26pm
Print Post  
Hi Stoyo,I tried the single instance of the view to bind to scrollviewer's content property. It works now.
Currently we don't have the requirements to display more than one view yet.
Thanks,
  
Back to top
 
IP Logged
 
esri_test
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 44
Joined: Aug 21st, 2013
Re: use Diagram in MVVM model
Reply #3 - Oct 28th, 2013 at 6:00pm
Print Post  
Hi, Stoyo,

I still need your help on this one.
We don't have requirements to display the diagram in more than one view, but the UI part shows diagram and the part changes diagram are in different threads. All other views we have currently are bound to collections in the view model, when the collections got updated from any thread, the view will get updated correctly.

But for diagram, the other thread can't change the UI directly, is there any way to do something as:
<diagram nodes={binding Nodes} links={binding Links} />, any threads can changes the collections, the diagram will get updated?

Thanks,
  
Back to top
 
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: use Diagram in MVVM model
Reply #4 - Oct 28th, 2013 at 6:37pm
Print Post  
Hi,

WPF controls can be accessed only from the UI thread. In order to change a Diagram instance from a different thread, you'll have to do that via Dispatcher.Invoke. Diagram items are derived from UIElement and you can only create them in the UI thread as well.

Dispatcher.Invoke(() =>
{
diagram.Factory.Create...
});

I hope that helps,
Stoyan
  
Back to top
 
IP Logged
 
Page Index Toggle Pages: 1
Send TopicPrint