텍스트 표시
Flash Player 9 이상, Adobe AIR 1.0 이상
Flash Builder 및 Flash Professional과 같은 제작 도구에서는 텍스트 관련 구성 요소 또는 텍스트 도구 등 여러 가지 텍스트 표시 옵션을 제공하지만 가장 간단한 텍스트 표시 방법은 텍스트 필드를 통해 프로그래밍 방식으로 텍스트를 표시하는 것입니다.
텍스트 유형
텍스트 필드 내의 텍스트 유형은 다음과 같이 해당 소스에 따라 특징이 결정됩니다.
-
동적 텍스트
동적 텍스트에는 텍스트 파일, XML 파일 또는 원격 웹 서비스 등 외부 소스에서 로드한 내용이 포함됩니다.
-
입력 텍스트
입력 텍스트는 사용자가 입력한 모든 텍스트 또는 사용자가 편집할 수 있는 동적 텍스트입니다. 스타일 시트를 설정하여 입력 텍스트의 서식을 지정하거나 flash.text.TextFormat 클래스를 사용하여 입력 내용의 텍스트 필드에 속성을 할당할 수 있습니다. 자세한 내용은
텍스트 입력 캡처
를 참조하십시오.
-
정적 텍스트
정적 텍스트는 Flash Professional를 통해서만 만듭니다. ActionScript 3.0을 사용하여 정적 텍스트 인스턴스를 만들 수 없습니다. 그러나 StaticText 및 TextSnapshot과 같은 ActionScript 클래스를 사용하여 기존의 정적 텍스트 인스턴스를 조작할 수 있습니다. 자세한 내용은
정적 텍스트를 사용한 작업
을 참조하십시오.
텍스트 필드 내용 수정
flash.text.TextField.text
속성에 문자열을 할당하여 동적 텍스트를 정의할 수 있습니다. 다음과 같이 속성에 문자열을 직접 할당합니다.
myTextField.text = "Hello World";
다음 예와 같이 스크립트에 정의된 변수의 값을
text
속성에 할당할 수도 있습니다.
package
{
import flash.display.Sprite;
import flash.text.*;
public class TextWithImage extends Sprite
{
private var myTextBox:TextField = new TextField();
private var myText:String = "Hello World";
public function TextWithImage()
{
addChild(myTextBox);
myTextBox.text = myText;
}
}
}
또는
text
속성에 원격 변수의 값을 할당할 수도 있습니다. 원격 소스에서 텍스트 값을 로드할 수 있는 세 가지 옵션이 있습니다.
-
flash.net.URLLoader 및 flash.net.URLRequest 클래스는 로컬 또는 원격 위치의 텍스트에 대한 변수를 로드합니다.
-
FlashVars
특성은 SWF 파일을 호스트하는 HTML 페이지에 포함되어 있으며 텍스트 변수의 값을 포함할 수 있습니다.
-
flash.net.SharedObject 클래스는 값의 영구적 저장소를 관리합니다. 자세한 내용은
로컬 데이터 저장
을 참조하십시오.
HTML 텍스트 표시
flash.text.TextField 클래스에는 텍스트 문자열을 내용의 서식을 지정하기 위한 HTML 태그가 포함된 텍스트 문자열로 식별하는 데 사용할 수 있는
htmlText
속성이 포함됩니다. 텍스트를 HTML로 렌더링하려면 다음과 같이 Flash Player 또는 AIR의
htmlText
속성(
text
속성 아님)에 문자열 값을 할당해야 합니다.
var myText:String = "<p>This is <b>some</b> content to <i>render</i> as <u>HTML</u> text.</p>";
myTextBox.htmlText = myText;
Flash Player 및 AIR에서는
htmlText
속성에 대해 일부 HTML 태그 및 항목을 지원합니다. ActionScript 3.0 참조 설명서의
flash.text.TextField.htmlText
속성 설명에는 지원되는 HTML 태그 및 항목에 대한 자세한 내용이 나와 있습니다.
htmlText
속성을 사용하여 내용을 지정한 후에는 스타일 시트 또는
textformat
태그를 사용하여 내용의 서식을 관리할 수 있습니다. 자세한 내용은
텍스트 서식 지정
을 참조하십시오.
텍스트 필드에 이미지 사용
내용을 HTML 텍스트로 표시하는 것의 또 다른 장점은 텍스트 필드에 이미지를 포함할 수 있다는 것입니다.
img
태그를 사용하여 로컬 또는 원격 이미지를 참조하고 연결된 텍스트 필드 내에 표시되도록 할 수 있습니다.
다음 예제에서는
myTextBox
라는 텍스트 필드를 만들고 SWF 파일과 동일한 디렉토리에 저장된 눈 모양의 JPG 이미지를 표시되는 텍스트 내에 포함합니다.
package
{
import flash.display.Sprite;
import flash.text.*;
public class TextWithImage extends Sprite
{
private var myTextBox:TextField;
private var myText:String = "<p>This is <b>some</b> content to <i>test</i> and <i>see</i></p><p><img src='eye.jpg' width='20' height='20'></p><p>what can be rendered.</p><p>You should see an eye image and some <u>HTML</u> text.</p>";
public function TextWithImage()
{
myTextBox.width = 200;
myTextBox.height = 200;
myTextBox.multiline = true;
myTextBox.wordWrap = true;
myTextBox.border = true;
addChild(myTextBox);
myTextBox.htmlText = myText;
}
}
}
img
태그는 JPEG, GIF, PNG 및 SWF 파일을 지원합니다.
텍스트 필드의 텍스트 스크롤
많은 경우 입력할 텍스트의 길이가 해당 텍스트를 표시하는 텍스트 필드보다 길 수 있습니다. 또는 한 번에 표시할 수 있는 것보다 더 많은 텍스트를 입력 필드에 입력할 수 있는 경우도 있습니다. flash.text.TextField 클래스의 스크롤 관련 속성을 사용하여 길이가 긴 내용을 세로 또는 가로로 관리할 수 있습니다.
스크롤 관련 속성으로는
TextField.scrollV
,
TextField.scrollH
,
maxScrollV
및
maxScrollH
가 있습니다. 이러한 속성을 사용하여 마우스 클릭 또는 키 누르기와 같은 이벤트에 대응할 수 있습니다.
다음 예제에서는 설정된 크기의 텍스트 필드를 만들고 해당 필드에서 한 번에 표시할 수 있는 것보다 더 많은 텍스트를 포함합니다. 사용자가 텍스트 필드를 클릭하면 텍스트가 세로로 스크롤됩니다.
package
{
import flash.display.Sprite;
import flash.text.*;
import flash.events.MouseEvent;
public class TextScrollExample extends Sprite
{
private var myTextBox:TextField = new TextField();
private var myText:String = "Hello world and welcome to the show. It's really nice to meet you. Take your coat off and stay a while. OK, show is over. Hope you had fun. You can go home now. Don't forget to tip your waiter. There are mints in the bowl by the door. Thank you. Please come again.";
public function TextScrollExample()
{
myTextBox.text = myText;
myTextBox.width = 200;
myTextBox.height = 50;
myTextBox.multiline = true;
myTextBox.wordWrap = true;
myTextBox.background = true;
myTextBox.border = true;
var format:TextFormat = new TextFormat();
format.font = "Verdana";
format.color = 0xFF0000;
format.size = 10;
myTextBox.defaultTextFormat = format;
addChild(myTextBox);
myTextBox.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownScroll);
}
public function mouseDownScroll(event:MouseEvent):void
{
myTextBox.scrollV++;
}
}
}
|
|
|