| 소품 | 유형 | 필수 | 예시 | 값 범위 | 설명 |
|---|---|---|---|---|---|
| content | string | true | - | - | 요소에 의해 표시되는 텍스트 콘텐츠. |
| textStyle | object | true | - | - | 폰트, 색상, 그림자 및 스트로크 설정을 포함한 텍스트 콘텐츠의 기본 스타일 옵션. 이는 모든 텍스트의 기본 스타일로 사용됩니다. |
| ranges | array | false | - | - | 특정 텍스트 콘텐츠의 부분에 서로 다른 스타일을 적용할 수 있는 리치 텍스트 서식 범위. 각 범위는 시작 위치, 종료 위치 및 스타일 재정의를 정의합니다. |
| bgColor | string | false | - | - | 텍스트 요소의 배경 색상, 헥스 형식. |
| bgAlpha | number | false | - | 0 - 1 | 텍스트 배경의 투명도 수준. 1은 완전 불투명을 나타내고, 0은 완전 투명함을 나타냅니다. |
| bgRadius | number | false | - | - | 텍스트 배경의 모서리 반경, 픽셀 단위. |
리치 텍스트 범위는 텍스트 콘텐츠의 특정 부분에 서로 다른 스타일을 적용할 수 있게 해줍니다. 각 범위 객체는 다음을 포함합니다:
| 소품 | 유형 | 필수 | 예시 | 값 범위 | 설명 |
|---|---|---|---|---|---|
| start | number | true | - | >= 0 | 이 스타일이 적용되어야 하는 시작 문자 위치(포함). |
| end | number | true | - | > start | 이 스타일이 끝나는 종료 문자 위치(제외). |
| style | object | true | - | - | 이 텍스트 범위에 적용할 스타일 재정의. 지정되지 않은 속성은 기본 textStyle에서 상속됩니다. |
textStyle 객체는 모든 텍스트 콘텐츠에 적용되는 기본 스타일을 정의합니다. 리치 텍스트 범위를 사용할 때, 범위에 지정되지 않은 스타일 속성은 이러한 기본 값을 상속받습니다.
| 소품 | 유형 | 필수 | 예시 | 값 범위 | 설명 |
|---|---|---|---|---|---|
| fill | string | true | - | - | 텍스트 색상, 헥스 형식. |
| fontSize | number | true | - | > 0 | 텍스트의 폰트 크기, 픽셀 단위. |
| fontFamily | string | true | - | Arial, Helvetica, Times New Roman, Georgia, Verdana, Tahoma, Trebuchet MS, Impact, Comic Sans MS, Courier New | 텍스트에 사용되는 폰트 패밀리. |
| align | string | true | - | left, center, right, justify | 텍스트 콘텐츠의 정렬. |
| lineHeight | number | true | - | >= 0 | 텍스트 콘텐츠의 줄 높이, 픽셀 단위. |
| letterSpacing | number | true | - | - | 텍스트 콘텐츠에서 문자 사이의 간격, 픽셀 단위. |
| wordSpacing | number | false | - | - | 텍스트 콘텐츠에서 단어 사이의 간격, 픽셀 단위. |
| fontWeight | string | false | - | normal, bold, 100, 200, 300, 400, 500, 600, 700, 800, 900 | 폰트의 두께(무게). |
| fontStyle | string | false | - | normal, italic, oblique | 폰트의 스타일. |
| textShadow | string | false | - | - | 추가 그림자 효과를 위한 CSS text-shadow 속성 값. |
| underline | boolean | false | - | - | 텍스트 콘텐츠에 밑줄 장식이 있는지 여부를 나타냅니다. |
| strikethrough | boolean | false | - | - | 텍스트 콘텐츠에 가로줄 장식이 있는지 여부를 나타냅니다. |
| isBold | boolean | true | - | - | 텍스트 콘텐츠가 굵게 표시되는지 여부를 나타냅니다. |
| isItalic | boolean | true | - | - | 텍스트 콘텐츠가 이탤릭체로 표시되는지 여부를 나타냅니다. |
| shadowEnabled | boolean | true | - | - | 텍스트 콘텐츠에 shadow-sm 효과가 적용되었는지 여부를 나타냅니다. |
| shadowColor | string | true | - | - | shadow-sm 효과의 색상, 헥스 형식. |
| shadowBlur | number | true | - | >= 0 | shadow-sm 효과의 blur-sm 반경, 픽셀 단위. |
| shadowAlpha | number | true | - | 0 - 1 | shadow-sm 효과의 투명도 수준. 1은 완전 불투명을 나타내고, 0은 완전 투명함을 나타냅니다. |
| shadowAngle | number | true | - | >= 0 | shadow-sm 효과의 각도, 라디안. |
| shadowDistance | number | true | - | >= 0 | 텍스트 콘텐츠와 shadow-sm 효과 사이의 거리, 픽셀 단위. |
| stroke | string | true | - | - | 스트로크 효과의 색상, 헥스 형식. |
| strokeWidth | number | true | - | >= 0 | 스트로크 효과의 너비, 픽셀 단위. |
{
"id": "556e5b07-9f6d-49fa-804a-a1ac523cdd82",
"type": "Text",
"start": 0,
"duration": 5,
"trackIndex": 0,
"x": 166.1738354439909,
"y": -59.92190375317854,
"blendMode": "normal",
"anchorX": 0,
"anchorY": 0,
"rotation": 0,
"scaleX": 2.8948529361581095,
"scaleY": 2.8948529361581095,
"alpha": 1,
"skewX": 0,
"skewY": 0,
"keyframes": [],
"content": "Add Heading",
"textStyle": {
"fill": "#FFFFFF",
"fontSize": 36,
"fontFamily": "Arial",
"align": "center",
"lineHeight": 0,
"letterSpacing": 0,
"isBold": true,
"isItalic": false,
"shadowEnabled": true,
"shadowColor": "#000000",
"shadowBlur": 4,
"shadowAlpha": 1,
"shadowAngle": 0.5235987755982988,
"shadowDistance": 6,
"stroke": "#000000",
"strokeWidth": 3
},
"bgColor": "#f2c9ff",
"bgAlpha": 0,
"bgRadius": 10
}