Collapsing CustomSubGraphs

The example collapses the nodes towards a center point.

We actually want our shifted to the left side.

So if the subgraph’s left is at 100 before collapse and 120 after. I want to shift it left 20 pixels after it is collapsed.

I’ve tried a number of ways to do this, but the result is that it does shift the sub graph’s LEFT side over, but the right side remains where it was, making the “collapsed” node wider than it needs to be.

I’m having trouble connecting your email address provided here to a support subscription. Can you contact us through Contact Us and give us an order number. thanks.

Try the three sample subgraph types in the SubGraphApp sample. Isn’t that the behavior you’re looking for?

Those kind of help.

I’m trying to collapse a group in a left-to-right graph. So after collapsing, I need to shift everything on the right over to the left.

I’ve been trying various approaches to get the distance to shift and nothing is working out.

CustomSubGraph.Size is just not right.

Clicking on neighboring nodes and looking at their properties, I can see the CustomSubGraph is 445 wide (.Size reports 389). When I collapse it, it is 90 (.Size reports 315).

I’ve also tried SavedBounds[this].Width (429), CollapsedSize (always reports 60), the passed in param sgrect (reports 60).

Can you post screenshots of before / after the collapse? (or email them if you prefer)

(click that "full reply editor" button (with the arrow) to upload images)

Thanks for taking a look at this, Jake,

Image 1:


Node “Alpha” has X: 52, Width: 71, So the group’s left should be 123ish.

Image 2:


Node “Action 1” has X: 561

So the group’s width should be:
561 - 123 = 438ish

At the start of PrepareCollapse:
Location: 147.7227, 165.8125
Size: 389.9388, 78.08331

FinishCollapse
Location: 147.7227, 165.8125
Size: 315.0834, 70.26039

Image 3:


With it collapsed, it’s about the same width as Alpha (width 71), yet FinishCollapse is reporting it’s width of 315.


Image 4:


Another issue I’m poking at is that when I load a graph with subgraphs that were previously collapsed, I have to call Collapse() to put them back to where they were when saved, however, they don’t collapse right.

OK… by default, the collapsed group is created to fit around all of the sizes of the children. You can use a custom CollapsedObject to improve that. so…

protected override GoObject CreateCollapsedObject() {
  GoShape shape = new GoDrawing(GoFigure.Cloud);
  shape.Selectable = false;
  shape.Visible = false;
  shape.Printable = false;
  shape.Size = new SizeF(50, 32);
  this.CollapsedSize = shape.Size;
  return shape;
}

will change:

the behavior of the blue subgraph to:

Also note I’ve set the “Links Redirected to Subgraph Port” option. (see where the link connects…)

I think that will help with the issues you’re seeing.

My version of your code has extra Brush and Pen, and the size coming from a Label object.

    protected override GoObject CreateCollapsedObject()
    {
        GoShape shape = new GoDrawing(GoFigure.Rectangle);
        shape.Selectable = false;
        shape.Visible = false;
        shape.Printable = false;
        shape.Size = new SizeF(GroupLabel.Size.Width, GroupLabel.Size.Height);
        this.CollapsedSize = shape.Size;
        shape.Brush = new SolidBrush(Color.Orange);
        shape.Pen = new Pen(new SolidBrush(Color.Turquoise));
        return (shape);
    }

But the results shows no orange shape (just the handle), and the green box is 90 x 60 while the actual GroupLabel size is 173 x 33:

It’s like there is some other object there, and mine is not.

Where do you call CreateCollapsedObject? The demo projects have it remarked out, but nowhere in the code is it called. I’m calling it from PrepareCollapse before the base call.

Judging from where the links are connecting, the fantom rectangle is probably the GoPort.

I don’t know, since I’m only seeing part of your class. You may get further faster by just taking
the whole of CustomSubGraph (which is where my sample CreateCollapsedObject was added)
and working from that point.


