You need to enable JavaScript to run this app.
导航
智能视频创作SDK
  • 文档首页
    • /智能视频创作SDK/1.7.0/SDK接入指引/双端共用配置/各模块UI标注/预览编辑客户可更换UI范围
预览编辑客户可更换UI范围
最近更新时间：2025.04.10 12:04:17首次发布时间：2025.04.08 17:46:50
我的收藏
有用
有用
无用
无用

主界面

关闭按钮

alt

序号描述可修改项修改方式

1

关闭页面按钮

按钮icon

  • 替换同名icon

    • eo_previeweditor_back

    • 建议尺寸（像素）：72 * 72

下一步按钮

alt

序号描述可修改项修改方式

1

页面背景色

颜色

  • 修改对应文案颜色
    • 色卡Key：BGPrimary

2

下一步按钮文案

文案
颜色

  • 修改对应的文案

    • 文案Key：eo_previeweditor_next

  • 修改对应的色卡

    • 色卡Key：TextPrimary1

3

下一步按钮背景色

颜色

  • 修改对应的色卡
    • 色卡Key：Primary

4

下一步按钮图标

按钮icon

  • 替换同名icon

    • eo_previeweditor_next_icon

    • 建议尺寸（像素）：60 * 60

添加音乐按钮

alt

序号描述可修改项修改方式

1

音乐按钮icon

按钮icon

  • 替换同名icon

    • eo_base_music_icon

    • 建议尺寸（像素）：72* 72

2

添加音乐文案

文案
颜色

  • 修改对应的文案

    • 文案Key：eo_base_addsound

  • 修改对应的色卡

    • 色卡Key：TextPrimary

3

按钮背景色

颜色

  • 修改对应的色卡
    • 色卡Key：BGInverse2

4

删除按钮icon

按钮icon

  • 替换同名icon

    • eo_base_music_remove

    • 建议尺寸（像素）：43 * 43

5

分割线

背景颜色

  • 修改对应颜色
    • 色卡Key：ConstLineInverse2

侧边栏（调节ICON/文案）

alt

序号描述可修改项修改方式

1

剪辑按钮

按钮icon
文案
文字颜色

  • 替换同名icon

    • eo_previeweditor_edit

    • 建议尺寸（像素）：96 * 96

  • 修改对应的文案

    • 文案Key：eo_previeweditor_edit

  • 修改对应的色卡

    • 色卡Key：ConstTextInverse1

2

文本按钮

按钮icon
文案
文字颜色

  • 替换同名icon

    • eo_previeweditor_text

    • 建议尺寸（像素）：96 * 96

  • 修改对应的文案

    • 文案Key：eo_previeweditor_text

  • 修改对应的色卡

    • 色卡Key：ConstTextInverse1

3

信息贴纸按钮

按钮icon
文案
文字颜色

  • 替换同名icon

    • eo_previeweditor_infosticker

    • 建议尺寸（像素）：96 * 96

  • 修改对应的文案

    • 文案Key：eo_previeweditor_infosticker

  • 修改对应的色卡

    • 色卡Key：ConstTextInverse1

4

滤镜按钮

按钮icon
文案
文字颜色

  • 替换同名icon

    • eo_previeweditor_filter

    • 建议尺寸（像素）：96 * 96

  • 修改对应的文案

    • 文案Key：eo_previeweditor_filter

  • 修改对应的色卡

    • 色卡Key：ConstTextInverse1

5

特效按钮

按钮icon
文案
文字颜色

  • 替换同名icon

    • eo_previeweditor_videoeffects

    • 建议尺寸（像素）：96 * 96

  • 修改对应的文案

    • 文案Key：eo_previeweditor_videoeffect

  • 修改对应的色卡

    • 色卡Key：ConstTextInverse1

6

人脸特效按钮

按钮icon
文案
文字颜色

  • 替换同名icon

    • eo_previeweditor_effectsticker

    • 建议尺寸（像素）：96 * 96

  • 修改对应的文案

    • 文案Key：eo_previeweditor_effectsticker

  • 修改对应的色卡

    • 色卡Key：ConstTextInverse1

7

录音按钮

