Text Animation Sample
This topic contains the following sections.
- User Scenario
- Downloading the Sample
- Building the Sample
Illustrate and compare different text rendering methods for animated text scenarios.
This sample demonstrates how to animate text using the Direct2D API. As with any other API, there are multiple ways though which this can be accomplished. Each rendering method offers certain performance and quality measures.
Simple animation effects of text translation, rotation and scale are shown in the sample, as shown in the following screen shot.
The three different rendering methods that have been used are:
- Default: The text is directly written to the back buffer using DrawTextLayout.
- Outline: The text rendering mode is changed to outline (DWRITE_RENDERING_MODE_OUTLINE).
- Using A8 targets: The text is cached as a mask and then rendered using FillOpacityMask.
To help understand performance characteristics of the different text rendering methods, frame rate measure is shown in the title bar.
Text animation is a very common scenario when rendering rich UI. It can be used to create effects such as text flying around, or fading in and out as in slide transitions.
Depending upon the animation scenario different rendering methods might be useful.
For the three basic animation styles shown in this sample, here are some recommendations:
- Translation: For most practical purposes the default case might suffice. In general, even though A8 targets are usually faster, the quality of rendering is not the same. You might find that the text translation is jittery with A8 targets. This is due to constant re-sampling. Also, the text looks blurred when compared to the default or outline case. But again, this might not be important for many animation scenarios since animated text sharpness might not be very discernable.
- Rotation: The outline rendering method might be best suited for this due to the least complexity of implementation. A8 targets will be the fastest but there is a trade-off in terms of code complexity when compared to the outline case. The default case is much slower because font re-rasterization is a big bottleneck given that font cache does not necessarily contain the correct transformation of the text upon successive rendering.
- Scaling: Again, outline might be best suited for scaling as well. Default case text can look jittery because text hinting technique is used for snapping text to the pixel boundaries. As with the rotation case, the default case will be much slower due to font re-rasterization. In the case of A8 targets, the text can look pixilated when the scale is very large.
This sample can be run with multiple settings to change the text animation type and the rendering method. Here are the various options to choose from:
Change the text animation style to any of the following:
- Translation (toggle with 't' key)
- Rotation (toggle with 'r' key)
- Scaling (toggle with 's' key)
In addition, animation effects can be combined by selecting more than one at the same time. For example press the 'r' and 's' to see the text getting scaled while rotating.
Change the text rendering method to any of the following:
- Default (select with '1' key)
- Outline (select with '2' key)
- Use A8 targets (select with '3' key)
|Minimum supported client||Windows 7 or Windows Vista with Service Pack 2 (SP2) and Platform Update for Windows Vista|
|Minimum supported server||Windows Server 2008 R2 or Windows Server 2008 with Service Pack 2 (SP2) and Platform Update for Windows Server 2008|
|Windows SDK||Windows Software Development Kit (SDK) for Windows 7|
This sample is available in the following locations.
|Windows SDK||\Program Files\Microsoft SDKs\Windows\v7.0\Samples\Multimedia\Direct2D\TextAnimationSample|
|Code Gallery||Download from MSDN Code Gallery|
- Open the Command Prompt window and navigate to the sample directory.
- Open Windows Explorer and navigate to the sample directory.
- Double-click the icon for the .sln (solution) file to open the file in Visual Studio.
- In the Build menu, select Build Solution. The application will be built in the default \Debug or \Release directory.
Build date: 1/22/2012