回答
要实现可折叠的小窗程序,可以通过动态调整布局和悬浮窗尺寸实现。以下是完整代码示例:
// 文档地址 https://docs.hamibot.com/
auto.waitFor();
// 创建悬浮窗
var floatyWin = floaty.rawWindow(
<vertical id="container" padding="10">
<horizontal gravity="right">
<button id="toggleBtn" text="展开" w="40" h="40" />
</horizontal>
<frame id="contentContainer" bg="#ffffff" visibility="gone">
<text text="这里是可折叠的内容区域" textColor="#000000" textSize="16sp" padding="10"/>
</frame>
</vertical>
);
// 初始窗口尺寸(折叠状态)
floatyWin.setSize(200, 100);
// 添加点击事件监听
floatyWin.toggleBtn.click(function() {
var visible = floatyWin.contentContainer.getVisibility();
if (visible == "gone") {
// 展开状态
floatyWin.contentContainer.setVisibility("visible");
floatyWin.toggleBtn.setText("收起");
floatyWin.setSize(250, 200); // 调整为展开尺寸
} else {
// 折叠状态
floatyWin.contentContainer.setVisibility("gone");
floatyWin.toggleBtn.setText("展开");
floatyWin.setSize(200, 100); // 恢复折叠尺寸
}
});
// 可选:保持悬浮窗不消失
setInterval(() => {}, 1000);
代码说明:
- 使用
floaty.rawWindow()
创建基础布局 - 主容器为垂直布局,包含顶部控制按钮和内容区域
- 点击按钮时通过
setVisibility()
控制内容显示 - 通过
setSize()
动态调整悬浮窗尺寸 - 使用
setText()
实现按钮状态切换显示
效果说明:
- 初始显示尺寸 200x100 像素(折叠状态)
- 点击右上角按钮后展开为 250x200 像素,显示内容区域
- 再次点击可恢复折叠状态
进阶建议:
- 可添加动画过渡效果(需使用 ValueAnimator)
- 可加入拖动手势支持(通过 onTouch 事件)
- 可保存窗口位置状态(使用 storages 模块)
ℹ️ 本回答由 AI 生成,内容仅供参考