触发方式
输入消息后按 Enter 或点箭头,本地消息与彩色光带同时出现。四个颜色控制同一条光带,响应时长控制发送过渡;手动发送使用原站提示音,可关闭;自动演示保持静音,提示音保持原速。回复文字与延迟也可调,延迟单位为毫秒(1000 为 1 秒);仅本地演示。修改设置取消旧的待发回复,下次发送使用当前内容。目录悬停、聚焦和手机 Preview 共用演示,标题进入编辑器。
参数与内容
输入提示: "Send Message";输入区宽度: 512;输入文字大小: 16;输入区圆角: 24;画布背景: "#f1f1f1";输入区底色: "#ffffff";按钮底色: "#f5f4f3";文字颜色: "#000000";光带粉色: "#fc2ba3";光带橙色: "#fc6d35";光带黄色: "#f9c83d";光带蓝色: "#144ec5";手动发送时播放提示音: true;本地演示回复: "Lock in vro 😵";演示回复延迟: 1000;演示输入内容: "A little more color"
起点与终点
初始画面使用以上保存内容。逻辑画布 768 × 500,整体缩放 1,位置偏移 (0, 0)。
时序
响应基准 500 ms,演示延迟 0 ms。观察倍速仅用于预览。
进入与退出
紧凑消息输入在发送时展开彩色光带、旋转箭头,并堆叠本地消息。 演示停止后保留组件的当前交互状态。
重复操作与打断
离开目录且失焦、滚出可视区和切换后台会停止演示。实际输入、当前选择与播放进度不覆盖保存的默认值。
参数与导出
控件、预览、JSON、Motion 适配器、复刻工程和 HTML 导出共用同一设置对象与渲染器。目录卡片始终显示项目默认预设。
减少动态效果
不自动演示,过渡直接呈现目标状态;保留真实输入、按钮、选择和键盘操作。
默认配置
这些数值来自当前维护的默认配置;编辑器草稿和调整后的导出可以不同。
{
"schemaVersion": 2,
"recipeId": "skiper-82",
"durationMs": 500,
"delayMs": 0,
"easing": [
0.22,
1,
0.36,
1
],
"offsetX": 0,
"offsetY": 0,
"scale": 1,
"loop": false,
"interruption": "retarget",
"tracks": [],
"skiper": {
"placeholder": "Send Message",
"inputWidth": 512,
"fontSize": 16,
"cornerRadius": 24,
"background": "#f1f1f1",
"inputColor": "#ffffff",
"buttonColor": "#f5f4f3",
"textColor": "#000000",
"pink": "#fc2ba3",
"orange": "#fc6d35",
"yellow": "#f9c83d",
"blue": "#144ec5",
"soundEnabled": true,
"replyText": "Lock in vro 😵",
"replyDelay": 1000,
"demoText": "A little more color"
}
}参考来源与复用
此效果参考 Skiper UI;可用的公开源码已经核对,Pro 项目依据公开演示独立实现。可在编辑器导出当前配置与可运行渲染器,复用时保留 Skiper UI 署名及素材来源。
用于自己的项目
进入编辑器运行真实预览并比较调整;本说明页不另造一份近似演示。把导出用于自己的项目后,重新检查内容、输入、焦点与布局。
目录来源标注:Skiper UI. 第三方示例保留自己的许可与署名;公开仓库包含全部当前动效的渲染源码;完整编辑器由独立工程维护。