按钮icon
文案
文字颜色

  • 替换同名icon

    • eo_previeweditor_voice

    • 建议尺寸（像素）：96 * 96

  • 修改对应的文案

    • 文案Key：eo_previeweditor_voice

  • 修改对应的色卡

    • 色卡Key：ConstTextInverse1

7

侧边栏展开/收起按钮

按钮icon

  • 替换同名icon

    • eo_base_vertical_toolbar_more

    • 建议尺寸（像素）：72 * 72

剪辑面板：

参考轨道编辑客户可更换UI范围

文字

文字输入

文字输入-控制区

alt

序号描述可修改项修改方式

1

文字左对齐，点击可以切换对齐方式

按钮icon

  • 替换同名icon

    • eo_previeweditor_text_align_left

    • 建议尺寸（像素）：108*108

2

文字右对齐，点击可以切换对齐方式

按钮icon

  • 替换同名icon

    • eo_previeweditor_text_align_right

    • 建议尺寸（像素）：108*108

3

文字居中对齐，点击可以切换对齐方式（默认状态）

按钮icon

  • 替换同名icon

    • eo_previeweditor_text_align_center

    • 建议尺寸（像素）：108*108

4

文字样式：普通，点击可以切换文字样式（默认状态）

按钮icon

  • 替换同名icon

    • eo_previeweditor_text_normal

    • 建议尺寸（像素）：108*108

5

文字样式：描边，点击可以更改文字样式

按钮icon

  • 替换同名icon

    • eo_previeweditor_text_stroke

    • 建议尺寸（像素）：108*108

6

文字样式：背景色，点击可以更改文字样式

按钮icon

  • 替换同名icon

    • eo_previeweditor_text_bg_color

    • 建议尺寸（像素）：108*108

7

颜色选择开关，点击显示颜色选择区，隐藏字体选择区（默认状态）

按钮icon

  • 替换同名icon

    • eo_previeweditor_text_color_unselect

    • 建议尺寸（像素）：108*108

8

颜色选择开关，点击隐藏颜色选择区，显示字体选择区

按钮icon

  • 替换同名icon

    • eo_previeweditor_text_color_select

    • 建议尺寸（像素）：108*108

9

完成按钮，点击添加文字贴纸，收起文字输入面板

文案
文案颜色

  • 修改对应的文案

    • 文案Key：eo_previeweditor_done

  • 修改对应文案颜色

    • 色卡Key：ConstTextInverse1

文字输入-字体选择区

alt

序号描述可修改项修改方式

1

系统字体图标

按钮icon

  • 替换同名icon

    • eo_previeweditor_text_font_system

    • 建议尺寸（像素）：108*108

2

字体边框：未选中

颜色

  • 修改对应颜色
    • 色卡Key：ConstLineInverse2

3

字体边框：选中

颜色

  • 修改对应颜色
    • 色卡Key：ConstTextInverse1

4

素材下载组件

icon

参考上文「基础组件-素材哦下载组件」

文字输入-颜色选择区

不可修改

文字输入-输入区

alt

序号描述可修改项修改方式

1

输入光标

颜色

  • 修改对应颜色
    • 色卡Key：Primary

2

字体大小滑块

颜色

  • 修改对应颜色
    • 色卡Key：ConstTextInverse1

文字/贴纸设置气泡

alt

序号描述可修改项修改方式

1

气泡图标

icon

  • 替换同名icon

    • eo_previeweditor_sticker_bubble_ic

    • 建议尺寸（像素）：72*72

2

气泡Item：删除

文字
文字颜色

  • 修改对应的文案，文案Key

    • eo_previeweditor_text_delete

  • 修改对应文案颜色，色卡Key

    • TextPrimary

3

气泡Item：设置时长

文字
文字颜色

  • 修改对应的文案

    • 文案Key：eo_previeweditor_text_duration

  • 修改对应文案颜色

    • 色卡Key：TextPrimary

4

气泡Item：编辑

文字
文字颜色

  • 修改对应的文案

    • 文案Key：eo_previeweditor_text_edit

  • 修改对应文案颜色

    • 色卡Key：TextPrimary

5

文字/贴纸选中框

颜色

  • 修改对应文案颜色
    • 色卡Key：ConstTextInverse1

6

气泡背景

