electron中使用setPosition()方法设置窗口的位置

本文记录了在使用 Electron 的 BrowserWindow 模块时遇到的 setPosition() 方法问题及解决方案。作者尝试设置窗口位置时遇到了错误,原因是传入了浮点数而非正整数。通过将坐标值转换为整数,成功解决了这一问题。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

今天我在使用setPosition()方法设置窗口的位置时出现了以下错误:

 

 在electron的文档中有说明setPosition()方法:

主进程可用的模块 - BrowserWindow - 《Electron 8.2.0 官方文档中文版》 - 书栈网 · BookStack

根据文档所示,设置的坐标值需要正数,而我的是浮点数,因此需要将浮点数转为正数,如下所示:

    var configure_win_temp = remote.getCurrentWindow()
    var parent_win_temp = configure_win_temp.getParentWindow()
    console.log('Configure configure_win_temp:', configure_win_temp.getPosition())
    console.log('Configure parent_win_temp:', parent_win_temp.getPosition())
    var parent_x = parent_win_temp.getPosition()[0]
    var parent_y = parent_win_temp.getPosition()[1]
    
    //configure_win_temp.setPosition(parent_x/2, parent_y/2, false)
    // 将上面这行修改为下面这行
    // configure_win_temp.setPosition(parseInt(parent_x/2), parseInt(parent_y/2), false)

Electron 中,如果你想要创建一个可以全屏拖动但窗口内元素不受影响的窗口,你可以通过监听 `webContents` 的 `frame` 事件,并利用浏览器视口 (`window.webContents.view`) 实现这个功能。以下是步骤: 1. 首先,你需要在渲染进程中获取到当前页面的 `webContents` 对象。在主进程 (`main.js`) 中,你可以这样做: ```javascript const { BrowserWindow } = require('electron') const win = new BrowserWindow({ /* 其他配置 */ }) win.webContents.on('did-finish-load', () => { // 确保在窗口加载完成后处理 }) ``` 2. 当窗口加载完成之后,你可以添加一个事件监听器来控制窗口的拖放行为: ```javascript // main.js 或相关文件 win.webContents.on('frame', (event, frame) => { if (!frame.isMain()) { const handleDragStart = e => { e.preventDefault() // 阻止默认的拖放行为 // 使用 webContents 视图来直接移动 window,而不是元素 const position = frame.getBoundingClientRect() win.setPosition(position.left + e.clientX, position.top + e.clientY) } frame.addEventListener('mousedown', handleDragStart) return { dispose: () => { frame.removeEventListener('mousedown', handleDragStart) } } } }); ``` 在这个处理程序中,当鼠标按下时,我们阻止了默认的拖放,然后直接基于 `webContents.view` 移动整个窗口。 3. 现在,用户可以自由拖动窗口,但是窗口内部的元素仍然会响应点击事件,因为它们的事件处理器并没有被覆盖。 注意:这种做法仅适用于窗口级别的拖放,如果窗口内部有嵌套的可拖动元素,可能需要单独处理这些元素的事件。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值