electron 设置界面右下角打开

功能需求场景

写一个可以下载各种平台的小工具,需要右下角打开方便做其它事情

实现基础

要在屏幕的右下角设置窗口,可以调整mainWindow的创建参数,特别是通过使用xy坐标来定位窗口 ; 需要获取屏幕的尺寸,并据此计算出窗口的位置

代码示例

javascript 复制代码
const { screen } = require('electron');

function createWindow() {
  const { width, height } = screen.getPrimaryDisplay().workAreaSize
  // Create the browser window.
  const mainWindow = new BrowserWindow({
    width: 350,
    height: 68,
    show: false,
    x: width - 350, // 屏幕宽度减去窗口宽度,确保窗口靠右
    y: height - 68, // 屏幕高度减去窗口高度,确保窗口靠下
    ...
  })
}

需要注意

javascript 复制代码
const { width, height } = screen.getPrimaryDisplay().workAreaSize

这行代码只能写在electron初始化完成之后 , 如代码示例 , 写在开头导入资源中 必报错

相关推荐
Highcharts.js24 分钟前
缺失数据可视化图表开发实战|Highcharts创建人员出生统计面积图表示例
开发语言·前端·javascript·信息可视化·highcharts·图表开发
LaughingZhu7 小时前
Product Hunt 每日热榜 | 2026-05-21
前端·人工智能·经验分享·chatgpt·html
怕浪猫7 小时前
Electron 开发实战(一):从零入门核心基础与环境搭建
前端·electron·ai编程
小鹏linux8 小时前
Ubuntu 22.04 部署开源免费具有精美现代web页面的Casdoor账号管理系统
linux·前端·ubuntu·开源·堡垒机
前端若水9 小时前
会话管理:创建、切换、删除对话历史
前端·人工智能·python·react.js
Bigger9 小时前
mini-cc:一个轻量级 AI 编程助手的诞生
前端·ai编程·claude
涵涵(互关)9 小时前
Naive-ui树型选择器只显示根节点
前端·ui·vue
BY组态9 小时前
Ricon组态系统最佳实践:从零开始构建物联网监控平台
前端·物联网·iot·web组态·组态
BY组态9 小时前
Ricon组态系统vs传统组态软件:为什么选择新一代Web组态平台
前端·物联网·iot·web组态·组态
SoaringHeart9 小时前
Flutter进阶:OverlayEntry 插入图层管理器 NOverlayZIndexManager
前端·flutter