颜色

  • 修改对应颜色
    • 色卡Key：BGSecondary3

7

气泡分割线

颜色

  • 修改对应颜色
    • 色卡Key：ConstLineInverse2

文字/贴纸时间设置面板

alt

序号描述可修改项修改方式

1

文字时间面板Title

文字
文字颜色

  • 修改对应的文案，文案Key

    • eo_previeweditor_text_duration_title

  • 修改对应文案颜色，色卡Key

    • TextPrimary

2

贴纸时间面板Title

文字
文字颜色

  • 修改对应的文案，文案Key

    • eo_previeweditor_sticker_duration_title

  • 修改对应文案颜色，色卡Key

    • TextPrimary

3

时间面板播放按钮

icon

  • 替换同名icon

    • eo_base_player_play

  • 建议尺寸（像素）：60*60

4

时间面板暂停按钮

icon

  • 替换同名icon

    • eo_base_player_pause

  • 建议尺寸（像素）：60*60

5

时间面板轨道区左侧把手背景

icon

  • 替换同名icon
    • eo_previeweditor_sticker_duration_handle_left

6

时间面板轨道区左侧把手前景

icon

  • 替换同名icon
    • eo_previeweditor_sticker_duration_handle_content_left

7

时间面板轨道区右侧把手背景

icon

  • 替换同名icon
    • eo_previeweditor_sticker_duration_handle_right

8

时间面板轨道区右侧把手前景

icon

  • 替换同名icon
    • eo_previeweditor_sticker_duration_handle_content_right

9

时间面板轨道区遮罩区

边框颜色
遮罩颜色

  • 修改边框颜色

    • ConstTextInverse1

  • 修改遮罩颜色

    • AssistColorBlueMask

10

时间面板取消按钮

文字
文字颜色

  • 修改对应的文案，文案Key

    • eo_previeweditor_cancel

  • 修改对应文案颜色，色卡Key

    • ConstTextInverse1

11

时间面板保存按钮

文字
文字颜色

  • 修改对应的文案，文案Key

    • eo_previeweditor_duration_save

  • 修改对应文案颜色，色卡Key

    • ConstTextInverse1

12

时间面板底部文案

文字
文字颜色

  • 修改对应的文案，文案Key

    • eo_previeweditor_duration

  • 修改对应文案颜色，色卡Key

    • ConstTextInverse1

图片和信息贴纸

贴纸选择面板

alt

序号描述可修改项修改方式

1

贴纸面板下拉把手

背景色

  • 修改对应背景色
    • 色卡Key：ConstLineInverse

2

贴纸面板Title

文字
文字颜色

  • 修改对应的文案

    • 文案Key：eo_previeweditor_info_sticker_title

  • 修改对应文案颜色

    • 色卡Key：ConstTextInverse1

3

添加本地图片按钮

icon

  • 替换同名icon

    • eo_previeweditor_sticker_add_img

  • 建议尺寸（像素）：72*72

4

贴纸面板分割线

背景色

  • 修改对应背景色
    • 色卡Key：ConstLineInverse

5

贴纸面板背景色

背景色

  • 修改对应背景色
    • 色卡Key：BGPrimary2

相册

参考相册部分客户可更换UI范围

图片剪裁

alt

| 序号 | 描述 | 可修改项 | 修改方式 |
| :-- | :-- | :-- | :-- |
| 1 | 图片剪裁取消按钮 | 文字 | - 修改对应的文案 |\
||| 文字颜色 | 	- 文案Key：eo\_trackeditor\_cancel |\
|||| 		 |\
|||| - 修改对应文案颜色 |\
|||| 	- 色卡Key：TextPrimary |
| 2 | 图片剪裁确认按钮 | 文字 | - 修改对应的文案 |\
||| 文字颜色 | 	- 文案Key：eo\_trackeditor\_done |\
|||| 		 |\
|||| - 修改对应文案颜色 |\
|||| 	- 色卡Key：TextPrimary |

滤镜

alt

序号描述可修改项修改方式

1

滤镜强度条颜色

颜色

  • 修改对应的色卡
    • 色卡Key：

      • 前景色 Primary

      • 背景色 BGInput3

2

滤镜面板文案

