20
Timed Text 1 부부 SMIL 3.0 1. SMIL 부부 부부부 부부부 1.1 smilText 응응 smilText 응응 Headline Text Labels Captions/subtitles Foreign-language Time-constrained moving text Inter-object triggered text Conditional timed text Static block text: 응응응 , 응응 응응

부록 SMIL 3.0 1. SMIL 에서 타임드 텍스트

  • Upload
    gunda

  • View
    55

  • Download
    1

Embed Size (px)

DESCRIPTION

부록 SMIL 3.0 1. SMIL 에서 타임드 텍스트. 1.1 smilText 응용 smilText 응용 Headline Text Labels Captions/subtitles Foreign-language Time-constrained moving text Inter-object triggered text Conditional timed text Static block text: 도움말 , 내용 설명. 1.2 smilText 요소와 속성 1.2.1 smilText 요소 - PowerPoint PPT Presentation

Citation preview

Page 1: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 1

부록 SMIL 3.01. SMIL 에서 타임드 텍스트

1.1 smilText 응용 smilText 응용

Headline Text

Labels

Captions/subtitles

Foreign-language

Time-constrained moving text

Inter-object triggered text

Conditional timed text

Static block text: 도움말 , 내용 설명

Page 2: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 2

1.2 smilText 요소와 속성1.2.1 smilText 요소

Element: <smilText> text rendering, text styling, text motion 을 위한 속성이 추가

<smilText>

attributes

All Media AttributesTextRendering Attibutes

TextStyling Attributed

TextMotion Attributed

parents All Media Parents

children

<textStyle>

Text Rendering ElementsText Segmentation Elements

smilText content

<metadata>

Page 3: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 3

Element: <textstyle>

텍스트 속성들의 집합을 그룹핑하기 위한 논리적인 컨테이너

스타일 속성과 모션 속성을 포함

<textStyle>

attributes

CoreI18N

TextRendering Attributes

TextStyling Attributes

TextMotion Attributes

parents <textStyling>

children <metadata>

I18N(Internationalization): 국제화는 제품이나 서비스를 특정지역의 언어나 문화에 맞추는 , 즉 현지화라고 불리는 과정을 쉽게 할 수 있도록 계획하거나 이행하는 과정을 말한다 . 국제화는 때로 번역 및 현지화 능력부여 작업

Page 4: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 4

Element: <textStyling> <textStyle> 요소들의 집합을 그룹핑하기 위한 논리적 컨테이너

<textStyling>

attributes CoreI18N

parents <head>

childrens<metadata>

<textStyle>

1.2.2 smilText 속성Text Rendering Control Attributes: alignment, text wrapping, 텍스트 내용의 writing mode 속성Text Styling Attributed: 텍스트 내용을 위한 일반적인 스타일링 제어를 정의

텍스트 칼라 : textBackgroundColor, textColor 사용되는 폰트 : textFontFamily, textFontSize, textFontWeight, textFontStyle 일반적인 스타일 정의 속성 : textStyle

Page 5: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 5

1.3 렌더링 제어 요소와 속성1.3.1 텍스트 렌더링 제어 요소

Element: <tev>

timing event value 요소는 smilText 의 블럭에서 일시적인 이동을 정의

<tev>

attribute

Core

I18N

begin

next

parents <smilText>

children <metadata>

Page 6: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 6

Element: <clear>

smilText 내용을 포함하는 렌더링 지역을 지운다 .

<clear>

attribute

CoreI18Nbeginnext

parents <smilText>

children <metadata>

Element: <br>

<clear>

attribute CoreI18N

parents <smilText>

children <metadata>

Page 7: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 7

1.3.2 텍스트 렌더링 제어 속성 Attribute: begin Attribute: next

next 에 의해 명시된 모든 시간은 이전 <tev>/<clear>/<smilText> 요소의 시작으로부터 상대적 오프셋이다 .

Attribute: textWrapOption SMIL 지역의 렌더링 공간에 적합치 않은 텍스트 라인에 대한 렌더링 행위를

정의한다 .

Attribute: xml:space default preserve

1.4 세그멘테이션 , 스타일링 요소와 속성1.4.1 텍스트 세그멘테이션 요소

