【PPTist】基础元素介绍
一、基础元素类型
PPTist 中所有的元素都继承自 PPTElement 基础类型,包含以下几种:
- 文本元素 (PPTTextElement)
- 图片元素 (PPTImageElement)
- 形状元素 (PPTShapeElement)
- 线条元素 (PPTLineElement)
- 图表元素 (PPTChartElement)
- 表格元素 (PPTTableElement)
- LaTeX元素 (PPTLatexElement)
- 视频元素 (PPTVideoElement)
- 音频元素 (PPTAudioElement)
二、元素通用属性 (PPTBaseElement)
属性 | 类型 | 说明 |
---|
id | string | 元素ID |
left | number | 元素水平方向位置(距离画布左侧) |
top | number | 元素垂直方向位置(距离画布顶部) |
width | number | 元素宽度 |
height | number | 元素高度 |
rotate | number | 旋转角度 |
lock? | boolean | 锁定元素 |
groupId? | string | 组合ID |
link? | PPTElementLink | 超链接 |
name? | string | 元素名 |
超链接 (PPTElementLink)
属性 | 类型 | 说明 |
---|
type | ‘web’ | ‘slide’ | 链接类型(网页、幻灯片页面) |
target | string | 目标地址(网页链接、幻灯片页面ID) |
三、通用样式定义
元素阴影 (PPTElementShadow)
属性 | 类型 | 说明 |
---|
h | number | 水平偏移量 |
v | number | 垂直偏移量 |
blur | number | 模糊程度 |
color | string | 阴影颜色 |
元素边框 (PPTElementOutline)
属性 | 类型 | 说明 |
---|
style? | ‘dashed’ | ‘solid’ | 边框样式(实线或虚线) |
width? | number | 边框宽度 |
color? | string | 边框颜色 |
四、具体元素定义
1. 文本元素 (PPTTextElement)
属性 | 类型 | 说明 |
---|
type | ‘text’ | 元素类型 |
content | string | 文本内容(HTML字符串) |
defaultFontName | string | 默认字体 |
defaultColor | string | 默认颜色 |
outline? | PPTElementOutline | 边框 |
fill? | string | 填充色 |
lineHeight? | number | 行高(倍) |
wordSpace? | number | 字间距 |
opacity? | number | 不透明度 |
shadow? | PPTElementShadow | 阴影 |
paragraphSpace? | number | 段间距 |
vertical? | boolean | 竖向文本 |
2. 图片元素 (PPTImageElement)
属性 | 类型 | 说明 |
---|
type | ‘image’ | 元素类型 |
src | string | 图片地址 |
fixedRatio | boolean | 固定图片宽高比例 |
outline? | PPTElementOutline | 边框 |
filters? | ImageElementFilters | 图片滤镜 |
clip? | ImageElementClip | 裁剪信息 |
flipH? | boolean | 水平翻转 |
flipV? | boolean | 垂直翻转 |
shadow? | PPTElementShadow | 阴影 |
colorMask? | string | 颜色蒙版 |
3. 形状元素 (PPTShapeElement)
属性 | 类型 | 说明 |
---|
type | ‘shape’ | 元素类型 |
viewBox | [number, number] | SVG的viewBox属性 |
path | string | 形状路径 |
fixedRatio | boolean | 固定形状宽高比例 |
fill | string | 填充色 |
gradient? | ShapeGradient | 渐变 |
outline? | PPTElementOutline | 边框 |
opacity? | number | 不透明度 |
flipH? | boolean | 水平翻转 |
flipV? | boolean | 垂直翻转 |
shadow? | PPTElementShadow | 阴影 |
special? | boolean | 特殊形状标记 |
text? | ShapeText | 形状内文本 |
pathFormula? | ShapePathFormulasKeys | 形状路径计算公式 |
keypoints? | number[] | 关键点位置百分比 |
4. 线条元素 (PPTLineElement)
属性 | 类型 | 说明 |
---|
type | ‘line’ | 元素类型 |
start | [number, number] | 起点位置 |
end | [number, number] | 终点位置 |
style | string | 线条样式 |
color | string | 线条颜色 |
points | [LinePoint, LinePoint] | 端点样式 |
shadow? | PPTElementShadow | 阴影 |
broken? | [number, number] | 折线控制点位置 |
broken2? | [number, number] | 双折线控制点位置 |
curve? | [number, number] | 二次曲线控制点位置 |
cubic? | [[number, number], [number, number]] | 三次曲线控制点位置 |
5. 图表元素 (PPTChartElement)
属性 | 类型 | 说明 |
---|
type | ‘chart’ | 元素类型 |
fill? | string | 填充色 |
chartType | ChartType | 图表基础类型 |
data | ChartData | 图表数据 |
options? | ChartOptions | 图表配置项 |
outline? | PPTElementOutline | 边框 |
themeColor | string[] | 主题色 |
gridColor? | string | 网格&坐标颜色 |
legend? | ‘’ | ‘top’ | ‘bottom’ | 图例/位置 |
6. 表格元素 (PPTTableElement)
属性 | 类型 | 说明 |
---|
type | ‘table’ | 元素类型 |
outline | PPTElementOutline | 边框 |
theme? | TableTheme | 主题 |
colWidths | number[] | 列宽数组 |
cellMinHeight | number | 单元格最小高度 |
data | TableCell[][] | 表格数据 |
7. LaTeX元素 (PPTLatexElement)
属性 | 类型 | 说明 |
---|
type | ‘latex’ | 元素类型 |
latex | string | latex代码 |
path | string | svg path |
color | string | 颜色 |
strokeWidth | number | 路径宽度 |
viewBox | [number, number] | SVG的viewBox属性 |
fixedRatio | boolean | 固定形状宽高比例 |
8. 视频元素 (PPTVideoElement)
属性 | 类型 | 说明 |
---|
type | ‘video’ | 元素类型 |
src | string | 视频地址 |
autoplay | boolean | 自动播放 |
poster? | string | 预览封面 |
ext? | string | 视频后缀 |
9. 音频元素 (PPTAudioElement)
属性 | 类型 | 说明 |
---|
type | ‘audio’ | 元素类型 |
fixedRatio | boolean | 固定图标宽高比例 |
color | string | 图标颜色 |
loop | boolean | 循环播放 |
autoplay | boolean | 自动播放 |
src | string | 音频地址 |
ext? | string | 音频后缀 |
五、动画定义
元素动画 (PPTAnimation)
属性 | 类型 | 说明 |
---|
id | string | 动画id |
elId | string | 元素ID |
effect | string | 动画效果 |
type | AnimationType | 动画类型(入场、退场、强调) |
duration | number | 动画持续时间 |
trigger | AnimationTrigger | 动画触发方式 |
六、幻灯片页面定义
幻灯片页面 (Slide)
属性 | 类型 | 说明 |
---|
id | string | 页面ID |
elements | PPTElement[] | 元素集合 |
notes? | Note[] | 批注 |
remark? | string | 备注 |
background? | SlideBackground | 页面背景 |
animations? | PPTAnimation[] | 元素动画集合 |
turningMode? | TurningMode | 翻页方式 |
sectionTag? | SectionTag | 章节标记 |
幻灯片主题 (SlideTheme)
属性 | 类型 | 说明 |
---|
backgroundColor | string | 页面背景颜色 |
themeColor | string | 主题色 |
fontColor | string | 字体颜色 |
fontName | string | 字体 |
outline | PPTElementOutline | 边框 |
shadow | PPTElementShadow | 阴影 |
原文地址:https://blog.csdn.net/weixin_45855469/article/details/144284541
免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!