[Electron]中的BrowserView

Electron中BrowserView

BrowserView 被用来让 BrowserWindow 嵌入更多的 web 内容。 它就像一个子窗口,除了它的位置是相对于父窗口。 这意味着可以替代webview标签.

示例

复制代码
const { app, BrowserView, BrowserWindow } = require('electron')
​
app.whenReady().then(() => {
  const win = new BrowserWindow({ width: 800, height: 600 })
​
  const view = new BrowserView()
  win.setBrowserView(view)
  view.setBounds({ x: 0, y: 0, width: 300, height: 300 })
  view.webContents.loadURL('https://electronjs.org')
})

效果图

构造方法

复制代码
view = new BrowserView()

实例属性

view.webContents(webContents)

实例方法

view.setAutoResize(options) 调整视图的大小,并将它移动到窗口边界

  • 选项 对象

    • width boolean(可选) - 如果为true,视图宽度跟随窗口变化。 默认值为 false

    • height boolean(可选) - 如果 true,视图的高度将增长和缩小 与窗口。 默认值为 false

    • horizontal boolean (可选) - 如果为 true,视图的x轴和宽度将随着窗口的大小变化等比例缩放。 默认值为 false

    • vertical boolean(可选) - 如果 true,视图的y位置和高度将增长 和收缩比例与窗口。 默认值为 false

view.setBounds(bounds)

  • bounds RectangleRectangle { x number y number width number height number}

**view.setBounds()**返回 Rectangle

view.setBackgroundColor(color) 设置背景颜色

相关推荐
whinc5 小时前
JavaScript技术周刊 2026年第18周
javascript
码海扬帆:前端探索之旅5 小时前
深度定制 uni-combox:新增功能详解与实战指南
前端·vue.js·uni-app
谷雨不太卷5 小时前
进程的状态码
java·前端·算法
打小就很皮...5 小时前
基于 Python + LangChain + RAG 的知识检索系统实战
前端·langchain·embedding·rag
whinc5 小时前
JavaScript技术周刊 2026年第17周
javascript
BJ-Giser5 小时前
Cesium 烟雾粒子特效
前端·可视化·cesium
空中海5 小时前
02 ArkTS 语言与工程规范
java·前端·spring