View

建立與佈局原生視圖。

程序：主要

此模組在 app 模組的 ready 事件發射之前無法使用。

const { BaseWindow, View } = require('electron')
const win = new BaseWindow()
const view = new View()

view.setBackgroundColor('red')
view.setBounds({ x: 0, y: 0, width: 100, height: 100 })
win.contentView.addChildView(view)

類別：View

一個基本原生視圖。

程序：主要

View 是一個 EventEmitter。

new View()

建立一個新的 View。

實例事件

使用 new View 建立的物件會發射以下事件

事件：'bounds-changed'

當視圖的邊界因佈局而變更時發射。可以使用 view.getBounds() 檢索新的邊界。

實例方法

使用 new View 建立的物件具有以下實例方法

view.addChildView(view[, index])

• view View - 要新增的子視圖。
• index 整數 (選用) - 要插入子視圖的索引。預設為將子視圖新增至子視圖列表的末尾。

如果將相同的 View 新增至已包含它的父項，則會重新排序，使其成為最上層的視圖。

view.removeChildView(view)

• view View - 要移除的子視圖。

如果作為參數傳遞的視圖不是此視圖的子視圖，則此方法為空操作。

view.setBounds(bounds)

• bounds Rectangle - View 的新邊界。

view.getBounds()

傳回 Rectangle - 此 View 的邊界，相對於其父項。

view.setBackgroundColor(color)

• color 字串 - 十六進位、RGB、ARGB、HSL、HSLA 或具名 CSS 色彩格式的色彩。alpha 通道對於十六進位類型是選用的。

有效 color 值的範例

• 十六進位
  • #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 Color Module Level 3 關鍵字，但區分大小寫。
    • 例如：blueviolet 或 red

注意： 具有 alpha 的十六進位格式採用 AARRGGBB 或 ARGB，而非 RRGGBBAA 或 RGB。

view.setBorderRadius(radius)

• radius 整數 - 邊框圓角大小，以像素為單位。

注意： 視圖邊框的裁切區域仍然會捕捉點擊。

view.setVisible(visible)

• visible 布林值 - 如果為 false，則視圖將從顯示中隱藏。

view.getVisible()

傳回 boolean - 視圖是否應繪製。請注意，這與視圖是否在螢幕上可見不同，它可能仍然被遮蔽或超出視圖範圍。

實例屬性

使用 new View 建立的物件具有以下屬性

view.children 唯讀

代表此視圖的子視圖的 View[] 屬性。