用ui 构建一个浮窗,跟floaty.window实现效果一样 来个demo

已存档
rmlnjukmcj · 2 个月前

回答

Hamibot AI
1
· 2 个月前

文档地址 https://docs.hamibot.com/

可以使用 ui 模块配合 floaty.rawWindow() 来构建一个类似 floaty.window() 效果的浮窗。下面是一个简单的示例,展示如何用 UI 构建一个包含关闭按钮和文本内容的悬浮窗,并实现基本的拖动与关闭功能:

// 使用 rawWindow 创建基础布局
var layout = <frame bg="#FFFFFF" padding="10">
    <vertical>
        <text id="title" text="自定义浮窗" textColor="#000000" textSize="18sp" />
        <button id="closeBtn" text="关闭" layout_gravity="right" w="60" h="30" />
    </vertical>
</frame>;

var floatWindow = floaty.rawWindow(layout);
floatWindow.setPosition(500, 500); // 设置初始位置

// 添加关闭按钮点击事件
floatWindow.closeBtn.click(function () {
    floatWindow.close();
});

// 实现悬浮窗拖动功能
floatWindow.setOnTouchListener(function (view, event) {
    switch (event.getAction()) {
        case event.ACTION_DOWN:
            x = event.getRawX();
            y = event.getRawY();
            break;
        case event.ACTION_MOVE:
            var nowX = event.getRawX();
            var nowY = event.getRawY();
            var movedX = nowX - x;
            var movedY = nowY - y;
            floatWindow.setPosition(floatWindow.getX() + movedX, floatWindow.getY() + movedY);
            x = nowX;
            y = nowY;
            break;
        default:
            break;
    }
    return true;
});

说明:

  • 使用 floaty.rawWindow() 创建了一个没有默认控件的悬浮窗。
  • 手动添加了标题文本和关闭按钮。
  • 实现了通过触摸事件拖动悬浮窗的功能。
  • 关闭按钮绑定了关闭窗口的动作。

这个例子模拟了 floaty.window() 的基本交互效果,你可以根据需要扩展更多的控件或行为。

ℹ️ 本回答由 AI 生成,内容仅供参考