BrowserView

BrowserView は、BrowserWindow に追加のウェブコンテンツを埋め込むのに使用することができます。 外側のウインドウを基準にして配置される点を除いて、子ウインドウのようなものです。 webview タグの代替となるものです。

クラス: BrowserView

ビューを作成したり、制御したりします。

プロセス: Main

app モジュールの ready イベントが発生するまでは、このモジュールは使用できません。

サンプル

// メインプロセス
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')
})

new BrowserView([options]) 実験的

• options Object (任意)
  • webPreferences Object (任意) - BrowserWindow を参照してください。

インスタンスプロパティ

new BrowserView で作成されたオブジェクトは、以下のプロパティを持っています。

view.webContents 実験的

このビューによって保持されている WebContents オブジェクト。

インスタンスメソッド

new BrowserView で作成されたオブジェクトは、次のインスタンスメソッドを持っています。

view.setAutoResize(options) 実験的

• options Object
  • width boolean (任意) - true の場合、ビューの横幅はウインドウと一緒に伸び縮みします。 省略値は false です。
  • height boolean (任意) - true の場合、ビューの高さはウインドウと一緒に伸び縮みします。 省略値は false です。
  • horizontal boolean (任意) - true の場合、ビューの x 位置と幅はウィンドウに比例して増減します。 省略値は false です。
  • vertical boolean (任意) - true の場合、ビューの y 位置と高さはウィンドウに比例して増減します。 省略値は false です。

view.setBounds(bounds) 実験的

• bounds Rectangle

ウインドウを基準に指定された境界までビューをリサイズしたり、移動させたりします。

view.getBounds() 実験的

戻り値 Rectangle

Object としてのこの BrowserView インスタンスの bounds。

view.setBackgroundColor(color) 実験的

• color string - 16進数、RGB、ARGB、HSL、HSLA、または名前付き CSS カラーフォーマットの色。 16 進数タイプの場合のアルファチャンネルは任意です。

有効な color の値の例を示します。

• Hex
  • #fff (RGB)
  • #ffff (ARGB)
  • #ffffff (RRGGBB)
  • #ffffffff (AARRGGBB)
• RGB
  • rgb(([\d]+),\s([\d]+),\s([\d]+))
    • 例: rgb(255, 255, 255)
• RGBA
  • rgba(([\d]+),\s([\d]+),\s([\d]+),\s*([\d.]+))
    • 例: rgba(255, 255, 255, 1.0)
• HSL
  • hsl((-?[\d.]+),\s([\d.]+)%,\s([\d.]+)%)
    • 例: hsl(200, 20%, 50%)
• HSLA
  • hsla((-?[\d.]+),\s([\d.]+)%,\s([\d.]+)%,\s*([\d.]+))
    • 例: hsla(200, 20%, 50%, 0.5)
• 色の名前
  • 選択肢は SkParseColor.cpp に列挙してあります。
  • CSS カラーモジュールレベル 3 のキーワードと似ていますが、大文字と小文字を区別します。
    • 例: blueviolet や red

注意: アルファ付きの 16 進数フォーマットは AARRGGBB や ARGB であり、RRGGBBA や RGA では ありません。