Hi All,
I am using a palette similar to the flowchart example, to have a toolbox of parts.
However I can’t seem to get the right combination of settings in order to consistently get a centred list of parts.
This is the code I am using:
toolboxItems.startTransaction("change Layout");
toolboxItems.layout = new go.GridLayout();
toolboxItems.layout.cellSize = new go.Size(NaN, 75);
toolboxItems.layout.spacing = new go.Size(5, 5);
toolboxItems.layout.wrappingColumn = 1;
toolboxItems.layout.wrappingWidth = NaN;
toolboxItems.commitTransaction("change Layout");
where toolboxItems is an object of type go.Palette.
The node template is:
myDagram.nodeTemplateMap.add(“document”,
goMake(go.Node, go.Panel.Spot, { isShadowed: shadows, shadowColor: “rgba(0,0,0,0.2)” }, {
name: “NODESHAPE”
},
new go.Binding(“location”, “location”, go.Point.parse).makeTwoWay(go.Point.stringify), {
mouseEnter: function (e, obj) { onShowPorts(obj.part, true); },
mouseLeave: function (e, obj) { onShowPorts(obj.part, false); },
contextMenu: nodeContextMenu
},
goMake(go.Panel, go.Panel.Vertical,
goMake(go.Panel, go.Panel.Spot,
goMake(go.Shape, {
figure: “Document”, fill: documentFill, isPanelMain: true,
stroke: “black”, desiredSize: new go.Size(50, 50)
}),
// Four nodes around the shape, to match the lines.
goMake(go.Shape, {
figure: “Ellipse”, fill: “transparent”, stroke: null,
desiredSize: new go.Size(6, 6),
alignment: go.Spot.Top, alignmentFocus: go.Spot.Top,
portId: “T”, fromSpot: go.Spot.Top, toSpot: go.Spot.Top,
fromLinkable: true, toLinkable: true, cursor: “pointer”,
fromLinkableDuplicates: true, toLinkableDuplicates: true
}),
goMake(go.Shape, {
figure: “Ellipse”, fill: “transparent”, stroke: null,
desiredSize: new go.Size(6, 6),
alignment: go.Spot.Right, alignmentFocus: go.Spot.Right,
portId: “R”, fromSpot: go.Spot.Right, toSpot: go.Spot.Right,
fromLinkable: true, toLinkable: true, cursor: “pointer”,
fromLinkableDuplicates: true, toLinkableDuplicates: true
}),
goMake(go.Shape, {
figure: “Ellipse”, fill: “transparent”, stroke: null,
desiredSize: new go.Size(6, 6),
alignment: go.Spot.Bottom, alignmentFocus: go.Spot.Bottom,
portId: “B”, fromSpot: go.Spot.Bottom, toSpot: go.Spot.Bottom,
fromLinkable: true, toLinkable: true, cursor: “pointer”,
fromLinkableDuplicates: true, toLinkableDuplicates: true
}),
goMake(go.Shape, {
figure: “Ellipse”, fill: “transparent”, stroke: null,
desiredSize: new go.Size(6, 6),
alignment: go.Spot.Left, alignmentFocus: go.Spot.Left,
portId: “L”, fromSpot: go.Spot.Left, toSpot: go.Spot.Left,
fromLinkable: true, toLinkable: true, cursor: “pointer”,
fromLinkableDuplicates: true, toLinkableDuplicates: true
})),
goMake(go.TextBlock, { // the text label
name: “nodeLABEL”,
textAlign: “center”,
stroke: “black”,
maxSize: new go.Size(100, NaN),
wrap: go.TextBlock.WrapFit,
editable: true
}, new go.Binding(“text”, “text”).makeTwoWay(),
new go.Binding(“visible”, “labelVisible”).makeTwoWay()))));
I gather the issue is the text size, I have tried setting the width to be 0, to 500 and various other combinations.
Does anyone have any suggestions, so that the parts are centred around the middle line of the document image, regardless of the text size?
Thanks.
Jonathan