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

相关推荐
iナナ15 小时前
Spring Web MVC入门
java·前端·网络·后端·spring·mvc
驱动探索者15 小时前
find 命令使用介绍
java·linux·运维·服务器·前端·学习·microsoft
开心不就得了15 小时前
自定义脚手架
前端·javascript
星晨雪海16 小时前
怎么格式化idea中的vue文件
前端·vue.js·intellij-idea
没事多睡觉66616 小时前
Vue 虚拟列表实现方案详解:三种方法的完整对比与实践
前端·javascript·vue.js
white-persist17 小时前
Burp Suite模拟器抓包全攻略
前端·网络·安全·web安全·notepad++·原型模式
ObjectX前端实验室17 小时前
【前端工程化】脚手架篇 - 模板引擎 & 动态依赖管理脚手架
前端
GISer_Jing17 小时前
前端GIS篇——WebGIS、WebGL、Java后端篇
java·前端·webgl
excel17 小时前
Vue3 EffectScope 源码解析与理解
前端·javascript·面试
细节控菜鸡17 小时前
【2025最新】ArcGIS for JS 实现地图卷帘效果
开发语言·javascript·arcgis