'css 적용법'에 해당되는 글 1건

  1. 2008.08.10 htmlText에 CSS파일 적용하기

TextFeild에는 styleSheet라는 속성이 있다. 이곳에 불러들여 파싱한 css파일을 설정한다.
외부에 아래와 같이 css파일을 만든 다음 URLLoader를 통해 무비로 불러들인다.
p{
 font-family:돋움;
 color:#FFFFFF;
 font-size:10;
}
.emphasis{
 font-weight:bold;
 font-style:italic;
 color:#FFFF00;
 font-size:14;
}


불러온 css파일을 StyleSheet를 delegate한 객체에서 parseCSS( 불러온 css.data )메서드를 사용하여 css내용을 분석하여 delegate객체를 TextField의 styleSheet으로 설정한다.

[실제 css에서의 속성과 같은 역할을 하는 AC3에서의 속성]

CSS 속성

ActionScript 속성

구문 및 지원되는 값

color

color

16진수 색상 값만 지원됩니다. blue 등의 명명된 색상은 지원되지 않습니다. 색상은 #FF0000 형식으로 쓰여집니다.

display

display

지원되는 값은 inline, block none입니다.

font-family

fontFamily

쉼표로 분리되는 글꼴 목록이며 내림차순으로 되어 있습니다. 모든 글꼴 집합 이름이 사용될 수 있습니다. 글꼴 이름을 지정하면 해당되는 장치 글꼴로 변환됩니다. mono_typewriter로 변환되고, sans-serif_sans로 변환되며, serif_serif로 변환되는 등의 글꼴 변환이 발생합니다.

font-size

fontSize

값의 숫자 부분만 사용됩니다. 단위(px, pt)는 해석되지 않으며 픽셀과 포인트를 동일하게 처리합니다.

font-style

fontStyle

인식되는 값은 normal italic입니다.

font-weight

fontWeight

인식되는 값은 normal bold입니다.

kerning

kerning

인식되는 값은 true false입니다. 자간은 포함된 글꼴에만 지원됩니다. 일부 글꼴(: Courier New)은 자간을 지원하지 않습니다. kerning 속성은 Windows에서 만든 SWF 파일에서만 지원되고 Macintosh에서 만든 SWF 파일에서는 지원되지 않습니다. 그러나 이러한 SWF 파일은 Windows가 아닌 버전의 Flash Player에서 재생될 수 있으며 자간은 그대로 적용됩니다.

leading

leading

행 사이에 일정하게 분배되는 간격 크기입니다. 값은 각 행 뒤에 추가되는 픽셀 수를 지정합니다. 음수 값을 사용하면 행 사이의 간격이 좁아집니다. 값의 숫자 부분만 사용됩니다. 단위(px, pt)는 해석되지 않으며 픽셀과 포인트를 동일하게 처리합니다.

letter-spacing

letterSpacing

글자 사이에 일정하게 분배되는 간격 크기입니다. 값은 각 문자 뒤에 추가되는 픽셀 수를 지정합니다. 음수 값을 사용하면 문자 사이의 간격이 좁아집니다. 값의 숫자 부분만 사용됩니다. 단위(px, pt)는 해석되지 않으며 픽셀과 포인트를 동일하게 처리합니다.

margin-left

marginLeft

값의 숫자 부분만 사용됩니다. 단위(px, pt)는 해석되지 않으며 픽셀과 포인트를 동일하게 처리합니다.

margin-right

marginRight

값의 숫자 부분만 사용됩니다. 단위(px, pt)는 해석되지 않으며 픽셀과 포인트를 동일하게 처리합니다.

text-align

textAlign

인식되는 값은 left, center, right justify입니다.

text-decoration

textDecoration

인식되는 값은 none underline입니다.

text-indent

textIndent

값의 숫자 부분만 사용됩니다. 단위(px, pt)는 해석되지 않으며 픽셀과 포인트를 동일하게 처리합니다.

 위의 표는 css에서 사용하는 서식의 속성들이다 AS3에서도 Object를 통해 위에 표기된 이름으로 속성을 설정하면 css와 같은 역할을 하지만 AS3 내부에서 처리하려면 TextFormat으 사용하는 것이 좋을 것 같다.

htmlText에 적용법은 일반 html에 적용하듯이 사용하면 된다.
TextField.styleSheet = css;
TextField.htmlText = "<span class='emphasis'>'이동통신망으로 양방향 TV 본다!'</span>을...... 체결했다고 5일 밝혔다.";
위에 빨간 구간이 css에 영향을 받는 서식이 된다.

Posted by 버터백통