Geavanceerde tekstrendering

Flash Player 9 of hoger, Adobe AIR 1.0 of hoger

ActionScript 3.0 biedt verschillende klassen in het flash.text-pakket voor het sturen van de eigenschappen van weergegeven tekst, waaronder ingesloten lettertypen, instellingen voor antialiasing, alfakanaalbesturing en andere specifieke instellingen. De Naslaggids voor ActionScript 3.0 voor het Adobe Flash-platform biedt gedetailleerde beschrijvingen van deze klassen en eigenschappen, inclusief de klassen CSMSettings, Font en TextRenderer.

Ingesloten lettertypen gebruiken

Wanneer u een specifiek lettertype opgeeft voor een tekstveld in de toepassing, zoekt Flash Player of AIR naar een apparaatlettertype (een lettertype dat zich op de computer van de gebruiker bevindt) met dezelfde naam. Als het lettertype niet op het systeem wordt aangetroffen, of als de gebruiker een iets andere versie heeft van een lettertype met die naam, kan de tekstweergave sterk afwijken van wat u in gedachte had. Standaard wordt de tekst in een Times Roman-lettertype weergegeven.

Om te zorgen dat de gebruiker precies het juiste lettertype ziet, kunt u dat lettertype insluiten in het SWF-bestand van de toepassing. Ingesloten lettertypen hebben een aantal voordelen:

  • Tekens van ingesloten lettertypen zijn antialiased, waardoor de randen ervan er vloeiender uitzien, vooral bij grotere tekst.

  • U kunt tekst die gebruik maakt van ingesloten lettertypen roteren.

  • Tekst met ingesloten lettertypen kan transparant of semitransparant worden gemaakt.

  • U kunt de CSS-stijl kerning gebruiken bij ingesloten lettertypen.

De belangrijkste beperking bij het gebruik van ingesloten lettertypen is dat hierdoor de bestandsgrootte of downloadgrootte van de toepassing toeneemt.

Afhankelijk van uw ontwikkelingsomgeving, verschilt de exacte methode waarop een lettertypebestand in het SWF-bestand van uw toepassing wordt ingesloten.

Wanneer u een lettertype hebt ingesloten, kunt u zorgen dat een tekstveld het juiste ingesloten lettertype gebruikt:

  • Stel de eigenschap embedFonts van het tekstveld in op true .

  • Maak een TextFormat-object, stel de eigenschap fontFamily ervan in op de naam van het ingesloten lettertype en pas het TextFormat-object toe op het tekstveld. Wanneer u een ingesloten lettertype opgeeft, moet de eigenschap fontFamily slechts één naam bevatten. Er kan geen door komma's gescheiden lijst van meerdere lettertypenamen worden gebruikt.

  • Als u CSS-stijlen gebruikt om lettertypen in te stellen voor TextFields of componenten, stelt u de CSS-eigenschap font-family in op de naam van het ingesloten lettertype. De eigenschap font-family moet één naam bevatten en geen lijst met namen als u een ingesloten lettertype wilt opgeven.

Een lettertype insluiten in Flash

Met Flash Professional kunt u bijna elk lettertype dat op uw systeem is geïnstalleerd, insluiten, inclusief TrueType-lettertypen en Type 1 Postscript-lettertypen.

U kunt lettertypen op veel manieren in een toepassing insluiten, zoals:

  • De lettertype- en stijleigenschappen van een tekstveld instellen in het werkgebied en klikken op het selectievakje Lettertypen insluiten

  • Een lettertypesymbool maken en hiernaar verwijzen

  • Een tijdens runtime gedeelde bibliotheek met symbolen van ingesloten lettertypen maken en gebruiken

Zie “Ingesloten lettertypen voor dynamische of invoertekstvelden” in Flash gebruiken voor meer informatie over het insluiten van lettertypen in toepassingen.

Lettertypen insluiten in Flex

U kunt lettertypen op veel manieren insluiten in een Flex-toepassing, zoals:

  • Met de metagegevenstag [Embed] in een script

  • Met de stijldeclaratie @font-face

  • Stel een klasse voor het lettertype vast en gebruik de tag [Embed] om het lettertype in te sluiten.

U kunt alleen TrueType-lettertypen rechtstreeks insluiten in een Flex-toepassing. Lettertypen in andere indelingen, zoals Type 1 Postscript-lettertypen, kunnen eerst met Flash Professional worden ingesloten in een SWF-bestand dat u vervolgens gebruikt in uw Flex-toepassing. Zie 'Lettertypen van SWF-bestanden insluiten' in Flex 4 gebruiken

Scherpte, dikte en antialiasing regelen

Standaard bepaalt Flash Player of AIR de instellingen voor tekstweergave-elementen zoals scherpte, dikte en antialiasing als de grootte van de tekst wordt aangepast, de kleur wordt gewijzigd of de tekst wordt weergegeven op verschillende achtergronden. In sommige gevallen, zoals wanneer u zeer kleine of zeer grote tekst hebt, of tekst tegen een verscheidenheid aan unieke achtergronden, wilt u wellicht de controle houden over deze instellingen. U kunt de instellingen van Flash Player of AIR negeren met de klasse flash.text.TextRenderer en de bijbehorende klassen, zoals de klasse CSMSettings. Deze klassen geven u precieze controle over de weergavekwaliteit van ingesloten tekst. Zie Ingesloten lettertypen gebruiken voor meer informatie over ingesloten lettertypen.

Opmerking: De eigenschap flash.text.TextField .antiAliasType moet de waarde AntiAliasType.ADVANCED hebben om de scherpte, dikte of de eigenschap gridFitType te kunnen instellen of om de methode TextRenderer.setAdvancedAntiAliasingTable() te kunnen gebruiken.

In het volgende voorbeeld worden aangepaste CSM-eigenschappen (Continuous Stroke Modulation) en opmaak toegepast op weergegeven tekst met behulp van een ingesloten lettertype met de naam myFont . Wanneer de gebruiker op de weergegeven tekst klikt, past Flash Player of Adobe AIR de aangepaste instellingen toe:

var format:TextFormat = new TextFormat(); 
format.color = 0x336699; 
format.size = 48; 
format.font = "myFont"; 
 
var myText:TextField = new TextField(); 
myText.embedFonts = true; 
myText.autoSize = TextFieldAutoSize.LEFT; 
myText.antiAliasType = AntiAliasType.ADVANCED; 
myText.defaultTextFormat = format; 
myText.selectable = false; 
myText.mouseEnabled = true; 
myText.text = "Hello World"; 
addChild(myText); 
myText.addEventListener(MouseEvent.CLICK, clickHandler); 
 
function clickHandler(event:Event):void 
{ 
    var myAntiAliasSettings = new CSMSettings(48, 0.8, -0.8); 
    var myAliasTable:Array = new Array(myAntiAliasSettings); 
    TextRenderer.setAdvancedAntiAliasingTable("myFont", FontStyle.ITALIC, TextColorType.DARK_COLOR, myAliasTable); 
}