依星源码资源网,依星资源网

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 19|回复: 0

electron实现电脑右下脚弹出一个窗口,窗口使用browerwindow创建,并3秒后自动关闭

[复制链接] 主动推送

9282

主题

9334

帖子

9974

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
9974
发表于 2024-8-14 12:05:20 | 显示全部楼层 |阅读模式
electron实现电脑右下脚弹出一个窗口,窗口使用browerwindow创建,并3秒后自动关闭
在 Electron 中,你可以使用  `BrowserWindow`  创建一个窗口,并在 3 秒后自动关闭它。以下是一个简单的示例,展示如何实现这个功能:
### 1. 在  `main.js`  中创建窗口
首先,你需要在  `main.js`  中创建一个新的  `BrowserWindow`  实例,并设置它的显示内容和自动关闭的逻辑。
  1. const { app, BrowserWindow } = require('electron');
  2. const path = require('path');
  3. function createWindow() {
  4.     // 创建一个新的窗口
  5.     const win = new BrowserWindow({
  6.         width: 300,  // 窗口宽度
  7.         height: 200, // 窗口高度
  8.         alwaysOnTop: true, // 窗口总在最上层
  9.         webPreferences: {
  10.             contextIsolation: true,
  11.             preload: path.join(__dirname, 'preload.js') // 使用 preload.js 进行安全通信
  12.         }
  13.     });
  14.      // 加载窗口的 HTML 文件
  15.     win.loadFile('notification.html');
  16.      // 3秒后自动关闭窗口
  17.     setTimeout(() => {
  18.         win.close(); // 关闭窗口
  19.     }, 3000);
  20. }
  21. // 当应用准备好时创建窗口
  22. app.whenReady().then(createWindow);
  23. // 处理关闭事件
  24. app.on('window-all-closed', () => {
  25.     if (process.platform !== 'darwin') {
  26.         app.quit(); // 退出应用
  27.     }
  28. });
  29. app.on('activate', () => {
  30.     if (BrowserWindow.getAllWindows().length === 0) {
  31.         createWindow(); // 如果没有窗口打开,则重新创建一个窗口
  32.     }
  33. });
复制代码


### 2. 创建  `notification.html`  文件
接下来,你需要创建一个名为  `notification.html`  的文件,用于显示在窗口中的内容。
**notification.html**
  1. html
  2. <!DOCTYPE html>
  3. <html lang="zh">
  4. <head>
  5.     <meta charset="UTF-8">
  6.     <title>通知窗口</title>
  7.     <style>
  8.         body {
  9.             display: flex;
  10.             justify-content: center;
  11.             align-items: center;
  12.             height: 100vh;
  13.             background-color: #f0f0f0;
  14.             font-family: Arial, sans-serif;
  15.         }
  16.     </style>
  17. </head>
  18. <body>
  19.     <h1>这是一个通知窗口</h1>
  20.     <p>窗口将在3秒后自动关闭。</p>
  21. </body>
  22. </html>
复制代码


### 3. 启动应用
确保你的项目结构正确,然后运行 Electron 应用。你应该能看到一个窗口弹出,并且它将在 3 秒后自动关闭。
### 总结
- 使用  `BrowserWindow`  创建一个新的窗口。
- 加载一个 HTML 文件以显示内容。
- 使用  `setTimeout`  来设置延迟,自动关闭窗口。
- 这种方法可以在 Electron 应用中实现简单的通知窗口功能。

相关帖子

扫码关注微信公众号,及时获取最新资源信息!下载附件优惠VIP会员5折;永久VIP免费
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

免责声明:
1、本站提供的所有资源仅供参考学习使用,版权归原著所有,禁止下载本站资源参与商业和非法行为,请在24小时之内自行删除!
2、本站所有内容均由互联网收集整理、网友上传,并且以计算机技术研究交流为目的,仅供大家参考、学习,请勿任何商业目的与商业用途。
3、若您需要商业运营或用于其他商业活动,请您购买正版授权并合法使用。
4、论坛的所有内容都不保证其准确性,完整性,有效性,由于源码具有复制性,一经售出,概不退换。阅读本站内容因误导等因素而造成的损失本站不承担连带责任。
5、用户使用本网站必须遵守适用的法律法规,对于用户违法使用本站非法运营而引起的一切责任,由用户自行承担
6、本站所有资源来自互联网转载,版权归原著所有,用户访问和使用本站的条件是必须接受本站“免责声明”,如果不遵守,请勿访问或使用本网站
7、本站使用者因为违反本声明的规定而触犯中华人民共和国法律的,一切后果自己负责,本站不承担任何责任。
8、凡以任何方式登陆本网站或直接、间接使用本网站资料者,视为自愿接受本网站声明的约束。
9、本站以《2013 中华人民共和国计算机软件保护条例》第二章 “软件著作权” 第十七条为原则:为了学习和研究软件内含的设计思想和原理,通过安装、显示、传输或者存储软件等方式使用软件的,可以不经软件著作权人许可,不向其支付报酬。若有学员需要商用本站资源,请务必联系版权方购买正版授权!
10、本网站如无意中侵犯了某个企业或个人的知识产权,请来信【站长信箱312337667@qq.com】告之,本站将立即删除。
郑重声明:
本站所有资源仅供用户本地电脑学习源代码的内含设计思想和原理,禁止任何其他用途!
本站所有资源、教程来自互联网转载,仅供学习交流,不得商业运营资源,不确保资源完整性,图片和资源仅供参考,不提供任何技术服务。
本站资源仅供本地编辑研究学习参考,禁止未经资源商正版授权参与任何商业行为,违法行为!如需商业请购买各资源商正版授权
本站仅收集资源,提供用户自学研究使用,本站不存在私自接受协助用户架设游戏或资源,非法运营资源行为。
 
在线客服
点击这里给我发消息 点击这里给我发消息 点击这里给我发消息
售前咨询热线
312337667

微信扫一扫,私享最新原创实用干货

QQ|免责声明|小黑屋|依星资源网 ( 鲁ICP备2021043233号-3 )|网站地图

GMT+8, 2024-8-24 18:13

Powered by Net188.com X3.4

邮箱:312337667@qq.com 客服QQ:312337667(工作时间:9:00~21:00)

快速回复 返回顶部 返回列表