メインコンテンツへスキップ

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 Integer (オプション) - 子ビューを挿入するインデックス。デフォルトでは、子リストの最後に追加されます。

同じViewがすでに含まれている親に追加されると、最上位のビューになるように並べ替えられます。

view.removeChildView(view)​

  • view View - 削除する子ビュー。

パラメータとして渡されたビューがこのビューの子でない場合、このメソッドは何も実行しません。

view.setBounds(bounds)​

  • bounds Rectangle - Viewの新しい境界。

view.getBounds()​

返します Rectangle - このViewの境界（親に対する相対位置）。

view.setBackgroundColor(color)​

  • color string - 16進数、RGB、ARGB、HSL、HSLA、または名前付きCSSカラー形式の色。16進数タイプの場合、アルファチャネルはオプションです。

有効なcolor値の例

  • 16進数
    • #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

注：アルファ付きの16進数形式は、RRGGBBAAまたはRGBではなく、AARRGGBBまたはARGBを使用します。

view.setVisible(visible)​

  • visible boolean - falseの場合、ビューは表示されなくなります。

インスタンスプロパティ​

new Viewで作成されたオブジェクトには、次のプロパティがあります

view.children 読み取り専用​

このビューの子ビューを表すView[]プロパティ。