編輯器外掛程式的對話方塊和側欄

在大部分的編輯器外掛程式中， 對話方塊和側欄面板是主要的外掛程式使用者介面。 這兩種格式都能使用標準 HTML 和 CSS 完全自訂，你可以透過 Apps Script 用戶端與伺服器通訊模型 ，在使用者與側欄或對話方塊互動時執行 Apps Script 函式。 外掛程式可以定義多個側欄和對話方塊，但外掛程式可顯示 一次只能加入一個

想防止使用者與編輯器互動 在外掛程式介面中設定選項、使用對話方塊如果沒有，請使用 側欄中。

對話方塊

「對話方塊」是重疊於主要編輯器內容的視窗面板。Apps Script 是強制回應對話方塊使用者開啟後就無法與 也會更新編輯器介面的其他元素你可以自訂內容和大小 就如同對話框內

建立外掛程式對話方塊的方式與 Apps Script 相同 自訂對話方塊；一般 建議程序如下：

  1. 建立用於定義對話方塊 HTML 結構的指令碼專案檔案。 以及 CSS 和用戶端 JavaScript 的行為定義對話方塊時 「編輯器外掛程式樣式指南」中。
  2. 在要開啟對話方塊的伺服器端程式碼中，呼叫 HtmlService.createHtmlOutputFromFile(filename)敬上 建立 HtmlOutput 代表對話方塊的物件。或者，如果您 範本 HTML HtmlService.createTemplateFromFile(filename)敬上 產生範本 HtmlTemplate.evaluate() 轉換成 HtmlOutput 物件。
  3. 呼叫 Ui.showModalDialog(htmlOutput, dialogTitle) 即可顯示對話方塊 HtmlOutput。

對話方塊在開啟時，不會暫停伺服器端指令碼。 用戶端 JavaScript 可以在伺服器端發出非同步呼叫 使用 google.script.run() 和 相關的處理常式函式詳情請參閱 用戶端對伺服器通訊：

開啟檔案對話方塊

檔案開啟對話方塊是預先建立的對話方塊，可讓使用者選取檔案 存取 Google 雲端硬碟你可在外掛程式中新增開啟檔案對話方塊，而無需 需要特別設計，但需要進行一些額外設定以及 需要外掛程式的 Cloud Platform 專案 以啟用 Google Picker API。

詳情請參閱「檔案開啟對話方塊」。

側欄是顯示在編輯器介面右側的面板 是最常見的附加介面類型。有別於對話方塊，你可以繼續操作 側欄 開啟。側欄的寬度固定，但您可以自訂內容。

建立外掛程式側欄的方式與 Apps Script 相同 自訂側欄；一般 建議程序如下：

  1. 建立負責定義側欄 HTML 結構的指令碼專案檔案， 以及 CSS 和用戶端 JavaScript 的行為定義側欄時 「編輯器外掛程式樣式指南」中。

  2. 在要開啟側欄的伺服器端程式碼中，呼叫 HtmlService.createHtmlOutputFromFile(filename)敬上 建立 HtmlOutput 代表側欄的物件。或者，如果您 範本 HTML HtmlService.createTemplateFromFile(filename)敬上 產生範本 HtmlTemplate.evaluate() 轉換成 HtmlOutput 物件。

  3. 呼叫 Ui.showSidebar(htmlOutput) 用來顯示側欄 HtmlOutput。

側欄指令碼在開啟時不會暫停伺服器端指令碼， 用戶端 JavaScript 可以在伺服器端發出非同步呼叫 使用 google.script.run() 和 相關的處理常式函式詳情請參閱 用戶端對伺服器通訊：