Group expander Right alignment

@ebett wrote:

Hi, I need to put the group expander button to the right and the text in the middle.

Captura.PNG381x558 5.29 KB

This is my gruop template:

  var tpl = $(go.Group, "Spot",
      new go.Binding('location', 'loc', go.Point.parse).makeTwoWay(go.Point.stringify),
      {
        selectionAdornmentTemplate: $(go.Adornment, 'Auto', {margin: 8}, $(go.Placeholder)),
        resizable: true,
        computesBoundsAfterDrag: true,
        ungroupable: false,
        selectionObjectName: 'BODY',
        resizeObjectName: 'BODY',
     //   locationObjectName: 'BODY',
        mouseDrop: me.controller.finishDrop,
        subGraphExpandedChanged: function(grp) {
          var shp = grp.resizeObject;
          if (grp.diagram.undoManager.isUndoingRedoing) return;
          if (grp.isSubGraphExpanded) {
            shp.height = grp._savedBreadth;
          } else {
            grp._savedBreadth = shp.height;
            shp.height = NaN;
          }
        },
        handlesDragDropForMembers: true  // don't need to define handlers on member Nodes and Links
      },
      new go.Binding("isSubGraphExpanded", "expanded").makeTwoWay(),
      $(go.Panel, "Auto",
        {name: 'BODY'},
        new go.Binding("height").makeTwoWay(),
        new go.Binding("width").makeTwoWay(),
        $(go.Shape, viewConfig.shape || 'RoundedRectangle',
          new go.Binding("fill").makeTwoWay(),
          // new go.Binding("visible", "isSubGraphExpanded").ofObject(),
          Ext.apply({name: 'BODY', minSize: new go.Size(130, 30)}, viewConfig.config),
          {
            spot1: go.Spot.TopLeft, spot2: go.Spot.BottomRight
          }),
        $(go.Panel, go.Panel.Vertical,  // title above Placeholder
          $(go.Panel, go.Panel.Horizontal,  // button next to TextBlock
            {
              name: "HEADER",
              //stretch: go.GraphObject.Horizontal,
              stretch: go.GraphObject.Fill,
              background: "transparent",
              margin: 1,
              defaultAlignment: go.Spot.TopRight
            },
            $(go.TextBlock,
              {
                alignment: go.Spot.TopLeft,
                //stretch: go.GraphObject.Fill,
                editable: true,
                margin: 5,
                isMultiline: false,
                textAlign: 'center',
                font: 'bold 10pt Segoe UI,Segoe UI Web Regular,Segoe UI Symbol,Segoe,Tahoma,Trebuchet,Arial,Verdana'
              },
              new go.Binding("text", "text").makeTwoWay()
            ),
            $("SubGraphExpanderButton", {
              alignment: go.Spot.TopRight,
              margin: 5
            })
          ),  // end Horizontal Panel
          $(go.Placeholder, {padding: 5, alignment: go.Spot.TopLeft})
        )// end Vertical Panel
      ),
      $(go.Panel, "Horizontal",
        {
          alignment: go.Spot.Top,
          alignmentFocus: new go.Spot(0.5, 0, 0, -8)
        },
        [makePort("IN", true)]),
      $(go.Panel, "Horizontal",
        {
          alignment: go.Spot.Bottom,
          alignmentFocus: new go.Spot(0.5, 1, 0, 8)
        },
        [makePort("OUT", false)])
    );

Any idea? thanks!

Posts: 3

Participants: 2

Read full topic