electron 设置最小窗口缩放

1. 在主进程中设置(创建窗口时)

主进程是 Electron 应用的核心部分,负责管理窗口等重要操作。在主进程文件(通常是`main.js`)中,当创建窗口时,可以直接指定窗口的最小尺寸

javascript 复制代码
const { app, BrowserWindow } = require("electron");

function createWindow() {

  // 创建一个新的浏览器窗口

  let win = new BrowserWindow({

    width: 800,

    height: 600,

    minWidth: 400,

    minHeight: 300,

  });

  win.loadFile("index.html");

}

app.on("ready", createWindow);

2. 动态设置最小窗口尺寸(在主进程中)

有时候,你可能需要在应用运行过程中动态地改变窗口的最小尺寸。

javascript 复制代码
const { app, BrowserWindow } = require("electron");

let win;

function createWindow() {

  win = new BrowserWindow({

    width: 800,

    height: 600,

  });

  win.loadFile("index.html");

}

app.on("ready", createWindow);

app.on("activate", () => {

  if (win === null) {

    createWindow();

  }

});

// 假设这是一个按钮点击事件的处理函数

function onButtonClick() {

  win.setMinimumSize(400, 300);

}

3. 在渲染进程中通过 IPC(进程间通信)间接设置

渲染进程负责显示用户界面内容。如果要从渲染进程设置窗口最小尺寸,需要通过 IPC 与主进程通信。

首先,在主进程(`main.js`)中设置 IPC 通信:

javascript 复制代码
const { app, BrowserWindow, ipcMain } = require("electron");

let win;

function createWindow() {

  win = new BrowserWindow({

    width: 800,

    height: 600,

  });

  win.loadFile("index.html");

  // 监听来自渲染进程的消息

  ipcMain.on("set - min - size", (event, width, height) => {

    win.setMinimumSize(width, height);

  });

}

app.on("ready", createWindow);

app.on("activate", () => {

  if (win === null) {

    createWindow();

  }

});

然后,在渲染进程(假设是`index.html`对应的 JavaScript 文件,如`renderer.js`)中发送 IPC 消息来设置最小尺寸:

javascript 复制代码
const { ipcRenderer } = require("electron");

function setMinSize() {

  ipcRenderer.send("set - min - size", 400, 300);

}
相关推荐
恋猫de小郭2 分钟前
为什么跨平台框架可以适配鸿蒙,它们的技术原理是什么?
android·前端·flutter
云浪5 分钟前
元素变形记:CSS 缩放函数全指南
前端·css
明似水20 分钟前
用 Melos 解决 Flutter Monorepo 的依赖冲突:一个真实案例
前端·javascript·flutter
独立开阀者_FwtCoder30 分钟前
stagewise:让AI与代码编辑器无缝连接
前端·javascript·github
清沫32 分钟前
Cursor Rules 开发实践指南
前端·ai编程·cursor
江城开朗的豌豆38 分钟前
JavaScript篇:对象派 vs 过程派:编程江湖的两种武功心法
前端·javascript·面试
不吃糖葫芦339 分钟前
App使用webview套壳引入h5(二)—— app内访问h5,顶部被手机顶部菜单遮挡问题,保留顶部安全距离
前端·webview
菥菥爱嘻嘻1 小时前
JS手写代码篇---手写ajax
开发语言·javascript·ajax
江城开朗的豌豆1 小时前
JavaScript篇:字母侦探:如何快速统计字符串里谁才是'主角'?
前端·javascript·面试
kite01217 小时前
浏览器工作原理06 [#]渲染流程(下):HTML、CSS和JavaScript是如何变成页面的
javascript·css·html