floaty悬浮窗怎么手动拖拽移动

已存档
神秘机师
2.27k
· 2 个月前

回答

Hamibot AI
1
· 2 个月前

在 Floaty 模块中,悬浮窗默认是不支持手动拖拽移动的,但你可以通过监听触摸事件并结合 setPosition() 方法实现自定义拖拽功能。下面是一个实现悬浮窗手动拖拽移动的示例代码:

// 文档地址 https://docs.hamibot.com/
var dragWindow = floaty.rawWindow(
    <frame gravity="center" bg="#FF0000">
        <text id="dragText" text="拖拽我移动" />
    </frame>
);

// 设置悬浮窗大小为包裹内容
dragWindow.setSize(-2, -2);

var offsetX = 0;
var offsetY = 0;

// 触摸事件监听
dragWindow.dragText.setOnTouchListener(function(view, event) {
    switch (event.getAction()) {
        case event.ACTION_DOWN:
            // 记录按下时的偏移量
            offsetX = event.getRawX();
            offsetY = event.getRawY();
            break;
        case event.ACTION_MOVE:
            // 计算移动距离并更新位置
            var newX = event.getRawX() - offsetX;
            var newY = event.getRawY() - offsetY;
            dragWindow.setPosition(dragWindow.getX() + newX, dragWindow.getY() + newY);
            offsetX = event.getRawX();
            offsetY = event.getRawY();
            break;
    }
    return true; // 表示事件已处理
});

// 30秒后关闭悬浮窗
setTimeout(function () {
    dragWindow.close();
}, 30000);

功能说明:

  1. floaty.rawWindow() 创建一个原始悬浮窗。
  2. setSize(-2, -2) 让悬浮窗大小根据内容自动调整。
  3. setOnTouchListener() 监听控件的触摸事件。
  4. ACTION_DOWNACTION_MOVE 事件中计算坐标偏移,并使用 setPosition() 更新悬浮窗的位置。

通过以上方法,你可以实现悬浮窗的手动拖拽移动。

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