The following example shows how you can use an embedded font with the Flex LinkButton control by setting the fontFamily and fontWeight styles.
The LinkButton control uses a bold font weight by default, so you need to either embed the bold font weight, or set the LinkButton control’s fontWeight style to normal.
Full code after the jump.
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/09/04/using-an-embedded-font-with-the-linkbutton-control-in-flex/ -->
<mx:Application name="LinkButton_fontFamily_test"
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<mx:Style>
@font-face {
src: local("Arial");
fontFamily: ArialEmbedded;
fontWeight: bold;
}
LinkButton {
fontFamily: ArialEmbedded;
}
</mx:Style>
<mx:LinkButton id="linkButton"
label="LinkButton"
rotation="45" />
</mx:Application>
View source is enabled in the following example.
You can also embed the font using ActionScript, as seen in the following example:
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/09/04/using-an-embedded-font-with-the-linkbutton-control-in-flex/ -->
<mx:Application name="LinkButton_fontFamily_test"
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white"
initialize="init();">
<mx:Script>
<![CDATA[
import mx.controls.LinkButton;
[Embed(systemFont="Arial",
fontName="ArialEmbedded",
fontWeight="bold",
mimeType="application/x-font")]
private const arialEmbedded:Class;
private var linkButton:LinkButton;
private function init():void {
linkButton = new LinkButton();
linkButton.label = "LinkButton";
linkButton.rotation = 45;
linkButton.setStyle("fontFamily", "ArialEmbedded");
addChild(linkButton);
}
]]>
</mx:Script>
</mx:Application>




embedding a system font is easy (everyone has got ‘em .. unless they live in a cave… so they will display)… its those nasty custom ones that are the tricksters =)
sorry, didn’t mean for that to sound as rude as it did, I think this blog is awesome, I hve referred to it many times for little side helpers.
peterd, thanks for all you great examples on flex, I learned a lot from you site. but currently I got a problem on my project, I’m wondering if you can help me out, cause I couldn’t find any solution on the internet.
I’m getting youtube videos from their API and load them into a TileList, is there any way I can show a preloader before all video thumbnails loaded, why dataChange event doesn’t work? but when I trace all the events during the loading, dataChange was there.
any help would be appriciated.~~
regards,
Sky
peterd, sorry, I forgot to tell you that because I have mutipule pages, so that when I change the page, I need a preloader before all videos loaded. thanks~~