# Search Reveal: 搜索栏动画

辅助圆扩展成搜索框，输入您的文字，然后显现一块抽象图形面板。 视频模板，可复制代码供 Claude 使用，或在 Subclip 中编辑。

Canonical URL: https://www.subclip.app/zh/motion-graphics-templates/remotion/search-reveal

Preview video: https://subclipweb.subclip.app/motion-graphics-templates/v1/previews/motion-template-remotion-remocn-search-reveal.mp4?v=38640e261d

细细的辅助圆扩展并吸附成搜索栏，文字自动输入，随后一块多彩的图形面板在其后方展开。

- 框架: Remotion
- 类别: 界面
- 时长: 4 秒
- 纵横比: 16:9 横屏
- 代码: 获取代码（免费登录）：https://www.subclip.app/zh/motion-graphics-templates/remotion/search-reveal

动画从淡紫色背景上逐渐扩大的细灰色辅助圆环开始，就像设计师在构建图形。圆环吸附成一个白色圆角搜索框，文字逐个字符自动输入，随后搜索框后方展开一块带有青柠色图形的紫色面板。整个序列不到四秒。

您可以设置输入的文字、搜索框宽度、字体大小和输入速度，显示或隐藏面板和辅助圆，并修改所有颜色：文字、搜索框、圆环、面板、强调色和背景。适用于产品或品牌名称揭晓、搜索功能演示或 AI 工具开场。

## 适用场景

- 品牌名称揭晓
- 搜索功能演示
- AI 工具开场
- 应用发布开场

## 可修改的内容

- `speed`: 播放速度 (数字)
- `text`: 输入的文字 (文本)
- `fieldWidth`: 搜索框宽度 (数字)
- `fontSize`: 字体大小 (数字)
- `framesPerCharacter`: 输入速度（每字符帧数） (数字)
- `showPanel`: 显示图形面板 (开 / 关)
- `showGuides`: 显示辅助圆 (开 / 关)
- `color`: 文字颜色 (颜色)
- `fieldColor`: 搜索框颜色 (颜色)
- `ringColor`: 辅助圆颜色 (颜色)
- `panelColor`: 面板颜色 (颜色)
- `accentColor`: 强调色 (颜色)
- `backgroundColor`: 背景颜色 (颜色)
- `reducedMotion`: 减少动态效果 (开 / 关)
- `stageBackground`: 场景周围的背景 (文本)

## 如何使用此模板

1. 下载 Mac 或 Windows 的 Subclip。此页面上的每个模板均已预先安装。
2. 打开"模板"面板，选择 Search Reveal 并将其放在时间线上。
3. 更改图层设置中的文本、颜色和时间，或要求 AI 代理为您编辑。
4. 导出视频，或下载代码以在您自己的项目中使用该模板。

基于 remocn 的 Search Reveal 制作: https://remocn.dev