Text Layout Framework: Flex Samples

The Text Layout Framework is an ActionScript library that provides text composition functionality. It is built on the Flash text engine available in Flash Player 10. This framework provides support for high quality, typographically rich, flowable text layout with selection, editing, undo, copy-paste, and an XML markup language to dynamically style text.

The Text Layout Framework can be used by any developer who wants to build new text components for Flash Player. It uses pure ActionScript; you can work with it in any Flash or Flex development environment. The library is implemented by the flashx.textLayout.* packages in textLayout.swc.

Flex sample projects

Note: These are examples of using TLF within Flex. These are not examples of using the new TLF-based Gumbo components.

The flex/SimpleEditor folder of the Text Layout Framework SDK contains the SimpleEditor example Flex project.

This project demonstrates how to work with the Text Layout Framework in Flex Builder. It defines an editing component (SimpleEditor) that is built using the Text Flex component and the text-layout SWC libraries.

The flex/SimpleEditorWithCSS folder of the Text Layout Framework SDK contains the SimpleEditorWithCSS example Flex project.

This project enhances SimpleEditor to include CSS styling support using the IFormatResolver.

The flex/TextLayoutEditor folder of the Text Layout Framework SDK contains the TextLayoutEditor example Flex project.

This project is a large demonstration editor for working with TextLayout Framework content.

Building the example projects

You can build the example projects with Flash Builder 4. To load the project into your FlashBuilder development environment:

  1. Open Flash Builder 4.
  2. Switch your workspace to the parent of the Samples folder.
  3. In the Preferences dialog Flex tab, select "Installed Flex SDKs".
  4. Add a recent nightly build version of the Flex Gumbo version of the SDK, and make it the default SDK. Note: Recent builds include the TLF 1.0 release candidate - after Flex 4 ships use that.
  5. Choose File > Import.
  6. In the General tab, select "Existing Projects into Workspace".
  7. Browse to the root folder of the workspace. It is preselected.
  8. Deselect any examples you do not want to import. Do not select "Copy into workspace".
  9. Click Finish. You can now build and run the examples from your development environment.