文案
文字颜色

  • 修改对应的文案

    • 文案Key：eo_previeweditor_filter_title

  • 修改对应文字颜色

    • 色卡Key：TextPrimary

3

空白项icon

按钮icon
文案

  • 替换同名icon

    • eo_base_item_none

    • 建议尺寸（像素）：84 * 84

  • 修改对应的文案

    • 文案Key：eo_base_item_none

4

滤镜项选中状态框颜色

颜色

  • 修改对应的色卡
    • 色卡Key：Primary

5

滤镜强度条当前设置值

按钮icon
颜色

  • 替换同名icon

    • eo_base_panel_slider_thumb

    • iOS 建议尺寸（像素）：108 * 108

    • Android 建议尺寸（像素）：60 * 60

  • 修改对应的色卡

    • 色卡Key：
      • 强度值：TextPrimary

6

滤镜tab面板背景颜色

颜色

  • 修改对应的色卡
    • 色卡Key：BGSecondary4

7

滤镜面板背景颜色

颜色

  • 修改对应的色卡
    • 色卡Key：BGPrimary2

特效

alt

序号描述可修改项修改方式

1

取消按钮

文案
颜色

  • 修改对应的文案

    • 文案Key：eo_previeweditor_cancel

  • 修改对应的色卡

    • 色卡Key：ConstTextInverse1

2

undo按钮

按钮icon

  • 替换同名icon

    • 可用状态：

      • eo_previeweditor_effect_panel_pre_action_white

      • 建议尺寸（像素）：84 * 84

    • 不可用状态：

      • eo_previeweditor_effect_panel_pre_action_gray

      • 建议尺寸（像素）：84 * 84

3

redo按钮

按钮icon

  • 替换同名icon

    • 可用状态：

      • eo_previeweditor_effect_panel_next_action_white

      • 建议尺寸（像素）：84 * 84

    • 不可用状态：

      • eo_previeweditor_effect_panel_next_action_gray

      • 建议尺寸（像素）：84 * 84

4

完成按钮

文案
颜色

  • 修改对应的文案

    • 文案Key：ConstTextInverse1

  • 修改对应的色卡

    • 色卡Key：eo_previeweditor_done

5

滑杆-IOS

滑杆icon

  • 替换同名icon

    • eo_previeweditor_effect_slider_indicator

    • 建议尺寸（像素）：21 * 121

5

滑杆-Android

滑杆icon

  • 替换同名drawable.xml

    • eo_previeweditor_effect_slider_indicator

    • 建议尺寸-Android（dp）：3 * 36

6

交互提示文案

文案
颜色

  • 修改对应的文案

    • 文案Key：eo_previeweditor_press_and_hold

  • 修改对应的色卡

    • 色卡Key：TextTertiary

7

特效名称颜色

颜色

  • 修改对应的色卡
    • 色卡Key：ConstTextInverse1

8

应用到全部按钮icon

按钮icon

  • 替换同名icon

    • eo_previeweditor_effect_panel_apply_to_all

    • 建议尺寸（像素）：48 * 48

9

应用到全部按钮文案

文案
颜色

  • 修改对应的文案

    • 文案Key：eo_previeweditor_apply_to_all

  • 修改对应的色卡

    • 色卡Key：TextPrimary

10

面板背景色

颜色

  • 修改对应的色卡
    • 色卡Key：BGPrimary2

人脸特效

alt

序号描述可修改项修改方式

1

人脸特效取消选中icon

按钮icon

  • 替换同名icon

    • eo_base_unselect

    • 建议尺寸（像素）：72 * 72

2

人脸特效面板tab选中项颜色

颜色

  • 修改对应的色卡
    • 色卡Key：

      • 选中态 TextPrimary

      • 未选中 TextTertiary

3

人脸特效项选中状态框颜色

颜色

  • 修改对应的色卡
    • 色卡Key：TextPrimary

4

人脸特效tab面板背景颜色

颜色

  • 修改对应的色卡
    • 色卡Key：BGSecondary4

5

人脸特效面板背景颜色

颜色

  • 修改对应的色卡
    • 色卡Key：BGPrimary2

6

人脸特效tab下边indicator颜色

颜色

  • 修改对应的色卡
    • 色卡Key：TextPrimary

录音

音色面板

alt

