Formatação de texto

É possível usar a classe TextFormat para definir um número diferente de propriedade de exibição de texto e aplicá-las à todo o conteúdo de um objeto TextField ou a um intervalo de texto.

O exemplo a seguir aplica um objeto de TextFormat a um objeto TextField inteiro e aplica um segundo Objeto TextFormat a um intervalo de texto dentro desse objeto TextField.

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);

O método TextField.setTextFormat() afeta apenas o texto que já está exibido no campo de texto. Se o conteúdo em TextField mudar, talvez seja necessário que o aplicativo chame o método TextField.setTextFormat() novamente para reaplicar a formatação. Ainda é possível definir a propriedade defaultTextFormat de TextField para especificar o formato a ser usado para o texto inserido pelo usuário.

Os campos de texto contêm texto sem formatação ou formatado em HTML. O texto sem formatação está armazenado na propriedade text da instância e o texto HTML está armazenado na propriedadehtmlText.

É possível usar declarações de estilo CSS para definir estilos de texto que você possa aplicar a diferentes campos de texto. As declarações de estilo CSS podem ser criadas no seu código de aplicativo ou carregada em um tempo de execução a partir de um arquivo CSS externo.

A classe flash.text.StyleSheet manipula os estilos das CSS. A classe StyleSheet reconhece um conjunto limitado de propriedades das CSS. Para obter uma lista detalhada das propriedades de estilo que a classe StyleSheet suporta, consulte a entrada flash.textStylesheet na Referência do ActionScript 3.0.

Como o exemplo a seguir mostra, é possível criar as CSS em seu código e aplicar esses estilos ao texto HTML usando um objeto StyleSheet:

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);

Depois de criar um objeto StyleSheet, o código de exemplo cria um objeto simples para manter um conjunto de propriedades de declaração de estilos. Em seguida, ele chama o método StyleSheet.setStyle()que adiciona o novo estilo à folha de estilos com o nome “.darkred”. Depois, ele aplica a formatação da folha de estilos atribuindo o objeto StyleSheet à propriedade styleSheet do TextField.

Para que os estilos das CSS tenham efeito, a folha de estilos deve ser aplicada ao objeto TextField antes que a propriedade htmlText seja definida.

Por design, um campo de texto com uma folha de estilos não é editável. Se tiver um campo de texto de entrada e atribuir uma folha de estilos a ele, o campo de texto apresentará as propriedades da folha de estilos, mas o campo texto não permitirá que usuários insiram o novo texto nele. Além disso, não será possível usar as APIs do ActionScript abaixo em um campo de texto caso uma folha de estilos esteja atribuída:

• O método TextField.replaceText()

• O método TextField.replaceSelectedText()

• A propriedade TextField.defaultTextFormat

• O método TextField.setTextFormat()

Se um campo de texto tiver uma folha de estilos atribuída a ele, no entanto, posteriormente, a propriedade TextField.styleSheet for definida como null, o conteúdo das propriedades TextField.text e TextField.htmlText adicionarão tags e atributos ao conteúdo para incorporar a formatação da folha de estilos anteriormente atribuída. A fim de preservar a propriedade htmlText original, salve-a em uma variável antes de definir a folha de estilos como null.

A abordagem das CSS para formatação será mais eficaz quando for possível carregar as informações das CSS desde um arquivo externo no tempo de execução. Quando os dados das CSS forem externos ao próprio aplicativo, será possível alterar o estilo visual do texto no aplicativo sem ter de alterar o código de origem do ActionScript 3.0. Depois da implementação do aplicativo, é possível alterar um arquivo CSS externo para alterar a aparência do aplicativo, sem ter de reimplementar o arquivo SWF do aplicativo.

O método StyleSheet.parseCSS() converte uma sequência de caracteres que contém dados CSS em declarações de estilo no objeto StyleSheet. O exemplo a seguir mostra como ler um arquivo CSS externo e aplicar suas declarações de estilo a um objeto TextField.

Em primeiro lugar, este é o conteúdo do arquivo CSS a ser carregado, denominado exemplo.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; 
}    

Ao lado, está o código do ActionScript para uma classe que carrega o arquivo example.css e aplica os estilos ao conteúdo TextField.

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; 
        } 
    } 
}

Quando os dados das CSS forem carregados, o método onCSSFileLoaded() será executado e chamará o método StyleSheet.parseCSS() para transferir as declarações de estilos para o objeto StyleSheet.

Um método útil da classe flash.text.TextField é o método setTextFormat() Com setTextFormat(), é possível atribuir propriedades específicas ao conteúdo de parte de um campo de texto para responder à entrada do usuário, por exemplo, formulários que precisem lembrar usuários que determinadas entradas são necessárias ou alterar a ênfase de uma subseção de uma passagem de texto em um campo quando um usuário seleciona partes do texto.

O exemplo a seguir usa TextField.setTextFormat() em um cadeia de caracteres para alterar a aparência de parte do conteúdo do myTextField quando o usuário clica no campo de texto:

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); 
}