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

相关推荐
Bellafu6662 小时前
selenium 常用xpath写法
前端·selenium·测试工具
blackorbird5 小时前
Edge 浏览器 IE 模式成攻击突破口:黑客借仿冒网站诱导攻击
前端·edge
谷歌开发者6 小时前
Web 开发指向标 | Chrome 开发者工具学习资源 (一)
前端·chrome·学习
名字越长技术越强6 小时前
Chrome和IE获取本机ip地址
前端
天***88966 小时前
Chrome 安装失败且提示“无可用的更新” 或 “与服务器的连接意外终止”,Chrome 离线版下载安装教程
前端·chrome
半梦半醒*6 小时前
zabbix安装
linux·运维·前端·网络·zabbix
大怪v7 小时前
【搞发🌸活】不信书上那套理论!亲测Javascript能卡浏览器Reader一辈子~
javascript·html·浏览器
清羽_ls7 小时前
React Hooks 核心规则&自定义 Hooks
前端·react.js·hooks
你的人类朋友7 小时前
“签名”这个概念是非对称加密独有的吗?
前端·后端·安全
西陵7 小时前
Nx带来极致的前端开发体验——任务缓存
前端·javascript·架构