searchusermenu
  • 发布文章
  • 消息中心
点赞
收藏
评论
分享
原创

关于electron创建透明窗口时偶发的显示异常的问题说明

2024-07-08 09:48:50
55
0

在创建透明窗口后,偶尔会出现窗口只在任务栏能看到有任务但是窗口本身没有显示出来的情况。

按照官方文档,创建简单的透明窗口:

const { app, BrowserWindow } = require('electron');

function createWindow() {
  const mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    transparent: true, // 设置窗口为透明
    frame: false, // 去除窗口的边框
    webPreferences: {
      nodeIntegration: true
    }
  });

  mainWindow.loadFile('index.html'); // 加载你的HTML文件

  // 打开开发者工具
  mainWindow.webContents.openDevTools();
}

app.whenReady().then(createWindow);
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Transparent Window</title>
  <style>
    body {
      background-color: transparent;
    }
  </style>
</head>
<body>
  <h1>Hello, Transparent Window!</h1>
</body>
</html>

 

但是在创建窗口的时候无意中添加了属性:backgroundThrottling:false,就导致透明窗口有时候显示异常了,所以不能加backgroundThrottling这个属性,官方文档是这么解析的:

  • backgroundThrottling Boolean (optional) - Whether to throttle animations and timers when the page becomes background. Defaults to true.

所以如果设置了这个属性,在遇到上述问题的时候,记得要把这个属性去掉。

0条评论
0 / 1000
龙****滔
5文章数
0粉丝数
龙****滔
5 文章 | 0 粉丝
原创

关于electron创建透明窗口时偶发的显示异常的问题说明

2024-07-08 09:48:50
55
0

在创建透明窗口后,偶尔会出现窗口只在任务栏能看到有任务但是窗口本身没有显示出来的情况。

按照官方文档,创建简单的透明窗口:

const { app, BrowserWindow } = require('electron');

function createWindow() {
  const mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    transparent: true, // 设置窗口为透明
    frame: false, // 去除窗口的边框
    webPreferences: {
      nodeIntegration: true
    }
  });

  mainWindow.loadFile('index.html'); // 加载你的HTML文件

  // 打开开发者工具
  mainWindow.webContents.openDevTools();
}

app.whenReady().then(createWindow);
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Transparent Window</title>
  <style>
    body {
      background-color: transparent;
    }
  </style>
</head>
<body>
  <h1>Hello, Transparent Window!</h1>
</body>
</html>

 

但是在创建窗口的时候无意中添加了属性:backgroundThrottling:false,就导致透明窗口有时候显示异常了,所以不能加backgroundThrottling这个属性,官方文档是这么解析的:

  • backgroundThrottling Boolean (optional) - Whether to throttle animations and timers when the page becomes background. Defaults to true.

所以如果设置了这个属性,在遇到上述问题的时候,记得要把这个属性去掉。

文章来自个人专栏
electron
1 文章 | 1 订阅
0条评论
0 / 1000
请输入你的评论
0
0