Two containerNode questions

[rui]

I use group to show group data,  the group and item both can connec to other control , the design picture is as attach files "split.png"

there are two question

1. I set the template as follows

 <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="telerik:RadDiagramContainerShape">
                        <Border x:Name="ContainerBorder"
                                Width="30"
                                Background="{TemplateBinding Background}"
                                BorderBrush="{TemplateBinding BorderBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}"
                                CornerRadius="15" />
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style> 

and set the item circle position as follows

 public override bool AddItem(object item)
        {
            var viewModel = item as TransformationNode;
            if (viewModel != null)
            {
                viewModel.Position = new Point(this.Position.X, this.InternalItems.Count * splitTransformationHeight);
                return base.AddItem(item);
            }

            return false;
        }

but the group show as attach files "SplitDiagramGroup.png"   the height is too big,what is the reason

2. I wish the  item circle can not drag alone, when drag the item circle,  the whole  group move too ,   how to realize?

 

than you 

[Martin Ivanov]

Hello rui,

Without your implementation I cannot be sure why the container is bigger then expected. However, I guess this is caused by the fact that the RadDiagramContainerShape's bounds are updated automatically so there is a padding between its content and borders. If this is the case, you can create a custom container shape that derives from RadDiagramContainerShape and override its CalculateContentBounds() method. Then return the current content bounds instead of calculating the new ones. Here is an exmple:

public class FixedContainer : RadDiagramContainerShape
{
    protected override System.Windows.Rect CalculateContentBounds(System.Windows.Rect newShapeBounds)
    {
        return this.ContentBounds;
    }
}

However, keep in mind this is custom code that might not work as expected in all possible cases. If this doesn't help you can also try to set MinHeight of the container shape to 0. 

As for dragging the container when you click on a child shape, the easier approach which you can use is to set the IsHitTestVisible property of the shapes to False. Keep in mint this will prevent any mouse interaction with the child shapes and also the selection won't be available.

Another possible approach for achieving the desired visualization is to use a custom shape with ellipse paths inside of it instead of container shape.

Regards,
Martin
Telerik

[rui]

Thank you very much  

the first question is resolved by calculate the shape height when add item

the second question, I need the childNode connect to other node ,so the both methods can not resolve,I use a transigent solution: calculate the groupNode position when drag the childNode

 

there is another question:

I set the group shape and the child node width both 30px, and set the margin and padding property 0px

when add the childNode into the groupNode, the group shape width change to 50px ,

 and the connection line can not reach to the group node,there is a distance,

the snoop picture is as attach files

what is the reason for this ? thank you !

 

[Martin Ivanov]

Hello Rui,

Thank you for the attachments. 

The described behavior is observed because the RadDiagramContainerShape elements are recalculating their bounds automatically when you add a child shape inside them. Basically, there is always a minimum margin between the borders of the container and the child shapes. You can see this behavior in the First Look demo of RadDiagram for example. You can drag and drop a shape from the toolbox to the edge of an a container's border and see how the container's size will be expanded.

To avoid this behavior you can create a custom container shape that derives from RadDiagramContainerShape and override its CalculateContentBounds() method - as described in my previous reply.

I hope this information is useful.

Regards,
Martin
Telerik

[rui]

Hi Martin

thank you very much, I resolve the problem  by override  CalculateShapeBounds method

        protected override Rect CalculateShapeBounds(Rect contentBounds)
        {
            var temp = base.CalculateShapeBounds(contentBounds);
            return new Rect(this.ContentBounds.X, temp.Y, 30, temp.Height);
        }

your reply is very useful thank you 

 

there is another question:

when set the shape's UseGlidingConnector property false  the connection line end is  drag around  by the four point(left right up down)

when set it true   the connection line end drag around by a rectangle 

if there any way  let the end drag around by a circle?

thank you!

 

[Martin Ivanov]

Hi Rui,

Yes, you can achieve your requirement by setting the shape's GlidingStyle property. In your case you can set it to Ellipse.

<telerik:RadDiagramShape UseGlidingConnector="True" GlidingStyle="Ellipse" />

Regards,
Martin
Telerik

[rui]

Hi Martin

It resolved the problem 

Thank you very much!