返回提示词

Motion Prompt #050|抽屉面板 · Drawer (Off-canvas)(中文译文)

从屏幕侧边滑出的面板;中文译文,效果未实测。

发布于 更新于 浏览 0

来源:import:liubai_versions_20261104 · https://github.com/Shanvision-star/liubai-prompt-library/blob/25f0137e36a8fae46aebace86b18cdfeff624a99/bundled-library/entries/PRM-0292/translation-zh.md · 授权:MIT License Copyright (c) 2026 Shohei Ohtaki Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

使用示例

提示词正文

请使用“Drawer (Off-canvas)”(ドロワー),它是“UI component names”中的一个名称。
Motion Prompt #050

定义:菜单面板从屏幕侧边滑入
示例展示:点击“菜单”后,高面板从左侧滑入;点击外部后滑回。
规格:
- 卡片为542×191,循环4.5 s。光标在1.0 s点击左上角110×34的“菜单”按钮。
- 展开量a在1.0–1.38 s内按easeOutCubic从0→1。整卡rgba(18,20,28)遮罩的不透明度为0.36·a。
- 白色面板宽210、高度等于卡片高度;x = −210 + 210·a,因此从左边缘滑入。阴影模糊22,alpha为0.25。
- 顶部为半径14的头像和姓名,下面四行菜单间隔32 px;第一行以浅蓝色横条表示选中。
- 关闭:光标在3.3 s点击面板外(420,120),a乘以(1 − 在3.3–3.65 s运行的easeInOutCubic),面板滑回。
何时使用:将导航或筛选器隐藏在屏幕外,按需展开,尤其适合移动端。

参考实现(Canvas 2D,画面仅由时间决定的函数):https://showheyohtaki.github.io/motion-prompt/api/v1/en/e/050.txt
共享辅助代码:https://showheyohtaki.github.io/motion-prompt/api/v1/kit/ui.js
请保持参考实现的形状、时间安排和缓动数值不变,只调整文字、颜色和素材,以适配我正在制作的项目。

使用示例

示例输入

请实现“抽屉面板 · Drawer (Off-canvas)”:从屏幕侧边滑出的面板;中文译文,效果未实测。

示意结果

下方是来源作者提供的静态画面和可播放动效参考,并非本站对该提示词调用模型生成的结果。

提示词仅供参考,请结合实际场景调整,并核实 AI 生成结果。