Cameron Yule

Embedded fonts and the Text Layout Framework

Adobe’s Text Layout Framework, in combination with the new text engine in Flash Player 10, is finally giving Flash developers the kind of typographic control we’ve needed for years. Feature highlights include bi—directional and vertical text, support for over 30 writing systems, flowing text across multiple columns and vastly improved character formatting including kerning, ligatures and typographic case.

While a few tutorials on it have been appearing in the last few days, notably Using the Text Layout Framework in Flex 3.2 and AIR 1.5, there’s still a lack of information on how to use embedded fonts which as we all know is necessary if you want to use non-standard fonts or tween the alpha property of your text.

Flex 4 SDK / Flash Professional CS4

From the Text Layout Framework release notes;

DefineFont4 is a new embedded font format used by the new text engine in Flash Player 10 providing improved typography, international support and reduced font size. The new text engine does not support any of the previous SWF embedded formats such as DefineFont3 generated by Flash CS3 Professional or Flex 3. You will have to use Flash CS4 Professional or Flex Gumbo to embed fonts using the DefineFont4 format.

This means that to use embedded fonts with the TLF, you have to use either the Flex 4 (“Gumbo”) SDK, which is currently still in Beta, or Flash Professional CS4.

Moving to Flex 4 SDK

If you’re currently using the Flex 3 SDK and want to move to Flex 4, there’s a handy tutorial on the Flex Examples blog, Using the beta Gumbo in Flex Builder 3.

A word of warning is that several of the nightly builds and the latest stable build refuse to run on OS X. I wasn’t alone with this problem, both Richard Leggett and Aral Balkan have been bitten too as you’ll see in the comments on Richard’s blog post, Upgrading Flex 3/AIR Projects to Gumbo/Flex 4.

For the time being, I’m using the Adobe MAX preview (build 4.0.0.4021) version.

Embedding fonts

Here’s an example of how to embed a font in AS3, the important new part to notice is the cff="true", which is a reference to the Compact Font Format required by the new text engine.

package com.cameronyule.fonts
{
	import flash.text.Font;
 
	public class AFont extends Font 
	{
		[Embed(source="/path/to/fonts/AFont.ttf", fontFamily="AFont", cff="true")]
		private var _a_font:String;
 
		public static const NAME:String = "AFont";
 
		public function AFont() 
		{
			super();
			_a_font;
		}
	}
}

Using your embedded fonts

There are two main ways to use the Text Layout Framework, TextFlows and TextLines. TextFlows are better for larger blocks of text while TextLines are good for single lines of text.

The most important part is actually the character formatting, so while this example uses TextLines you’ll be able to easily transfer it to TextFlows as well.

private function createTextLine(someText:String):void
{	
	var bounds:Rectangle = new Rectangle(10, 10, this.width, this.height);
 
	var paragraphFormat:ParagraphFormat = new ParagraphFormat();
	paragraphFormat.direction = Direction.LTR;
 
	var characterFormat:CharacterFormat = new CharacterFormat();
	characterFormat.fontSize = 18;
	characterFormat.fontFamily = AFont.NAME;
	characterFormat.fontLookup = flash.text.engine.FontLookup.EMBEDDED_CFF;
	characterFormat.renderingMode = flash.text.engine.RenderingMode.CFF;
 
	TextLineFactory.createTextLinesFromString(addTextLineToContainer, someText, bounds, characterFormat, paragraphFormat);
}
 
private function addTextLineToContainer(textLine:flash.text.engine.TextLine):void
{
	this.addChild(textLine);
}

And there you have it, embedded fonts using the new Text Layout Framework.

Myrin (Jar City)

I watched the Icelandic film Mýrin tonight and it was superb.

Based on a novel by Arnaldur Indriðason, it follows the policeman Erlendur as he and his colleagues try and solve the seemingly motiveless murder of a man in his home. As with all good examples of the genre, the plot evolves throughout the film and involves opening old wounds in closed cases and a recurring connection to an inherited genetic disease.

Despite his appearance – he’s rarely without a cardigan – Erlendur can be tough when needed, as seen in his confrontations with the violent skinhead Elliði and later when some enforcers for a local drug dealer try to break into his home.

With a drug-addicted, pregnant, daughter and no social life, it’d be easy to assume the brooding atmosphere was present throughout the entire film, but there’s a few rare moments of black humour, particularly in the back and forth dialogue with his partner Sigurður.

The cinematography and music are breathtaking, making the vast Icelandic landscapes simultaneously beautiful and bleak while only intensifying the sense of foreboding and helplessness.

Here’s hoping we get to see more of Erlendur and his cardigans soon.

Isolation

A short video about how it’s possible to feel isolated even in a crowded city. I’m pleased with how this turned out, there’s a seriously ominous feel to it. Thanks to Colin for his filming and editing skills.

The music is Distant Light, Part I: Chromatic Clouds Surround by Slow Six.

The importance of to-do lists

I’ve accomplished more in the past two days than I have the last few weeks combined. Thanks to using up my holiday allowance before the year end, I found myself with two spare days and managed to clear a backlog of miscellaneous stuff that’s needed doing for ages.

You see, I’ve had a re-introduction to the awesome power of the To-do List.

Using nothing more than a tiny Muji notepad, pen and a little forward planning I wrote a list of the things I wanted to get done each day. The motivational power of having a plan (Heath Ledger’s Joker would love that) is incredible, with the feeling of accomplishment as you cross things out encouraging you to do more.

Amusingly, the use of to-do lists is one of the core concepts in David Allen’s Getting Things Done, which has sat unread on my desk for at least a year… a victim of my time management on things I decide are non-essential.

Thanks to the success I’ve had with the simple paper and pen lists, I’m going to apply the same approach at work. I’ll follow up in the comments and let you know how it goes – fingers crossed!

This is where we live

Peter Collingridge’s Apt Studio have teamed up with Asylum Films to make a short animated film to celebrate the 25th anniversary of Harper Collins imprint 4th Estate. Love it!