chrome.app.window

說明

使用 chrome.app.window API 建立視窗。視窗可選擇是否要加上含有標題列和大小控制項的框架。不會與任何 Chrome 瀏覽器視窗建立關聯。如要查看這些選項的示範,請參閱「視窗狀態範例」。

類型

AppWindow

屬性

  • contentWindow

    視窗

    所建立子項的 JavaScript「window」物件。

  • id

    字串

    建立視窗時所用的 ID。

  • innerBounds

    視窗內容的位置、大小和限制,不包括視窗裝飾。這項屬性是 Chrome 36 的新功能。

  • outerBounds

    視窗的位置、大小和限制,包括視窗裝飾,例如標題列和框架。這項屬性是 Chrome 36 的新功能。

  • clearAttention

    void

    清楚顯示視窗。

    clearAttention 函式如下所示:

    () => {...}

  • 關閉

    void

    關閉視窗。

    close 函式如下所示:

    () => {...}

  • drawAttention

    void

    吸引使用者注意視窗。

    drawAttention 函式如下所示:

    () => {...}

  • 焦點

    void

    將焦點移至該視窗。

    focus 函式如下所示:

    () => {...}

  • 全螢幕

    void

    將視窗設為全螢幕。

    使用者可以按 ESC 鍵還原視窗。應用程式可以要求 app.window.fullscreen.overrideEsc 權限,並在 keydown 和 keyup 處理常式中呼叫 .preventDefault() 取消事件,防止使用者按下 ESC 鍵時離開全螢幕狀態,如下所示:

    window.onkeydown = window.onkeyup = function(e) { if (e.keyCode == 27 /* ESC *\/) { e.preventDefault(); } };

    請注意,window.fullscreen() 會導致整個視窗進入全螢幕模式,不需要使用者手勢。您也可以使用 HTML5 全螢幕 API 進入全螢幕模式 (詳情請參閱「Web API」)。

    fullscreen 函式如下所示:

    () => {...}

  • getBounds

    void

    已淘汰

    使用 innerBounds 或 outerBounds。

    ContentBounds 物件的形式取得視窗的內部界線。

    getBounds 函式如下所示:

    () => {...}

  • 隱藏

    void

    隱藏視窗。如果視窗已隱藏,系統不會有任何動作。

    hide 函式如下所示:

    () => {...}

  • isAlwaysOnTop

    void

    視窗是否一律顯示在最上層?

    isAlwaysOnTop 函式如下所示:

    () => {...}

    • returns

      布林值

  • isFullscreen

    void

    視窗是否為全螢幕?如果視窗已建立為全螢幕,或透過 AppWindow 或 HTML5 全螢幕 API 設為全螢幕,這個值就會是 true。

    isFullscreen 函式如下所示:

    () => {...}

    • returns

      布林值

  • isMaximized

    void

    視窗是否已放到最大?

    isMaximized 函式如下所示:

    () => {...}

    • returns

      布林值

  • isMinimized

    void

    視窗是否已縮到最小?

    isMinimized 函式如下所示:

    () => {...}

    • returns

      布林值

  • 盡量提高

    void

    將視窗放到最大。

    maximize 函式如下所示:

    () => {...}

  • 最小化

    void

    將視窗縮到最小。

    minimize 函式如下所示:

    () => {...}

  • moveTo

    void

    Chrome 43 版起已淘汰

    使用 outerBounds。

    將視窗移到 (left, top) 位置。

    moveTo 函式如下所示:

    (left: number, top: number) => {...}

    • 數字

    • 頂端

      數字

  • resizeTo

    void

    Chrome 43 版起已淘汰

    使用 outerBounds。

    將視窗大小調整為 widthxheight 像素。

    resizeTo 函式如下所示:

    (width: number, height: number) => {...}

    • 寬度

      數字

    • 高度

      數字

  • restore

    void

    還原視窗,結束最大化、最小化或全螢幕狀態。

    restore 函式如下所示:

    () => {...}

  • setAlwaysOnTop

    void

    設定視窗是否應保持在大多數其他視窗上方。需要 alwaysOnTopWindows 權限。

    setAlwaysOnTop 函式如下所示:

    (alwaysOnTop: boolean) => {...}

    • alwaysOnTop

      布林值

  • setBounds

    void

    已淘汰

    使用 innerBounds 或 outerBounds。

    設定視窗的內部界線。

    setBounds 函式如下所示:

    (bounds: ContentBounds) => {...}

  • setVisibleOnAllWorkspaces

    void

    設定視窗是否要在所有工作區中顯示。(僅適用於支援這項功能的平台)。

    setVisibleOnAllWorkspaces 函式如下所示:

    (alwaysVisible: boolean) => {...}

    • alwaysVisible

      布林值

  • 顯示

    void

    顯示視窗。如果視窗已顯示,則不會有任何動作。如果 focused 設為 true 或省略,則將焦點放在視窗上。

    show 函式如下所示:

    (focused?: boolean) => {...}

    • 全神貫注

      布林值 選填

Bounds

屬性

  • 高度

    數字

    這個屬性可用於讀取或寫入內容或視窗的目前高度。

  • 數字

    這個屬性可用於讀取或寫入內容或視窗的目前 X 座標。

  • maxHeight

    號碼 選填

    這項屬性可用於讀取或寫入內容或視窗的目前最大高度。值為 null 表示「未指定」。

  • maxWidth

    號碼 選填

    這項屬性可用於讀取或寫入內容或視窗的目前最大寬度。值為 null 表示「未指定」。

  • minHeight

    號碼 選填

    這個屬性可用於讀取或寫入內容或視窗的目前最小高度。值為 null 表示「未指定」。

  • minWidth

    號碼 選填

    這個屬性可用於讀取或寫入內容或視窗的目前最小寬度。值為 null 表示「未指定」。

  • 頂端

    數字

    這個屬性可用於讀取或寫入內容或視窗的目前 Y 座標。

  • 寬度

    數字

    這個屬性可用於讀取或寫入內容或視窗的目前寬度。

  • setMaximumSize

    void

    設定內容或視窗的大小限制上限。如要移除限制,寬度或高度上限可以設為 null。如果值為 undefined,限制條件就不會變更。

    setMaximumSize 函式如下所示:

    (maxWidth: number, maxHeight: number) => {...}

    • maxWidth

      數字

    • maxHeight

      數字

  • setMinimumSize

    void

    設定內容或視窗的最小尺寸限制。你可以將最小寬度或高度設為 null,移除限制。如果值為 undefined,限制條件就不會變更。

    setMinimumSize 函式如下所示:

    (minWidth: number, minHeight: number) => {...}

    • minWidth

      數字

    • minHeight

      數字

  • setPosition

    void

    設定內容或視窗的左側和頂端位置。

    setPosition 函式如下所示:

    (left: number, top: number) => {...}

    • 數字

    • 頂端

      數字

  • setSize

    void

    設定內容或視窗的寬度和高度。

    setSize 函式如下所示:

    (width: number, height: number) => {...}

    • 寬度

      數字

    • 高度

      數字

BoundsSpecification

屬性

  • 高度

    號碼 選填

    內容或視窗的高度。

  • 號碼 選填

    內容或視窗的 X 座標。

  • maxHeight

    號碼 選填

    內容或視窗的高度上限。

  • maxWidth

    號碼 選填

    內容或視窗的寬度上限。

  • minHeight

    號碼 選填

    內容或視窗的最小高度。

  • minWidth

    號碼 選填

    內容或視窗的最小寬度。

  • 頂端

    號碼 選填

    內容或視窗的 Y 座標。

  • 寬度

    號碼 選填

    內容或視窗的寬度。

ContentBounds

屬性

  • 高度

    號碼 選填

  • 號碼 選填

  • 頂端

    號碼 選填

  • 寬度

    號碼 選填

CreateWindowOptions

屬性

  • alwaysOnTop

    布林值 選填

    如為 true,視窗會顯示在大多數其他視窗上方。如果有多個這類視窗,目前聚焦的視窗會顯示在前景。需要 alwaysOnTopWindows 權限。預設值為 false。

    建立後,請對視窗呼叫 setAlwaysOnTop() 來變更這項屬性。

  • 界限
    已淘汰

    使用 innerBounds 或 outerBounds。

    視窗中內容的大小和位置 (不含標題列)。如果也指定了 ID,且先前已顯示具有相符 ID 的視窗,系統會改用該視窗的記憶邊界。

  • 全神貫注

    布林值 選填

    如為 true,視窗會在建立時成為焦點。預設為 true。

  • 相框

    字串 | FrameOptions 選用

    影格類型:nonechrome (預設為 chrome)。如果是 none,可以使用 -webkit-app-region CSS 屬性,為應用程式視窗套用可拖曳性。-webkit-app-region: drag 可用來將區域標示為可拖曳。no-drag 可用於停用巢狀元素上的樣式。

    M36 新增了 FrameOptions 的使用方式。

  • 隱藏

    布林值 選填

    如為 true,系統會以隱藏狀態建立視窗。建立視窗後,請對視窗呼叫 show(),即可顯示視窗。預設值為 false。

  • 圖示

    字串 選填

    Chrome 54 以上版本

    視窗圖示的網址。如果 showInShelf 設為 true,視窗可以有自己的圖示。網址應為全域網址或擴充功能本機網址。

  • id

    字串 選填

    用於識別視窗的 ID。系統會使用這個 ID 記住視窗的大小和位置,並在稍後開啟具有相同 ID 的視窗時還原該幾何圖形。如果建立的視窗具有特定 ID,但已有另一個視窗使用相同 ID,系統會將焦點放在目前開啟的視窗,而不是建立新視窗。

  • innerBounds

    用於指定視窗內容的初始位置、初始大小和限制 (不含視窗裝飾)。如果也指定了 id,且先前已顯示具有相符 id 的視窗,系統會改用記憶的界線。

    請注意,內外邊界之間的邊框間距是由作業系統決定。因此,如果為 innerBoundsouterBounds 設定相同的界線屬性,就會導致錯誤。

    這項屬性是 Chrome 36 的新功能。

  • maxHeight

    號碼 選填

    已淘汰

    使用 innerBounds 或 outerBounds。

    視窗的高度上限。

  • maxWidth

    號碼 選填

    已淘汰

    使用 innerBounds 或 outerBounds。

    視窗寬度上限。

  • minHeight

    號碼 選填

    已淘汰

    使用 innerBounds 或 outerBounds。

    視窗的最小高度。

  • minWidth

    號碼 選填

    已淘汰

    使用 innerBounds 或 outerBounds。

    視窗的最小寬度。

  • outerBounds

    用於指定視窗的初始位置、初始大小和限制 (包括標題列和框架等視窗裝飾)。如果也指定了 id,且先前已顯示具有相符 id 的視窗,系統會改用記憶的界線。

    請注意,內外邊界之間的邊框間距是由作業系統決定。因此,如果為 innerBoundsouterBounds 設定相同的界線屬性,就會導致錯誤。

    這項屬性是 Chrome 36 的新功能。

  • 可調整大小

    布林值 選填

    如為 true,使用者可以調整視窗大小。預設為 true。

  • showInShelf

    布林值 選填

    Chrome 54 以上版本

    如果是 true,視窗會有自己的書架圖示。否則,視窗會與應用程式相關聯的其他視窗一起歸入架子。預設值為 false。如果 showInShelf 設為 true,您必須為視窗指定 ID。

  • 單例模式

    布林值 選填

    已淘汰

    系統不再支援使用相同 ID 的多個視窗。

    根據預設,如果您為視窗指定 ID,只有在沒有其他相同 ID 的視窗時,系統才會建立視窗。如果已有 ID 相同的視窗,系統會改為啟用該視窗。如要建立多個具有相同 ID 的視窗,可以將這個屬性設為 false。

  • (選填)

    視窗的初始狀態,可讓視窗建立時就已全螢幕、最大化或最小化。預設值為「normal」。

  • 類型

    WindowType 選填

    Chrome 45 以上版本 Chrome 69 以上版本已淘汰

    所有應用程式視窗都使用「shell」視窗類型

    要建立的視窗類型。

  • visibleOnAllWorkspaces

    布林值 選填

    如果為 true,且平台支援這項功能,視窗就會顯示在所有工作區。

FrameOptions

屬性

  • activeColor

    字串 選填

    允許設定視窗在啟用時的框架顏色。只有在影格類型為 chrome 時,才能使用影格著色功能。

    只有在影格類型為 chrome 時,才能使用影格著色功能。

    Chrome 36 版新增了框架顏色功能。

  • 顏色

    字串 選填

    允許設定影格顏色。只有在影格類型為 chrome 時,才能使用影格著色功能。

    Chrome 36 版新增了框架顏色功能。

  • inactiveColor

    字串 選填

    允許在視窗處於非使用中狀態時,將框架顏色設為與使用中狀態不同的顏色。只有在影格類型為 chrome 時,才能使用影格著色功能。

    inactiveColor 必須與 color 搭配使用。

    Chrome 36 版新增了框架顏色功能。

  • 類型

    字串 選填

    影格類型:nonechrome (預設為 chrome)。

    對於 none,可以使用 -webkit-app-region CSS 屬性,將可拖曳性套用至應用程式視窗。

    -webkit-app-region: drag 可用來將區域標示為可拖曳。no-drag 可用於停用巢狀元素上的樣式。

State

視窗狀態:正常、全螢幕、最大化、最小化。

列舉

「normal」

「fullscreen」

「maximized」

「minimized」

WindowType

Chrome 45 以上版本

指定要建立的視窗類型。

列舉

「shell」
預設視窗類型。

「panel」
OS 管理的視窗 (已淘汰)。

方法

canSetVisibleOnAllWorkspaces()

chrome.app.window.canSetVisibleOnAllWorkspaces(): boolean

目前平台是否支援在所有工作區顯示視窗。

傳回

  • 布林值

create()

Promise
chrome.app.window.create(
  url: string,
  options?: CreateWindowOptions,
  callback?: function,
)
: Promise<AppWindow>

指定視窗大小和位置的方法有很多種。最簡單的方法就是完全不指定任何內容,這樣系統就會使用預設大小和平台相關位置。

如要設定視窗的位置、大小和限制,請使用 innerBoundsouterBounds 屬性。內界線不包含視窗裝飾。外側界線包括視窗的標題列和框架。請注意,內外邊界之間的邊框間距是由作業系統決定。因此,為內外邊界設定相同屬性會視為錯誤 (例如同時設定 innerBounds.leftouterBounds.left)。

如要自動記憶視窗位置,可以為視窗提供 ID。如果視窗有 ID,系統會在視窗移動或調整大小時,使用這個 ID 記住視窗的大小和位置。之後以相同 ID 開啟視窗時,系統就會使用這個大小和位置,而非指定的界線。如要在非預設記憶位置開啟具有 ID 的視窗,可以先建立隱藏視窗,然後將其移至所需位置,再顯示視窗。

參數

傳回

  • Promise<AppWindow>

    Chrome 117 以上版本

    只有資訊清單 V3 以上版本支援 Promise,其他平台則需使用回呼。

current()

chrome.app.window.current(): AppWindow | undefined

傳回目前指令碼環境的 AppWindow 物件 (即 JavaScript「window」物件)。您也可以在其他網頁的指令碼內容控點上呼叫這個函式,例如:otherWindow.chrome.app.window.current()。

傳回

get()

chrome.app.window.get(
  id: string,
)
: AppWindow | undefined

取得具有指定 ID 的 AppWindow。如果沒有具有指定 ID 的視窗,則會傳回空值。這個方法是 Chrome 33 版的新功能。

參數

  • id

    字串

傳回

getAll()

chrome.app.window.getAll(): AppWindow[]

取得目前建立的所有應用程式視窗陣列。這個方法是 Chrome 33 版的新功能。

傳回

事件

onBoundsChanged

chrome.app.window.onBoundsChanged.addListener(
  callback: function,
)

視窗大小調整時觸發。

參數

  • callback

    函式

    callback 參數如下:

    () => void

onClosed

chrome.app.window.onClosed.addListener(
  callback: function,
)

視窗關閉時觸發。請注意,這項事件應從要關閉的視窗以外的視窗 (例如背景網頁) 監聽。這是因為事件觸發時,系統正在拆除要關閉的視窗,因此視窗指令碼環境中的所有 API 都無法運作。

參數

  • callback

    函式

    callback 參數如下:

    () => void

onFullscreened

chrome.app.window.onFullscreened.addListener(
  callback: function,
)

視窗全螢幕顯示時 (透過 AppWindow 或 HTML5 API)。

參數

  • callback

    函式

    callback 參數如下:

    () => void

onMaximized

chrome.app.window.onMaximized.addListener(
  callback: function,
)

視窗放到最大時觸發。

參數

  • callback

    函式

    callback 參數如下:

    () => void

onMinimized

chrome.app.window.onMinimized.addListener(
  callback: function,
)

視窗縮到最小時觸發。

參數

  • callback

    函式

    callback 參數如下:

    () => void

onRestored

chrome.app.window.onRestored.addListener(
  callback: function,
)

當視窗從最小化或最大化狀態還原時觸發。

參數

  • callback

    函式

    callback 參數如下:

    () => void