I have a Tree object in my Flex code. It's width is 100%, and it is contained by a Panel with width=200. I am using a custom itemrenderer that extends TreeItemRenderer.
I need the text in each node to word wrap if it's too big (as happens often). I have tried
label.wordWrap = true;
in my item renderer without any luck. Any other suggestions?
If 'label' is an instance of the Label component, you won't be able to get it to wrap, no matter what you do, as the Label component doesn't support wrapping. Or, rather, is meant to be used only for single-line text.
If you are using a Label component, try using a Text component, instead. It's meant to display multi-line text.
With the default TreeItemRenderer you just need to set two properties on your Tree to enable wordWrap:
tree.variableRowHeight = true;
tree.wordWrap = true;
Enjoy.
What is the height that is set on the label? Is there enough room for the text to go vertically?
try setting the label width to a constant width. If your not able to do this because it needs to be dynamic then you need to override the update functions and set the width of the label then. The problem is the label hasn't calculated the actual 100% width at the time of rendering so it doesnt know it has to warp or not.
Dont Use Label. Use ' mx:Text width=" 100%" ' ( Text with 100% width) and it will wrap on its own.
Related
In particular I have a GWT project with a
TextArea element which I want to conform to a set width and expand as much as needed to the bottom.
ListBox element which I want to conform to a set width and expand vertically to show the entirety of the displayed list item.
Those are two widgets using replaced elements: <textarea> and <select> respectively.
for the TextArea, there's no way to make it really "resize automatically" other than listening to events and computing the new size (there's actually no need to compute the new size, you can just let the browser do it; see http://phaistonian.pblogs.gr/expanding-textareas-the-easy-and-clean-way.html)
for the ListBox, it's impossible to have the items' text wrap. See Word wrap options in a select list for a similar question in pure JS.
Set the width to whatever number and set height to auto.
I have a problem determining the width of a rendered text node in JavaFX 2. When using the standard style, everything works fine:
Text testText = new Text("test");
double width = testText.getLayoutBounds().getWidth();
But if I apply custom CSS styling which sets a different font size like this
.text-class {
-fx-font: 20px "Tahoma Bold";
}
and apply the CSS class to my example above:
Text testText = new Text("test");
testText.getStyleClass().add("text-class");
double width = testText.getLayoutBounds().getWidth();
I will get the same result as in the first case, so obviously styling is delayed to some later point in time.
How do I determine the width of a CSS-styled text in JavaFX 2? Is it possible to somehow force immediate CSS styling?
CSS application is not done immidiately, so, the way to solve the issue, is do your actions, when size of text actually changes.
testText.layoutBoundsProperty()
Is the property, which responds to bounds, and it stores an immutable object. There are also other properties, telling you about size and position. What you can do - is to attach a change listener on this property, and apply changes, when a modification is done.
CSS-Styles are applied on the next so called pulse beside that the layoutBounds are influence by the parent container your put it into.
In my Flex 4.5 mobile app, I have an actionScript item renderer (that derives from Flex's LabelItemRenderer). I want to fit in exactly 2 lines of text, and then truncate the rest. The width and height of the label are fixed and known statically.
How can I do this? The StyleableTextField.truncateToFit() method only works for one line of text.
I've set wordWrap = true, so the text now flows into the second line - but I need to truncate the text if it doesn't fit in two lines.
I need it to show all the text if there is only one line. (in both cases the label should be vertically middle-aligned in my renderer)
I know how to override layoutContents to do sizing and positioning etc of the StyleableTextField. So I'm looking specifically for ideas to implement custom text truncation with the StyleableTextField).
Any ideas?
Unless you're using something specific to the StyleableTextField try the s:Label. It has a property maxDisplayedLines which you could set to 2 and it will handle the truncation.
I'm looping through a recordset, and for each item I create at runtime a spark Label and set the text property from a field of the recordset. The labels must have a fixed width and some text goes multiline.
I want to arrange the label vertically so I need to know the height of the label so I can place the next label properly, but when I try to read this property, after the labels is added through the addElement method, it returns 0.
Do you know how to get the label height?
Use a VGroup or a List for this instead. It will automatically handle this kind of behaviour for you. Make sure to set variableRowHeight to true.
Cheers
I am now developing a Flex application in which I need to control each pixel of my control of Flex. I want to calculate that how width and how height of some text used in my control and do some layout stuff.After some searching I find that the only way to draw text in Flex is to use something like TextField. So, I use TextField to display text and try to get the width and height of the text through:
textfiled.getLineMetrics(0).width/.height;
But the real textfield is much more bigger than this, so I do:
textfield.width = textfiled.getLineMetrics(0).width;
textfield.height = textfiled.getLineMetrics(0).height;
But, the textfield get part not displayed, and I am surprised by this effect. I know there should be a 2-pixel gutter around the text, but what the remain space? Why nearly 20% part of the text height/width are not displayed?
And how can I get a real drawText call in Flex, I mean something like Windows's drawText method...
Thanks!
you can try this : getCharBoundaries () i've used it and seems accurate hoever it is for char and not a whole text so you will need to iterate through the text
also see this :
Is there a way to get the actual bounding box of a glyph in ActionScript?
Please try:
textfield.width = textfield.textWidth + 4;
textfield.height = textfield.textHeight + 4;
I'm not familiar with Windows's drawText method so I cannot help you there, but perhaps you want to have a look at the stellar text layout functionality in Flex 4.