Element: <div> 인라인 포맷팅 속성을 위한 논리적 컨테이너 요소의 렌더링 이전에 분명한 줄바꿈을 발생시킨다 . textAlign 속성을 명기할 수 있다는 것을 제외하고 <p> 와 유사하다 .

Page 8: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 8

<div>

attributes

Core, I18NtextWrapOption

xml:space

Text Styling Attributesparents <smilText>, <div>

children

<metadata>Text Content

{tev>, <clear>, <br>

<div>, <p>, <span>

Element: <p> 인라인 포맷팅 속성을 위한 논리적 컨테이너

요소의 랜더링 이전에 분명한 줄바꿈을 발생시킨다 .

Page 9: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 9

<p>attributed All <div> attributes except textAlign

parents <smilText>, <div>

children

<metadata>Text Content

<tev>, <clear>, <br>

<span>

Element: <span> 인라인 포맷팅 속성을 위한 논리적 컨테이너

요소의 렌더링 이전에 분명한 줄바꿈을 일으키지 않는다 .

<span> 요소의 주된 사용은 로컬 스타일링을 제공하는 것이다 . 텍스트 방향은 어떤 span 내에서 변경될 수 있으나 , writing mode 는 전체 블록에 적용되지 않는다 .

Page 10: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 10

<span>

attributes All <p> attributes except textWritingMode

textDirection

parents <smilText>, <div>, <p>, <span>

children

<metadata>Text Content

<tev>, <clear>, <br>

<span>

1.4.2 텍스트 스타일링 속성일반적인 렌더링 속성

Attribute: textMode <tev> 또는 <clear> 에서 내용의 새로운 프래그먼트가 렌더링 지역에 어떻게 추가될 지를

명시한다 . {append | replace | inherit}

Attribute: textAlign 텍스트가 레이아웃 지역에서 어떻게 정렬되는 지를 명시 {start | end | left | right | center | inherit}

Page 11: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 11

Attribute: textPlace 텍스트의 새로운 블록이 렌더링 지역내에서 위치해야 하는 곳을 결정한다 . start | center | end | inherit

Attribute: textWritingMode 어떤 지역에 위치하는 텍스트의 요구되는 첫 번째와 두 번째 쓰기 방향에 대한 힌트를

제공한다 . 첫 번째 방향은 연속적인 문자들을 위해 사용되고 , 두 번째 방향은 연속적인 라인들을 위해

사용된다 . {lr-tb | rl-tb | tb-rl | tb-lr | lr | rl | inherit}

Attribute: textDirection <span> 내에 정의된 텍스트의 방향을 명시하는 것을 허용 { ltr | rtl | ltro | rtlo | inherit } bidi-override: 해당 요소가 인라인 요소이거나 인라인 요소만을 포함한 블록 요소일 경우

속성을 덮어 쓴다 (override).

내용 스타일링 속성들 Attribute: textColor Attribute: textBackgroundColor Attribute: textFontFamily

텍스트를 표현하기 위하여 사용되는 폰트의 이름 또는 계열을 정의한다 . {monospace | sansSerif | serif | inherit}

Page 12: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 12

Attribute: textFontSize {absolute-size | relative-size | inherit} absolute-size = {xx-small | x-small | small |m medium | large | x-large | xx-large} relative-size={larger | smaller}

Attribute: textFontStyle {normal | italic | oblique | reverseOblique | inherit}

Attribute: textFontweight {normal | bold | inherit}

Attribute: textStyle

1.5 텍스트 모션 요소와 속성1.5.1 smilText 모션 요소

모션 속성들이 다음 요소들 : <region>, <smilText>, <textStyle> 상에서 사용되어지는 것을 허용한다 .

1.5.2 smilText 모션 속성 Attribute: textMode

같은 <smilText> 요소내의 내용에 새로운 프래그먼트가 어떻게 추가되는지를 기술한다 .

{append | replace | crawl | scroll | jump | inherit}

Page 13: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 13

Attribute: textConceal 어떤 움직이는 텍스트 스트링이 렌더링 지역 외부 또는 내부에서 시작하는지 ,

그리고 그것이 그것의 기간의 끝에 그 지역에 존재하는지를 식별한다 .

{none | initial | final | both | inherit}

Attribute: textRate 텍스트 모션이 발생하는 율을 기술한다 .

{ auto | CSS2 pixel value | non-negative integer}

1.6 smilText 사용의 예1.6.1 기본 smilText

Page 14: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 14

<smil xmlns="http://www.w3.org/ns/SMIL" version="3.0" baseProfile="Language"><head>

<layout><root-layout height="240" width="320"/><region id="label" height="48px" width="288px" left="16px" top="48px"/>

</layout></head><body>

<par><smilText dur="5s" region="label" textColor="red" textFontWeight="bold" textFont

Size="italic" textFontFamily="palatino, garamond, serif"> The story of my dog William.</smilText>

</par>

</body></smil>

Page 15: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 15

1.6.2 텍스트에 명시적 타이밍 추가<smil xmlns="http://www.w3.org/ns/SMIL" version="3.0" baseProfile="Language">

<head><layout>

<root-layout height="240" width="320"/><region id="label" height="48px" width="288px" left="16px" top

="48px"/></layout>

</head><body>

<par><smilText dur="5s" region="label"> The story of my dog William, <tev begin="1.5s"/> who was not only a beautiful animal <tev begin="3s"/> but also one of my best friends. <clear begin="4.5s"/></smilText>

</par>

</body></smil>

Page 16: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 16

1.6.3 텍스트 모션 추가<smil xmlns="http://www.w3.org/ns/SMIL" version="3.0" baseProfile="Language">

<head><layout>

<root-layout height="50" width="500"/><region xml:id="crawlText" left="0" top="0" width="100%" height

="100%" textMode="crawl"/></layout>

</head><body>

<par><smilText region="crawlText" dur="11s"> The story of my dog William, who was not only a beautiful animal but also one of my best friends.</smilText>

</par>

</body></smil>

Page 17: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 17

1.6.4 스타일 재사용<head>

<layout><root-layout width="320" height="240"/><region id="label" height="48px" width="288px" left="16px" top

="48px"/></layout><textStyling>

<testStyle id="headlines" textColor="blue" textBackgroundColor="orange" textAlign="center" textFontFamily="bold" textFontSize="large" textFontWeight="bold"/>

</textStyling></head><body>

<par><smilText region="label" begin="5s" dur="5s" textStyle="headline

s"> 행복은 마음 먹기에 달려 있어 !!!</smilText>

</par></body>

</smil>

Page 18: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 18

Page 19: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 19

1.6.5 응용<smil xmlns="http://www.w3.org/ns/SMIL" version="3.0" baseProfile="Language">

<head><layout>

<root-layout width="320" height="400"/><region id="words" height="335px" width="255px" left="30px" top

="30px"/></layout>

</head><body>

<par> <smilText region="words"> <p textFontSize="large" textFontWeight="bold" textAlign="center"> 거위의 꿈 <br/><br/></p> <tev xml:id="TS01" next="2s"/> 난 난 꿈이 있었죠 <br/> 버려지고 찢겨 남루하여도 <br/> 내 가슴 깊숙히 보물과 같이 간직했던 꿈 <br/><br/> <tev xml:id="TS02" next="5s"/> <p textColor="red" textFontStyle="italic"> 혹 때론 누군가가 뜻 모를 비웃음 <br/> 내 등뒤에 흘릴때도 <br/> 난 참아야 했죠 참을 수 있었죠 <br/><br/></p> <tev xml:id="TS03" next="7s"/> <div textColor="green" textFontStyle="Oblique"> 그 날을 위해 늘 걱정하듯 말하죠 <br/> 헛된 꿈은 독이라고 세상은 끝이 정해진 책처럼 <br/> 이미 돌이킬 수 없는 현실이라고 <br/><br/> </div> <tev xml:id="TS04" next="7s"/> <p textColor="blue">

그래요 난 난 꿈이 있어요 <br/> 그 꿈을 믿어요 나를 지켜봐요 <br/> 언젠가 난 그 벽을 넘고서 <br/> 저 하늘을 높이 날 수 있어요 <br/><br/></p> <clear next="10s"/> </smilText> </par>

</body></smil>

Page 20: 부록  SMIL 3.0 1. SMIL 에서 타임드 텍스트

Timed Text 20