Electron 中的内容周围有黑色边框

Question

Electron 中的内容周围有黑色边框

Pts*_*luS 2 javascript node.js npm electron

我使用 Electron 将使用 Phaser 2 制作的视频游戏转换为 .exe。但在我的内容周围，我有一些边框或边距。

我尝试使用全屏来改变这一点，我也尝试使用 useContentSize 但问题没有解决。

这是我的 JS 文件：

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

let win;

function createWindow () {
  // Cree la fenetre du navigateur.
 win = new BrowserWindow({
    //width: 886,
    //height: 473,
    useContentSize : true,
    autoHideMenuBar : true,
    icon: "favicon.ico",
    //met la fenetre sans bordure 
    //frame : false,
    //fullscreen : true,
  })

  //load the index.html.
  win.loadFile('src/junkbuster.html');
  win.setMenuBarVisibility(false);
  win.setMenu(null);
  //win.setContentSize(1700,1200);
}

app.on('ready', function(){
  createWindow();

  console.log(win.getContentBounds());

  //800,600 => 786, 563
  console.log(win.getSize()+"=>"+win.getContentSize());

});

Run Code Online (Sandbox Code Playgroud)

这是我的 HTML 文件

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <script src="./phaser.js"></script>
    <script src="./index.js"></script>
    <style type="text/css">
    body {
        background-color: black;
        width:100vw;
        height:100vh;
        margin:0px;
    }
    body * {
        margin-left: auto;
        margin-right: auto;
    }
    </style>
</head>
<body>
</body>
</html>

Run Code Online (Sandbox Code Playgroud)

Answer 1

Rez*_*our 5

根据Issue #9419，对我有用的解决方法是避免mainWindow.setResizable(false)并使用它：

mainWindow.on('will-resize', (e) => {
//prevent resizing even if resizable property is true.
    e.preventDefault();
});

Run Code Online (Sandbox Code Playgroud)

归档时间：	6 年，2 月前
查看次数：	1546 次
最近记录：	5 年，3 月前