likes
comments
collection
share

Electron窗口尺寸

作者站长头像
站长
· 阅读数 14

BrowserWindow 模块暴露了许多可以改变您浏览器窗口的外观和行为的API。

show

窗口是否在创建时显示。 默认值为 true。

   // 创建浏览窗口
   const mainWindow = new BrowserWindow({
        width: 800,
        height: 600,
        show: false,// 窗口是否在创建时显示。 默认值为 true。
        webPreferences: {
            preload: path.join(__dirname, "preload.js"),
        },
    });

width / height

width 整数型 (可选) - 窗口的宽度(以像素为单位)。 默认值为 800。

height 整数型 (可选) - 窗口的高度(以像素为单位)。 默认值为 600。

    // 创建浏览窗口
    const mainWindow = new BrowserWindow({
        width: 800,
        height: 600,
        show: true,// 窗口是否在创建时显示。 默认值为 true。
        webPreferences: {
            preload: path.join(__dirname, "preload.js"),
        },
    });

x / y

x Interger (可选) - (必选 如果使用了y) 窗口相对于屏幕左侧的偏移量。 默认值为将窗口居中。

y Integer (可选) - (必选 如果使用了x) 窗口相对于屏幕顶端的偏移量。 默认值为将窗口居中。

    const mainWindow = new BrowserWindow({
        x:200,
        y:100,
        width: 800,
        height: 600,
        show: true,// 窗口是否在创建时显示。 默认值为 true。
        webPreferences: {
            preload: path.join(__dirname, "preload.js"),
        },
    });

minWidth

整型(可选)-窗口的最小宽度。默认为0 默认值为 0.

    const mainWindow = new BrowserWindow({
        x:200,
        y:100,
        width: 800,
        height: 600,
        show: true,// 窗口是否在创建时显示。 默认值为 true。
        minWidth: 400,
        webPreferences: {
            preload: path.join(__dirname, "preload.js"),
        },
    });

minHeight

Integer(可选) - 窗口的最小高度。 默认值为 0.

    const mainWindow = new BrowserWindow({
        x:200,
        y:100,
        width: 800,
        height: 600,
        show: true,// 窗口是否在创建时显示。 默认值为 true。
        minWidth: 400,
        minHeight: 200,
        webPreferences: {
            preload: path.join(__dirname, "preload.js"),
        },
    });

maxWidth

Integer(可选)-窗口的最大宽度。 默认值不限

    const mainWindow = new BrowserWindow({
        x:200,
        y:100,
        width: 800,
        height: 600,
        show: true,// 窗口是否在创建时显示。 默认值为 true。
        minWidth: 400,
        minHeight: 200,
        maxWidth: 1200,
        webPreferences: {
            preload: path.join(__dirname, "preload.js"),
        },
    });

maxHeight

Integer(可选)-窗口的最大高度。 默认值不限

    const mainWindow = new BrowserWindow({
        x:200,
        y:100,
        width: 800,
        height: 600,
        show: true,// 窗口是否在创建时显示。 默认值为 true。
        minWidth: 400,
        minHeight: 200,
        maxWidth: 1200,
        maxHeight:800,
        webPreferences: {
            preload: path.join(__dirname, "preload.js"),
        },
    });

resizable

boolean (可选) - 窗口大小是否可调整。 默认值为 true。

    const mainWindow = new BrowserWindow({
        x:200,
        y:100,
        width: 800,
        height: 600,
        show: true,// 窗口是否在创建时显示。 默认值为 true。
        minWidth: 400,
        minHeight: 200,
        maxWidth: 1200,
        maxHeight:800,
        resizable: true,
        webPreferences: {
            preload: path.join(__dirname, "preload.js"),
        },
    });

无边框窗口

boolean (可选) - 设置为 false 时可以创建一个无边框窗口 默认值为 true。

    const mainWindow = new BrowserWindow({
        width: 800,
        height: 600,
        frame: false,
        webPreferences: {
            preload: path.join(__dirname, "preload.js"),
        },
    });

窗口图标

icon:在 Windows 上推荐使用 ICO 图标来获得最佳的视觉效果, 默认使用可执行文件的图标.

    // 创建浏览窗口
    const mainWindow = new BrowserWindow({
        width: 800,
        height: 600,
        // 窗口图标。 在 Windows 上推荐使用 ICO 图标来获得最佳的视觉效果, 默认使用可执行文件的图标.
        icon: path.join(__dirname, "public/code.ico"),
    });

自动隐藏菜单栏

autoHideMenuBar boolean (可选) - 自动隐藏菜单栏,除非按了Alt键。 默认值为 false.

    // 创建浏览窗口
    const mainWindow = new BrowserWindow({
        width: 800,
        height: 600,
        autoHideMenuBar:true,
    });

窗口透明

transparent boolean (可选) - 使窗口 透明。 默认值为 false. 在Windows上,仅在无边框窗口下起作用。

    // 创建浏览窗口
    const mainWindow = new BrowserWindow({
        width: 800,
        height: 600,
        transparent: true,
    });

窗口标题

title string(可选) - 默认窗口标题 默认为"Electron"。 如果由loadURL()加载的HTML文件中含有标签<title>,此属性将被忽略。

const mainWindow = new BrowserWindow({
        width: 800,
        height: 600,
        title:"码上有料",
});

更多功能请走这里:www.electronjs.org/zh/docs/lat…