Dynamically resize/space text to fit div - css

I have a div with a fixed width, but the text inside (someones name) will vary. Is there a way of dynamically resizing/letter-spacing the text to fit perfectly in the div?
However, I cannot use javascript as this script will be used in a HTML-PDF converter, which does not read javascript
text-align:justify won't work as if the text is too long for the div, it won't resize it. I find text-align:justify only works for paragraphs etc.
The name cannot go onto two lines

You need to use either:
Graphics graphics = this.CreateGraphics();
SizeF textSize = graphics.MeasureString("How long am I?", this.Font);
or
Size textSize = TextRenderer.MeasureText("How long am I?", font);
TextRenderer is less accurate, but Graphics requires you to use a windows form - in your case you could have a form with a single textbox into which you place the text to be measured and then read it back, but TextRenderer is simpler.
Using the above you could write a function that adjusted the font-size until the desired length was reached.
It would then be a case of setting the style on the text sent to the browser to reflect this font-size.

Related

Line Height in SSRS

Is there a way to adjust the line height in SSRS? I have a requirement on a legal document to have a bigger line height.
From what I have read, the Textbox.LineHeight property only affects html. I have converted the text inside the textbox to html, set the LineHeight property, but nothing changed.
I also tried adding custom CSS to the report (using old school line-height: {x} pt; inside a style tag), but to no avail - that isn't supported in the SSRS environment.
Here is an example what I need - How can I achieve this?
Before:
After
Does SSRS even support this?
Edit
Converting the text to an expression and adding a double VbCrLf will not be feasible as I need to only add a partial line height
You could add an expression on the Padding.Bottom property.
=IIF(IncreaseHeight, "20pt", "2pt")
If the text is already multiple lines, format the textbox to accept HTML. Replace the line breaks with a white character in a larger font followed by a <br/> tag.
<span style=""font-size=12pt; color:white;"">|</span><br/>
If your text is all on the same line, do the above for each space in your text. Using a bar "|" should be enough to represent the space between words. If not, use a thicker character.

Determine CSS-styled Text size in JavaFX / force styling?

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.

GWT Auto Scale Text font size to Fit within Bounds

How can I autoscale the text font size in a web page in order to make text in a div or p fit within given bounds?
There are nice solutions for Android, like this one, but I haven't found any for GWT.
Do you guys have any?
Thanks!
There are sevaral solutions to this problem:
(1) render the text, measure its width (myLabel.getOffsetWidth(), compare to the desired width, change font size if it does not fit and start over (remember to do this inside the Scheduler's deferred command, or your offset width will be zero);
(2) use FitText.js (http://fittextjs.com/);
(3) use canvas which can auto-fit text into provided space;
(4) use ellipsis when text overflows;
(5) use viewport units for text font (limited browser support at this time): http://css-tricks.com/viewport-sized-typography/
(6) create a different, more fluid UI design that handles content size better.

AS3: grouping sprites

I have a handful of sprites that I am attempting to group together via addChild().
Here is some pseudo-code demonstrating what I would like to accomplish:
import nav.text.TextSprite;
spr1:Sprite = new Sprite();
spr1.graphics.clear();
spr1.graphics.beginFill(0x000000);
spr1.graphics.drawRect(0,0,100,100);
txt1:TextSprite = new TextSprite;
txt1.text = "hello";
spr1.addChild(txt1);
//this is what isn't working: the sprite is hidden but not the text
spr1.alpha = 0.0;
For some reason I cannot seem to get the TextSprite to draw correctly... All it is is a Sprite with a TextField added to it. I think everything is working there, but I might have something wrong w/r/t making sure all of TextSprites children are grouped correctly.
I should mention that it does position correctly; but the alpha property won't respond in the way I would expect it to. I.E., the sprite that the TextField is attached to will allow it's alpha to be set but the text remains visible.
Any thoughts?
Most likely you just need to embed the font in your textfield. Try changing the x, y of spr1 and see if txt1 moves along with it. If it truly is a child then it will respond to the new position.
You need to embed the font using textfield.embedFonts = true. If your text is disappearing when you do this, how are you going about embedding the font (using the Flex embed meta tag or using the Flash IDE?), check that you are not changing the font weight (setting the text to bold when you have only embedded the normal weight font) and if you are using a text format, be sure to apply the text format AFTER you set the textfield.text property. You can get around this by using textfield.defaultTextFormat.

How do I set the line height of a FormattedText

I am building a text-to-image generator that takes a text, a font, a max width and some other parameters and generates an image from this. It will be used as a custom server control in a web site to generate headlines.
I allready have a component like this which uses GDI+. The problem with this is that GDI+ is incapable of setting line height which means I have to render the text first and then copy the resulting rows into a new Bitmap using the line height I want.
I am now looking at using WPF components instead and have managed to create text images using FormattedText. The problem is that I still cannot set line height. Is there a way to do this? If I could set letter spacing as well, that would be even better.
You should just be able to set the LineHeight property, is that not working?

Resources