본문 바로가기

Blog/Flex

Flash CS4에서 폰트 임베딩

주름살_뿌꾸님에 (htmlText에 embed Font 적용시 주의점) 글을 읽다가 Flash 8.0으로 개발하던 때 폰트 임베딩 시키고 이를 적용하는 방법 때문에 한동안 삽질했던 기억이 납니다. 라이브러리 창에 폰트 임베딩 하는 것도 처음 이였고(이름 지정 하는 데가 왜이리 많은지..) 적용 시키는 것도 setNewTextFormat()와 setTextFormat() 두 가지 메서드를 사용하는데 사용법이 살짝 달라서 말하자면 3가지를 잘못 사용할 경우가 짬뽕된 상황에서 제대로 삽질했었죠 ㅋ~. 나중에 해놓고 보니 뭐 별것도 아닌게… 라는 생각에 한번 더 확 올라왔죠. 참 쉬운 것도 누군가가 알려주지 않으면 맨땅 헤딩하듯 찾아야 하는게 우리 일인가 봅니다.

그때 고생 했던 게 문득 생각나서 CS4에서 임베딩 방법하고 적용하는 것까지 한번 정리 들어갑니다.

Flash CS4에서 폰트 임베딩

아래 그림의 번호 순서 대로 실행하면 라이브러리 창에 폰트 삽입 끝~.

1번 라이브러리 창에서 오른 마우스 클릭 후 [New Font] 선택합니다.
2번 폰트 정보를 설정합니다. 나중에 코드 상에서 이 Font 이름을 사용합니다.
3번 체크박스를 선택하고
4번 Class 이름을 임의대로 설정합니다. Flash가 자동으로 생성해주는 flash.text.Font 클래스의 파생 클래스 이름 입니다.
5번 OK 버튼을 클릭한다.
6번 swf 파일을 생성할 때 4번에서 설정한 Class를 자동으로 생성한다는 말입니다. 클릭하면 짜잔~~!

라이브러리에 EmbedFont 라는 Linkage 이름으로 생성 됐네요. 한가지 주의할 점이 CS4에서는 Font 이름을 영문으로 사용해야 한다네요.. 한글 폰트로 설정 안해 봤더라면 모르고 넘어갈 뻔 했습니다. 아놔 어쩐지 안돼 이걸로 또 삽질이여.. 폰트랑 나랑은 잘 안 맞는거 같아요.

Preferences 창에서 폰트 이름을 영문으로 표시되게 체크합니다. "맑은 고딕" 의 영문 이름이 "Malgun Gothic" 인걸 알겠군요.ㅋㅋ

이제 사용해봅시다. 타임라인 첫프레임에서 다음을 코딩해서 테스트 해보세요.

TextFormat 생성

 var format:TextFormat = new TextFormat();
format.color = 0x336699;
format.size = 48;
format.font =
"Malgun Gothic";

font-family 이름을 영문으로 해줍니다.

var TF:TextField = new TextField();

TF.embedFonts =
true;
TF.autoSize = TextFieldAutoSize.LEFT;
TF.antiAliasType = AntiAliasType.ADVANCED;

TF.defaultTextFormat = format;

TF.text =
"Hello 헬로";

//TF.setTextFormat(format);

addChild(TF);

텍스트 필드에 embedFonts 속성을 true로 해서 임베드된 폰트를 사용한다고 설정하고, TextFormat을 지정해주면 되는데 지정하는 방법이 두 가지가 있습니다. AS 2.0 Migration 문서 내용을 보면 AS3.0 으로

setNewTextFormat() à flash.text.TextField.defaultTextFormat
setTextFormat()
à flash.text.TextField.setTextFormat()

이렇게 바뀌었네요. 주의할 점은 defaultTextFormat 속성은 항상 text 속성을 지정하기 이전에, setTextFormat() 메서드는 지정한 이 후에 사용해야 합니다.

CSS를 적용할 수도 있는데요 이때에도 다음 사항을 주의해야 합니다. LiveDoc 도움말에 나와있는 내용입니다.

스타일 시트가 있는 텍스트 필드는 편집할 수 없도록 만들어져 있습니다. 입력 텍스트 필드가 있고 이 필드에 스타일 시트를 할당한 경우 텍스트 필드에 스타일 시트의 속성이 표시되기는 하지만 사용자가 이 텍스트 필드에 새 텍스트를 입력할 수는 없습니다. 또한 스타일 시트가 지정된 텍스트 필드에서는 다음과 같은 ActionScript API를 사용할 수 없습니다.
■ TextField.replaceText() 메서드
■ TextField.replaceSelectedText() 메서드
■ TextField.defaultTextFormat 속성
■ TextField.setTextFormat() 메서드

만약 CSS가 적용된 텍스트 필드에 TextFormat 을 설정하려고 하면 다음과 같은 에러가 발생합니다.
Error: Error #2009: 이 메서드는 스타일 시트가 지정된 텍스트 필드에서 사용할 수 없습니다.

제대로 알고 사용하지 않으면 곳곳이 지뢰밭인 것 같습니다. 꼭 위 방법이 아니더라도 AS3.0에서는 메타데이터 태그를 지원해 줌으로 손쉽게 임베딩 시킬 수 있습니다. (그럼 지금까지 한건 머란 말이냐 ㅠㅠ)

[Embed(source = '../lib/CONSOLA.TTF', fontName = "Font 이름", mimeType = "application/x-font-truetype")]
[
Embed(source = 'C:\WINDOWS\Fonts\CONSOLA.TTF', fontName = "Font 이름 ", mimeType = "application/x-font-truetype")]
[
Embed(systemFont = 'Consolas', fontName = "Font 이름 ", mimeType = "application/x-font-truetype")]

이렇게 간단히…ㅎㅎ ( [AS 3.0] 폰트 임베드하기 (Embed Fonts in ActionScript 3) 참고하세요)