序号描述可修改项修改方式

1

播放滑杆进度颜色

颜色

  • 修改对应的色卡
    • 色卡Key：Primary

2

播放滑块按钮

滑块icon

  • 替换同名icon

    • eo_previeweditor_voice_progress_pointer

    • 建议尺寸（像素）：24 * 24

3

播放滑杆背景

颜色

  • 修改对应的色卡
    • 色卡Key：BGInput3

4

交互提示文案

颜色

  • 修改对应的色卡
    • 色卡Key：ConstTextInverse4

5

空白项icon

按钮icon
文案

  • 修改背景色对应的色卡

    • 色卡Key：ConstBGContainer_Dark

  • 替换同名icon

    • eo_base_item_none

    • 建议尺寸（像素）：84 * 84

  • 修改对应的文案

    • 文案Key：eo_base_item_none

6

音色选中项边框

颜色

  • 修改对应的色卡
    • 色卡Key：Primary

7

音色项标题

颜色

  • 修改卡片项标题对应的色卡

    • 选中态：

      • 色卡Key：Primary

    • 非选中态：

      • 色卡Key：ConstTextInverse1

8

录音按钮背景

颜色

  • 修改对应的色卡
    • 色卡Key：ConstBGContainer6

9

录音icon

按钮icon

  • 替换同名icon

    • eo_previeweditor_voice_record

    • 建议尺寸（像素）：60 * 60

10

录音文字

颜色

  • 修改对应的色卡
    • 色卡Key：TextPrimary

11

音量icon

按钮icon

  • 替换同名icon

    • eo_previeweditor_voice_volume

    • 建议尺寸（像素）：60 * 60

音色面板无原声

alt

序号描述可修改项修改方式

1

无原生交互文案

颜色

  • 修改对应的色卡
    • 色卡Key：TextPrimary

2

无原生录音

颜色

  • 修改对应的色卡
    • 色卡Key：TextPrimary1

3

无原生录音icon

按钮icon

  • 替换同名icon

    • eo_previeweditor_voice_record_black

    • 建议尺寸（像素）：60 * 60

4

无原生录音按钮背景色

颜色

  • 修改对应的色卡
    • 色卡Key：Primary

录音面板

alt

序号描述可修改项修改方式

1

已录音轨道蒙层

颜色

  • 修改对应的色卡
    • 色卡Key：AssistColorPurple3

2

录音按钮（默认，置灰，录制中等）

颜色

  • 修改对应的色卡
    • 色卡Key：Primary

3

使用原生-选中态

按钮icon

  • 替换同名icon

    • eo_previeweditor_record_checkbox_checked

    • 建议尺寸（像素）：48 * 48

4

使用原生-未选中态

按钮icon

  • 替换同名icon

    • eo_previeweditor_record_checkbox_unchecked

    • 建议尺寸（像素）：48 * 48

5

删除录音按钮

按钮icon

  • 替换同名icon

    • eo_previeweditor_remove_record

    • 建议尺寸（像素）：96 * 96

6

完成按钮（原生）

颜色

  • 修改对应的色卡
    • 色卡Key：TextPrimary

音量面板

alt

序号描述可修改项修改方式

1

音量面板背景色

颜色

  • 修改对应的色卡
    • 色卡Key：BGPrimary3

2

原生/录音二级标题

颜色

  • 修改对应的色卡
    • 色卡Key：TextSecondary

3

取消/音量/保存

颜色

  • 修改对应的色卡
    • 色卡Key：ConstTextInverse1

4

音量滑块按钮

按钮icon

  • 替换同名icon

    • enable状态：

      • eo_previeweditor_volume_pointer

    • disable状态

      • eo_previeweditor_volume_pointer_gray

    • 建议尺寸（像素）：60 * 60

5

音量滑杆进度颜色

颜色

  • 修改对应的色卡

    • enable状态：

      • 色卡Key：Primary

    • disable状态：

      • 色卡Key：Primary 34%

6

音量滑杆背景色（mask）

颜色

  • 修改对应的色卡

  • enable状态：

    • 色卡Key：TextQuaternary

  • disable状态：透明色

7

音量滑杆数字颜色

  • 修改对应的色卡
    • 色卡Key：TextSecondary