Diagram container shape padding/margin ?

[nicolasf]

Hi,

I try tu re-use TableShape example and specificaly styles and i have a problem when iadd a Row into Table. each element shift on the left (see capture 1) If i force width, the problem is the same.
The row is not stretch to te container and create a resizing of the container. (i have 10px on the left and the right side, see the capture 2). How to remove this padding or margin ?

The last problem is when i add or delete a row, the event OnItemsCollectionChanged in TableShape class is not trigged, maybe i missed a binding ?

Can you help me please.
Thanks a lot,
Nicolas

[Martin Ivanov]

Hello Nicolas,

I am not sure how you add the row shapes, but my guess the observed behavior in capture1.png is caused by the auto-resizing mechanism of RadDiagramContainerShape. Basically, the container is trying to always provide some margin between its borders and its children shapes. This is why if you position a shape withing this minimum distance (the margin), the container will be automatically resized. 

To avoid this behavior I would suggest you couple of approaches.

• The first one is to make sure that the shape is added outside of the minimum distance. So for example if the X position of the table shape (the container shape) is at the 20th pixel,  the child's X should be at least on the 30-40th pixel.
• The other approach is to override  the CalculateContentBounds method in the TableShape class and return the original bounds. This way you'll avoid the auto-resizing mechanism. You can find some information about this in the following forum.
  

  protected override System.Windows.Rect CalculateContentBounds(System.Windows.Rect newShapeBounds)
  {
      return this.ContentBounds;
  }

About the OnItemsCollectionChanged, I checked this with the TableShape demo, but the method is called properly when you delete or add a row. I tested this using the Delete key and also the '+' and '-' buttons which are displayed when you click on the table shape's header.

Regards,
Martin Ivanov
Progress Telerik

[nicolasf]

Thanks for your answer.

I found why event wasn't trigging. I was 2 problems, first in the style "tableStyle" i used as targetType "RadDiagramContainerShape" instead of "TableShape". The second one is i didn't extend RadDiagram just like SqlDiagram example to override GetShapeContainerForItemOverride and GetShapeContainerForItemOverride.

But i still the same problem with rowShape whose shifting on left event i override CalculateContentBounds.

if you can help me to find a solution please ? i can send you the code to understand the problem

Thanks a lot !

Nicolas

[Martin Ivanov]

Hello Nicolas,

I am not sure why this happens. If you can share runnable code reproducing the described behavior I will check what is going on.

Regards,
Martin Ivanov
Progress Telerik

[nicolasf]

Hello Martin,

Thanks for your answer, you can find example on my github account : https://github.com/Silocan/TelerikDiagramDemo

Thanks for your help,

Nicolas

[Martin Ivanov]

Hello Nicolas,

I wasn't able to reproduce the size expanding behavior when commented the CalculateContentBounds override. However, I hit another issue - the size of the container doesn't update when you add new rows. In order resolve this you will need to manually set the Height property of the container when you add new rows. 

I updated your project to demonstrate a possible approach that you could use. Basically, I update the Height of the TableShape when a new row is added. The same way is updated when a row is removed. I also bound the Width and Height properties of the Row and Table shapes to the Width and Height of their models so that I can use them in the calculations.

I hope this helps.

Regards,
Martin Ivanov
Progress Telerik

[nicolasf]

thanks very much for your help,

i still have a margin on the right of row. i working to resolve this. i'll post the final code once this problem solved

[nicolasf]

i changed RowShape width to 250 (same width than TableShape)

thanks !