Skip to main content

BrowserView

Eine Browseransicht kann verwendet werden, um zusätzliche Webinhalte in ein BrowserWindow einzubetten. Es ist wie ein untergeordnetes Fenster, mit der Ausnahme, dass es relativ zu dem übergeordneten Fenster positioniert ist. Es ist als Alternative zum Webview Tag gedacht.

Klasse: BrowserView

Erstelle und kontrolliere Ansichten.

Prozess: Haupt

Beispiel

// Im Hauptprozess.
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]) Experimental

  • options Object (optional)

Instanz Eigenschaften

Objekte, die mit new BrowserView erstellt wurden, haben folgende Eigenschaften:

view.webContents Experimental

A WebContents object owned by this view.

Beispiel Methoden

Objekte, die mit new BrowserView erstellt wurden, haben folgende Instanzmethoden:

view.setAutoResize(options) Experimental

  • options Objekt
    • width boolean (optional) - Wenn true, wächst und schrumpft die Breite der Ansicht zusammen mit dem übergeordneten Fenster. Automatisch false.
    • height boolean (optional) - Wenn true, wächst und schrumpft die Höhe der Ansicht zusammen mit dem übergeordneten Fenster. Automatisch false.
    • horizontal boolean (optional) - Wenn true, ändert sich sowohl die X-Position als auch die Breite der Ansicht zusammen mit dem übergeordneten Fenster. Automatisch false.
    • vertical boolean (optional) - Wenn true, ändert sich sowohl die Y-Position als auch die Höhe der Ansicht zusammen mit dem übergeordneten Fenster. Automatisch false.

view.setBounds(bounds) Experimental

  • bounds Rectangle Die Grenzen der Ansicht als Rechteck

Passt die Ansicht an die Dimensionen und die Ausrichtung des Rechteckes relativ zum übergeordneten Fenster an.

view.getBounds() Experimental

Returns Rectangle

Die bounds dieser BrowserView-Instanz als Object.

view.setBackgroundColor(color) Experimental

  • color string - Color in Hex, RGB, ARGB, HSL, HSLA or named CSS color format. The alpha channel is optional for the hex type.

Examples of valid color values:

  • Hex
    • #fff (RGB)
    • #ffff (ARGB)
    • #ffffff (RRGGBB)
    • #ffffffff (AARRGGBB)
  • RGB
    • rgb(([\d]+),\s([\d]+),\s([\d]+))
      • e.g. rgb(255, 255, 255)
  • RGBA
    • rgba(([\d]+),\s([\d]+),\s([\d]+),\s*([\d.]+))
      • e.g. rgba(255, 255, 255, 1.0)
  • HSL
    • hsl((-?[\d.]+),\s([\d.]+)%,\s([\d.]+)%)
      • e.g. hsl(200, 20%, 50%)
  • HSLA
    • hsla((-?[\d.]+),\s([\d.]+)%,\s([\d.]+)%,\s*([\d.]+))
      • e.g. hsla(200, 20%, 50%, 0.5)
  • Color name
    • Options are listed in SkParseColor.cpp
    • Similar to CSS Color Module Level 3 keywords, but case-sensitive.
      • e.g. blueviolet or red

Note: Hex format with alpha takes AARRGGBB or ARGB, not RRGGBBA or RGA.