[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) 设置背景颜色

相关推荐
翻滚吧键盘16 分钟前
vue绑定一个返回对象的计算属性
前端·javascript·vue.js
苦夏木禾20 分钟前
js请求避免缓存的三种方式
开发语言·javascript·缓存
超级土豆粉28 分钟前
Turndown.js: 优雅地将 HTML 转换为 Markdown
开发语言·javascript·html
秃了也弱了。35 分钟前
Chrome谷歌浏览器插件ModHeader,修改请求头,开发神器
前端·chrome
乆夨(jiuze)1 小时前
记录H5内嵌到flutter App的一个问题,引发后面使用fastClick,引发后面input输入框单击无效问题。。。
前端·javascript·vue.js
忧郁的蛋~1 小时前
HTML表格导出为Excel文件的实现方案
前端·html·excel
小彭努力中1 小时前
141.在 Vue 3 中使用 OpenLayers Link 交互:把地图中心点 / 缩放级别 / 旋转角度实时写进 URL,并同步解析显示
前端·javascript·vue.js·交互
然我2 小时前
别再只用 base64!HTML5 的 Blob 才是二进制处理的王者,面试常考
前端·面试·html
NanLing2 小时前
【纯前端推理】纯端侧 AI 对象检测:用浏览器就能跑的深度学习模型
前端
呆呆的心2 小时前
前端必学:从盒模型到定位,一篇搞定页面布局核心 🧩
前端·css