Confine node in one group

Hello, I create one group and add some node in this group, I want to confine the nodes inside this group, so the user cannot move the node outside one group, if the user move a node around, the border of the group can be changed as the user moving the node, for example, if the user move the node to left, when the node is near the left border of the group, the left border will be move to left a little bit.

I start with the group sample provided by you, I meet a problem when I am implementing this feature. I register a event handler for the BoundsChanged event of each child node, in the event handler I change the bounds of the parent node. But I found in the GroupableNode class, a event handler of BoundsChanged for the parent node is also registered. so that this lead to a infinite loop.

I try some ways to resolve this issue, but don't have a good idea, so do you have some comments for this?

Thanks

Hello Jzhou

This is a fantastic idea! Here is a small code example that I tried out to get the effect you have described. Rather than attaching an event handler to the child elements, I went with overriding the OnBoundsChanged method of the GroupableNode.

private bool _updateBoundsLock = false;

protected override void OnBoundsChanged()
{
  base.OnBoundsChanged();
  if (!_updateBoundsLock)
  {
    _updateBoundsLock = true;
    if (Parent != null)
    {
      Rect parentBounds = Parent.Bounds;
      if (Bounds.X + Bounds.Width + 10 > parentBounds.Width)
      {
        Parent.Bounds = new Rect(parentBounds.X, parentBounds.Y, Bounds.X + Bounds.Width + 10, parentBounds.Height);
      }
      if (Bounds.X - 10 < 0)
      {
        double diff = Bounds.X - 10;
        Parent.Bounds = new Rect(parentBounds.X + diff, parentBounds.Y, parentBounds.Width - diff, parentBounds.Height);
        Bounds = new Rect(Bounds.X - diff, Bounds.Y, Bounds.Width, Bounds.Height);
      }
    }
    _updateBoundsLock = false;
  }
}

You will notice the boolean _updateBoundsLock field. This is used to "lock" the method during the parent bounds calculation logic which avoids the infinite loop issues.

In this code sample, you'll notice I have only included the logic for moving the child node left or right. You can use this same technique for moving the node up and down. One important thing to note is the logic used for moving the node left. (which you'll need to consider when moving the node up). When moving the node left outside the bounds of the parent, you need to update both the parent.Bounds.X value as well as the parent.Bounds.Width value. But when you update the X value, the parent will automatically move all the children within the parent. This is built-in behavior that you can not directly override. This means when the X value is updated, the node that the user is dragging will be moved a second time which will move if further outside the bounds of the node. To work around this, you will notice I am also updating the Bounds property of the moving node - I move it back towards the right by the difference of overlap.

Start by removing your bounds event handler and adding the above code into the GroupableNode class. Then work on implementing the up/down logic.

Let me know if you have any questions.

Jason Fauchelle