Problem when binding offset property in node style

[Suresh]

My requirement is to give Tree Layouts options (None, HierarchicalTreeLayout, DirectedTreeLayout and RadialTreeLayout) on the UI.
Here all the nodes are by default DirectedTreeLayout that means root node connected to child nodes and each child node will have its child nodes and so on.
Created a Hierarchical structure in xml and using MVVM to bind collection to itemsource property of DiagramModel. 

use case:
1. User can select any layout(ex: HierarchicalTreeLayout) and can move the nodes then hit the save button. On save event, we have to get all the node positions and update xml with the updated positions accordingly.
2. Now user select any layout (ex:DirectedTreeLayout), here all the nodes should be arranged as per its default algorithm.
3. Now if you select HierarchicalTreeLayout (which was selected in use case 1), all the nodes should be arranged as per its default algorithm.
4. Now select "None", now all the nodes should be arranged and connected as per the saved/customized positions.

I tried binding x and y properties to offsetx and offsety property of node as below:
<Style TargetType="{x:Type syncfusion:Node}">           
            <Setter Property="AllowResize" Value="False"/>
            <Setter Property="AllowRotate" Value="False"/>
            <Setter Property="AllowVirtualization" Value="True"/>          
            <Setter Property="Width" Value="125" />
            <Setter Property="Height" Value="100" />          
            <Setter Property="ContentTemplate" Value="{StaticResource NodeTemplate}" />
            <Setter Property="OffsetX" Value="{Binding  Path=Content.Position1.X, Mode=TwoWay, RelativeSource={RelativeSource Mode=Self},Converter={StaticResource debug}}"></Setter>
            <Setter Property="OffsetY" Value="{Binding  Path=Content.Position1.Y, Mode=TwoWay, RelativeSource={RelativeSource Mode=Self}}"></Setter>
        </Style>

But when i bind these x and y properties, Nodes are not movable and not able to change to other layouts.
I have attached my sample application's screenshot. Please suggest on the same.
If this feature is achievable, i can suggest my management to go for this library.

Thanks,
Suresh

Attachment: screenshot1_1d49bde8.zip

[Ranjitha Amirthalingam]

Hi Suresh,

Thanks for using Syncfusion products.

Requirement: binding to OffsetX and OffsetY using MVVM model.

We have created a simple sample to achieve your requirement .Please refer to the sample from the following link.

Sample Link:
LayoutDiagram.zip

Please let us know if you require further assistance on this,

Regards,

Ranjitha A

[Suresh]

Hi Ranjitha,

Thanks for the quick sample.
Now i am able to move the nodes with binding.

Still i am struck with few issues.
Issues 1:

My scenario is like this:
1. By default it will load Hierarchical layout.
2. User can change the node positions and click Save button, it will save the modified node positions into xml file.
3. Then switch to layout type NONE.
4. When layout type None is selected i am loading saved data with positions from xml and updating collection and binding it to diagram.

    Expected result is: it should arrange the nodes as the way i saved with connectors.
    Actual result:  It is loading all the nodes on the left top corner of the screen(like pile) without any arrangement with proper connectors.

Issue 2:
When i change loop Layout types are not working properly. (In the attached application, on the top left corner of the screen, two radio buttons loop1 and loop2 are used to change the source of the diagram)

Attached my sample application for your reference. Please let me know if you need further information.
Once again thank you very much for your cooperation.

Thanks,
Suresh

Attachment: SyncfusionDiagram_25bd7b08.zip

[Ranjitha Amirthalingam]

Hi Suresh,

Thanks for providing sample application and details to represent issue.

While analyzing the application you have provided, we came to know that Datacontext for Node is not setting correctly. We have represent this scenario in our Dashboard Sample “Business Object Binding”. Please refer to the sample from the following link

Link: Dashboard->WPF->Diagram->DataBinding->Business Object Binding

Please let us know if you require further assistance on this

Regards,

Ranjitha A

[Suresh]

Hi Ranjitha,

Thanks for your help.

I already went through all your sample applications and created the POC which i shared with you.
Instead of referring me to the samples again,
i would be very much happy if you can tell me where i am doing wrong in my sample and how to fix the issue that would save my time.

Anyways, i again went through the sample which you suggested, in that application there is no binding of offsetX and offsetY properties to the Node style in App.xaml.

Please understand my scenarios which i mentioned in the previous thread.

I am re-iterating them again:
1. I select Hierarchy layout and move the nodes and click save button.  Then i switch from Hierarchy layout to None, it should arrange all nodes in the previous saved positions with line connectors. (but it is not working in my poc)
2. When i change the item source of the diagram model, layout switching is not working as expected) (in my POC loop1 and loop2 radio diagram will change the item source)

Please suggest me what are the changes i have to make in poc to meet my requirements

Thank you very much for your cooperation.

Thanks,
Suresh

[Ramya Thirugnanam]

Hi Suresh,

Sorry for the inconvenience caused.

We have analyzed your sample. The OffsetX and OffsetY properties of Node should be updated when changing the PositionX and PositionY. But, in your application position is not updated when changing the values(position1).

Please let us know if you require further assistance on this.
Regards,
Ramya

[Suresh]

Hi Ramya,
Thanks for the replay.
I have binded the offset values as per your samples(LauoutDaigram.zip shared by you in the above thread). and i am sure they are properly updating in the bindings and properties
as I tested them using debug value converter.

The sample LayoutDiagram.zip(Business Object Binding.sln) project shared by you in this thread, i have added below code when we are changing layout type from HL to None.

File:  Window1.xaml.cs
  private void LayoutChanged(object sender, SelectionChangedEventArgs e)
        {
               ....
               ..
              switch (cbi.Content.ToString())
              {
                ....
                  case "None":
                       var v = (Employee)this.Resources["Employees"];
                     
                           v[0].OffX = 500;
                           v[0].OffY = 500;
                                                
                        diagramModel.LayoutType = LayoutType.None;                       
                        break;

Expected result : it should move the node to that location(500,500) with connecters.
Actual result:   Connectors are moving to that(500,500) location, but Node is not moving when offset values are changed. But when i manually move any node on the diagram then it is updating its positions and moving that node to 500,500 location.

Attached the screen shot.

My understanding:  When changed to layout type NONE, Diagram is not getting refreshed.

I am doing so much trials before posting this issues.
So please provide me the exact solution. I would be more happy if you find any problem in my project please tell me the changes i have to do in the code instead just mentioning the problem.

We are in hurry to finalize this control for our product once this issue is resolved.

Thanks for your cooperation.

Regards,
Suresh

Attachment: Layout_None_c0e2dc65.zip

[Ranjitha Amirthalingam]

Hi Suresh,

We considered the requirement “Node Position are not updated while loading Xml (ItemSource)” as a bug. We have logged a report on this and will fix the issue internally, also the fix will be included in our Main Release Volume 2, 2015 which has been scheduled to be rolled out in the month of "June 2015".

We have also created an incident internally to have a follow up with this issue.

Please let us know if you require further assistance on this

Regards,
Ranjitha A