Actually, it looks like that’s where you started. It that’s true, diff what you have with the
original CustomSubGraph.

Thank you, Jake,

Yeah, I can move the ports around… I was hoping to stay “light touch” on those and that they were based on some invisible GoBox or something, but looks like they need some explicit layout code now, too.

So I can’t figure out what manipulates the selection box on a collapsed subgraph.

The top 2 works OK for when all the nodes are small, but the Selection object matches the size of the largest node inside the collapsed group. I’d really like to make the selection box just match the size of the Handle + Label (and locate such as to contain them).

(Note: the handle is motionless. The label is shifting position between expand/collapse.

Do you still have the override for CreateCollapsedObject? If you do, set a breakpoint at it and see if it is being called.

I do not have that override at all at this point.

That’s the trick to avoiding the “biggest child” sizing.

So I’m moving the selection box (left), but the clickable area for it stays low (shown in right image selection area):

So if you click in the top half of the selection box on the left, it just de-selects.

I tried override on CreateBoundingHandle, but it doesn’t move the clickable zone:

    protected override void FinishCollapse(RectangleF sgrect)
    {
            ...
        this.CollapsedObject.Size = new SizeF(GroupLabel.Size.Width + Handle.Width + 5, GroupLabel.Size.Height);
    }

    public override IGoHandle CreateBoundingHandle()
    {
        if (this.IsCollapsed)
        {
            IGoHandle handle = base.CreateBoundingHandle();

            CustomHandle h = new CustomHandle();
            h.Bounds = new RectangleF(this.Location.X, this.Handle.Location.Y - handle.GoObject.Height / 2, CollapsedObject.Size.Width, handle.GoObject.Height);
            return h;
        }
        else
        {
            return base.CreateBoundingHandle();
        }
    }

You really shouldn’t have to override those methods for basic things to work.

Which sample class did you start with? CustomSubGraph does most of what it does to shrink the label.

Started with CustomSubGraph. The main twist is the fact that upon collapsing, I’m shifting everything to the right of the node left the amount of space shrunk.

This means that to move a collapsed subgraph that is right of the currently collapsing subgraph I have to expand it, shift the nodes in it, then re-collapse it. This resulted in the label and the bounding object not matching. After struggling with that, I’ve found it’s easiest to just create a simple label outside of the CustomSubGraph and move it myself as needed.

This makes it all almost work except for the selection will move properly, but the actual click area doesn’t move to where the selection box is.

Simple code lift from CustomSubGraph example. When I collapse, I just want the full label displayed.

public CustomSubGraph()

{

this.Shadowed = true;

this.BorderPenColor = Color.Blue;

this.Corner = new SizeF(0, 0);

this.TopLeftMargin = new SizeF(0, 0);

this.BottomRightMargin = new SizeF(0, 0);

this.PickableBackground = true;

this.Label.Visible = true;

this.Label.Bordered = false;

this.Label.Wrapping = true;

this.Label.TransparentBackground = false;

this.Label.Font = new Font("Tahoma", 16);

this.Label.Alignment = GoObject.TopCenter;

this.Label.BackgroundColor = Color.White;

this.Label.Selectable = true;

this.Label.Editable = true;

this.Label.Multiline = true;

this.Label.WrappingWidth = 350;

}

protected override void FinishCollapse(RectangleF sgrect)

{

this.Label.Alignment = GoObject.MiddleRight;

base.FinishCollapse(sgrect);

}

protected override void FinishExpand(PointF hpos)

{

this.Label.Alignment = GoObject.TopCenter;

base.FinishExpand(hpos);

}

Unfortunately, while the anchor does not move (good), the label is re-centered over the label (it appears to completely ignore Label.Alignment and Label.Location and Label.Position when collapsed). It also appears to confuse the links to they are not reaching the collapsed node properly (yellow circle).

Look at properties LabelSpot and CollapsedLabelSpot. LayoutLabel sets Alignment based on these.