I have a container cell that is a simple rectangle that contains other child cells. That container cell has a label that is aligned top and has a background color specified for the label. The label is drawing fine and the background is painting fine but the label portion is only as wide as the text in the label. Is it possible to have the label background fill the entire width of the container cell that it's associated to? The goal is to create a box that has the header bar of a solid color at the top that has the label associated with the box contained within that solid color header.

asked 15 Jun '11, 08:23

cgidwhite's gravatar image

cgidwhite
194829
accept rate: 66%

edited 28 Jul '11, 07:06

Is there a way to do this using the standard label mechanism (without having to implement something like what user 'vinnie' mentions below)?

(17 Jun '11, 12:58) cgidwhite

Did you read my second answer?

(17 Jun '11, 13:18) vinnie

I attempted to migrate our web app to mxGraph version 1.7.1.3 and it is now exhibiting the same behavior where the label background color isn't filling the width of the box. Under mxGraph version 1.6.1.3 this was working as desired. Is there anyway to enable that behavior under version 1.7.1.3?

(28 Jul '11, 07:06) cgidwhite

Try this:

\n
mxGraph graph = new mxGraph()\n{\n    protected mxGraphView createGraphView()\n    {\n        return new mxGraphView(this)\n        {\n            public void updateLabelBounds(mxCellState state)\n            {\n                super.updateLabelBounds(state);\n\n                mxRectangle lb = state.getLabelBounds();\n\n                if (lb != null && model.isVertex(state.getCell()))\n                {\n                    lb.setX(state.getX());\n                    lb.setWidth(state.getWidth());\n                }\n            }\n        };\n    }\n};\n
link

answered 19 Sep '11, 03:08

Gaudenz's gravatar image

Gaudenz
80.1k1310
accept rate: 39%

Thank you so much, that works for JGraphX. Is there a way to do the same in mxGraph?

(19 Sep '11, 07:20) cgidwhite

Here is a solution for JavaScript:

\n
mxTextRedrawHtmlTable = mxText.prototype.redrawHtmlTable;\nmxText.prototype.redrawHtmlTable = function()\n{\n  mxTextRedrawHtmlTable.apply(this, arguments);\n\n  this.node.style.left = Math.round(this.bounds.x + this.scale / 2) + 'px';\n  this.node.style.width = Math.round(this.bounds.width - this.scale) + 'px';\n};\n\nmxTextRedrawSvg = mxText.prototype.redrawSvg;\nmxText.prototype.redrawSvg = function()\n{\n  mxTextRedrawSvg.apply(this, arguments);\n\n  if (this.value.length > 0 && this.backgroundNode != null && this.node.firstChild != null)\n  {\n    this.backgroundNode.setAttribute('x', this.bounds.x + this.scale / 2);\n    this.backgroundNode.setAttribute('width', this.bounds.width - this.scale);\n  }\n};\n
link

answered 04 Oct '11, 00:47

Gaudenz's gravatar image

Gaudenz
80.1k1310
accept rate: 39%

One thing you can do is to set the label's size to the same value of your cell.

\n

For example if you need that the label has to be of the same width of your cell you can do this (if "cell" is the mxCell where you put the Jlabel called "label"):\n

int width=(int)(cell.getGeometry().getWidth());\nlabel.setMaximumSize(new Dimension(width,label.getHeight()));\nlabel.setMinimumSize(new Dimension(width,label.getHeight()));\n

\n

P.S. You need to do this to see your label's background for it's entire width:\n

label.setOpaque(true);

link

answered 15 Jun '11, 09:43

vinnie's gravatar image

vinnie
95210
accept rate: 9%

edited 15 Jun '11, 09:45

I'm not adding a JLabel to the cell. The text that is displayed as the label is the "value" of the cell (item provided in the constructor and returned by mxCell.getValue()).

(15 Jun '11, 12:12) cgidwhite

I'm sorry for the misunderstanding... anyway I solved my labels problems adding overlays to the cells.\nI use this class:\n

public class myMxCellOverlay extends JComponent implements mxICellOverlay {

\n
public mxRectangle getBounds(mxCellState state) {\n    return state;\n}\n
\n

}\n

\n

that helps me to manage a cell like a container where to add Components (like the JLabel I mentioned before) with the layouts that I want.

(15 Jun '11, 12:57) vinnie

For example you can use a javax.swing.BoxLayout with this parameter as second parameter "BoxLayout.PAGE_AXIS" to obtain elements in a vertical order and with their specified dimensions. If you add for first a JLabel, initialized with the same String you used to initialize the value of the cell that needs to have that label, you'll obtain a label that represents your cell but that looks like you want.

(15 Jun '11, 12:58) vinnie

Perhaps I founded a way to do it but I couldn't test it because you need to "play" with the new dimension of the label and I haven't time to do it now.

\n

You can get your graph view in this way:

\n
com.mxgraph.view.mxGraphView view = graph.getView();
\n\n

then you can get, from the view, the state of the cell where you want to change the label bounds:

\n
view.getState(cell)
\n\n

and call this method on the that state:

\n
public void setLabelBounds(mxRectangle labelBounds)
link

answered 16 Jun '11, 06:43

vinnie's gravatar image

vinnie
95210
accept rate: 9%

edited 16 Jun '11, 06:44

Here it is an example considering the variable "view" that I mentioned before and the mxCell "cell":\n

(view.getState(cell)).setLabelBounds(new mxRectangle(xPosition, yPosition, width, height));

\n

Let me know if this do the work!

(17 Jun '11, 13:27) vinnie

That doesn't appear to do anything because setting the label bounds doesn't appear to trigger any event to tell the graph to account for that change.

(17 Jun '11, 13:53) cgidwhite

render your label as html with <p style='width:100px'>labelString</p>

link

answered 14 Feb '15, 12:14

whatthehellwhy21characters's gravatar image

whatthehellwhy21cha...
11
accept rate: 0%

edited 14 Feb '15, 12:14

Your answer
toggle preview

Follow this question

By Email:

Once you sign in you will be able to subscribe for any updates here

By RSS:

Answers

Answers and Comments

Markdown Basics

  • *italic* or _italic_
  • **bold** or __bold__
  • link:[text](http://url.com/ "title")
  • image?![alt text](/path/img.jpg "title")
  • numbered list: 1. Foo 2. Bar
  • to add a line break simply add two spaces to where you would like the new line to be.
  • basic HTML tags are also supported

Tags:

×228
×194
×29

Asked: 15 Jun '11, 08:23

Seen: 5,348 times

Last updated: 14 Feb '15, 12:14