Formatera text

Du kan använda klassen TextFormat när du vill ange ett antal egenskaper för visning av text och sedan tillämpa dem på allt innehåll i ett TextField-objekt eller ett textintervall.

I exemplet nedan används ett TextFormat-objekt för ett helt TextField-objekt och ett annat TextFormat-objekt används för ett intervall av text i samma TextField-objekt:

var tf:TextField = new TextField(); 
tf.text = "Hello Hello"; 
 
var format1:TextFormat = new TextFormat(); 
format1.color = 0xFF0000; 
 
var format2:TextFormat = new TextFormat(); 
format2.font = "Courier"; 
 
tf.setTextFormat(format1); 
var startRange:uint = 6; 
tf.setTextFormat(format2, startRange); 
 
addChild(tf);

Metoden TextField.setTextFormat() påverkar bara text som redan visas i textfältet. Om innehållet i textfältet ändras, kanske programmet måste anropa metoden TextField.setTextFormat() igen för att göra om formateringen. Du kan även ange att textfältsegenskapen defaultTextFormat ska specificera formateringen som används för text som användaren skriver.

Textfält kan innehålla oformaterad text eller HTML-formaterad text. Oformaterad text lagras i egenskapen text för instansen och HTML-text lagras i egenskapen htmlText.

Du kan använda CSS formatdeklarationer när du vill definiera textformat som kan användas på flera olika textfält. CSS-formatdeklarationer kan skapas i programkoden eller läsas in vid körningstillfället från en extern CSS-fil.

Klassen flash.text.StyleSheet hanterar CSS-format. Klassen StyleSheet identifierar en begränsad uppsättning av CSS-egenskaper. En utförlig lista över de formategenskaper som klassen StyleSheet har stöd för finns i avsnittet om flash.textStylesheet i Referenshandbok för ActionScript® 3.0 i Adobe® Flash® Professional CS5.

Som exemplet nedan visar, kan du skapa CSS i koden och tillämpa formaten för HTML-text genom att använda ett StyleSheet-objekt:

var style:StyleSheet = new StyleSheet(); 
 
var styleObj:Object = new Object(); 
styleObj.fontSize = "bold"; 
styleObj.color = "#FF0000"; 
style.setStyle(".darkRed", styleObj); 
 
var tf:TextField = new TextField(); 
tf.styleSheet = style; 
tf.htmlText = "<span class = 'darkRed'>Red</span> apple"; 
 
addChild(tf);

I exempelkoden skapas ett enkelt objekt som lagrar en uppsättning formatdeklarationsegenskaper efter det att du skapat ett StyleSheet-objekt. Sedan anropas metoden StyleSheet.setStyle() som lägger till den nya formateringen i formatmallen med namnet ”.darkred”. Formateringen i formatmallen används genom att objektet StyleSheet tilldelas TextField-egenskapen styleSheet.

För att CSS-format ska aktiveras bör formatmallen tillämpas på TextField-objektet innan egenskapen htmlText anges.

Ett textfält med en formatmall kan inte redigeras. Om du har ett textinmatningsfält och tilldelar det en formatmall, visar textfältet formatmallens egenskaper, men användare kan inte skriva ny text i textfältet. Du kan inte heller använda följande ActionScript API:er på ett textfält som tilldelats en formatmall:

• Metoden TextField.replaceText()

• Metoden TextField.replaceSelectedText()

• Egenskapen TextField.defaultTextFormat

• Metoden TextField.setTextFormat()

Om ett textfält har en formatmall tilldelad och egenskapen TextField.styleSheet ställs in på null, kommer innehållet i egenskaperna TextField.text och TextField.htmlText att lägga till taggar och attribut i innehållet för att inkludera formateringen från den tilldelade formatmallen. För att bevara den ursprungliga htmlText-egenskapen, ska du spara den som en variabel innan formatmallen ställs in på null.

CSS-metoden för formatering är effektivare om du läser in CSS-information från en extern fil vid körningstillfället. När CSS-data är externa i förhållande till programmet kan du ändra den visuella stilen för text i programmet utan att ändra ActionScript 3.0 källkoden. När programmet har distribuerats kan du ändra en extern CSS-fil om du vill förändra programmets utseende, utan att behöva omdistribuera programmets SWF-fil.

Metoden StyleSheet.parseCSS() konverterar en sträng som innehåller CSS-data till formatdeklarationer i StyleSheet-objektet. Följande exempel visar hur du läser en extern CSS-fil och tillämpar filens formatdeklarationer på ett TextField-objekt.

Här är innehållet i CSS-filen som ska läsas in och den kallas example.css:

p { 
    font-family: Times New Roman, Times, _serif; 
    font-size: 14; 
} 
 
h1 { 
    font-family: Arial, Helvetica, _sans; 
    font-size: 20; 
    font-weight: bold; 
} 
 
.bluetext { 
    color: #0000CC; 
}    

Sedan följer ActionScript-koden för en klass som läser in example.css-filen och tillämpar formateringen på textfältsinnehåll:

package 
{ 
    import flash.display.Sprite; 
    import flash.events.Event; 
    import flash.net.URLLoader; 
    import flash.net.URLRequest; 
    import flash.text.StyleSheet; 
    import flash.text.TextField; 
    import flash.text.TextFieldAutoSize; 
 
    public class CSSFormattingExample extends Sprite 
    { 
        var loader:URLLoader; 
        var field:TextField; 
        var exampleText:String = "<h1>This is a headline</h1>" +  
            "<p>This is a line of text. <span class='bluetext'>" + 
            "This line of text is colored blue.</span></p>"; 
         
        public function CSSFormattingExample():void 
        { 
            field = new TextField(); 
            field.width = 300; 
            field.autoSize = TextFieldAutoSize.LEFT; 
            field.wordWrap = true; 
            addChild(field); 
             
            var req:URLRequest = new URLRequest("example.css"); 
             
            loader = new URLLoader(); 
            loader.addEventListener(Event.COMPLETE, onCSSFileLoaded); 
            loader.load(req); 
        } 
         
        public function onCSSFileLoaded(event:Event):void 
        { 
            var sheet:StyleSheet = new StyleSheet(); 
            sheet.parseCSS(loader.data); 
            field.styleSheet = sheet; 
            field.htmlText = exampleText; 
        } 
    } 
}

När CSS-data har lästs in, körs metoden onCSSFileLoaded() och anropar metoden StyleSheet.parseCSS() för överföring av formatdeklarationerna till StyleSheet-objektet.

En användbar metod för klassen flash.text.TextField är metoden setTextFormat(). Med setTextFormat() kan du tilldela specifika egenskaper till innehållet i en del av ett textfält som svarar på användarinmatningar, t.ex. formulär som påminner användaren om att vissa inmatningar krävs, eller för att ändra betoningen av ett underavsnitt i ett textstycke när användaren markerar delar av texten.

I exemplet nedan används TextField.setTextFormat() för ett intervall av tecken för att ändra utseendet på en del av innehållet i myTextField när användaren klickar på textfältet:

var myTextField:TextField = new TextField(); 
myTextField.text = "No matter where you click on this text field the TEXT IN ALL CAPS changes format."; 
myTextField.autoSize = TextFieldAutoSize.LEFT; 
addChild(myTextField); 
addEventListener(MouseEvent.CLICK, changeText); 
 
var myformat:TextFormat = new TextFormat(); 
myformat.color = 0xFF0000; 
myformat.size = 18; 
myformat.underline = true; 
 
function changeText(event:MouseEvent):void 
{ 
    myTextField.setTextFormat(myformat, 49, 65); 
}