Okna i paski boczne dla dodatku Edytor

W większości dodatku do edycji okna dialogowe i panele paska bocznego to podstawowe interfejsy użytkownika. Oba te formaty można w pełni dostosować za pomocą standardowego kodu HTML i CSS. Apps Script model komunikacji klient-serwer aby uruchamiać funkcje Apps Script, gdy użytkownik wejdzie w interakcję z paskiem bocznym lub oknem. Dodatek może zdefiniować wiele pasków bocznych i okien, ale może on wyświetlać tylko jeden naraz.

Jeśli chcesz uniemożliwić użytkownikowi interakcję z edytorem, dopóki nie dokonasz wyboru w interfejsie dodatku, wyświetli się okno dialogowe; w przeciwnym razie użyj na pasku bocznym.

Okna

Okna to panele okienne, które są nakładane na zawartość głównego edytora. Apps Script, okna dialogowe mają charakter modalny, gdy są one otwarte, użytkownik nie może wchodzić w interakcję z z pozostałymi elementami interfejsu edytora. Możesz dostosować zawartość i rozmiar okien dialogowych.

Okna dodatków tworzy się w taki sam sposób, jak w przypadku Apps Script. okna niestandardowe; ogólne zalecana procedura jest następująca:

  1. Utwórz plik projektu skryptu, który definiuje strukturę HTML okna, CSS i zachowanie JavaScriptu po stronie klienta. Definiując okno dialogowe, zapoznaj się z artykułem ze wskazówkami dotyczącymi stylu dodatków do edycji.
  2. W kodzie po stronie serwera w miejscu, w którym chcesz otworzyć okno, wywołaj polecenie HtmlService.createHtmlOutputFromFile(filename) aby utworzyć HtmlOutput reprezentujący okno dialogowe. Ewentualnie, jeśli używasz szablon HTML, HtmlService.createTemplateFromFile(filename). aby wygenerować szablon, HtmlTemplate.evaluate(). aby przekonwertować go na HtmlOutput.
  3. Zadzwoń pod numer Ui.showModalDialog(htmlOutput, dialogTitle) aby wyświetlić to okno HtmlOutput

Otwarte okna nie zawieszają skryptu po stronie serwera. JavaScript po stronie klienta może wykonywać asynchroniczne wywołania po stronie serwera przy użyciu: google.script.run() i powiązane funkcje obsługi. Więcej informacji: Komunikacja między serwerami.

Okna dialogowe otwierania pliku

Okna dialogowe otwierania plików to gotowe okna umożliwiające użytkownikom wybranie plików. z Dysku Google. Możesz dodać do dodatku okno otwartego pliku bez konieczności który trzeba zaprojektować, ale wymaga dodatkowej konfiguracji. Dodatkowo wymagają dostępu do dodatku Projekt Cloud Platform aby włączyć interfejs Google Picker API.

Szczegółowe informacje znajdziesz w artykule Okna dialogowe otwierania pliku.

Paski boczne to panele widoczne po prawej stronie interfejsu edytora. są najczęściej spotykanym typem interfejsu dodatków. W przeciwieństwie do okien dialogowych, możesz kontynuować umożliwia interakcję z innymi elementami interfejsu edytora, gdy pasek boczny jest otwartego. Paski boczne mają stałą szerokość, ale możesz dostosować ich zawartość.

Dodatki tworzy się w taki sam sposób jak w przypadku Apps Script. niestandardowe paski boczne; ogólne zalecana procedura jest następująca:

  1. Utwórz plik projektu skryptu definiującego strukturę HTML paska bocznego CSS i zachowanie JavaScriptu po stronie klienta. Definiując pasek boczny, zapoznaj się z artykułem zgodnie ze wskazówkami dotyczącymi stylu dodatków do edycji.

  2. W kodzie po stronie serwera, w którym chcesz otworzyć pasek boczny, wywołaj polecenie HtmlService.createHtmlOutputFromFile(filename) aby utworzyć HtmlOutput reprezentujący pasek boczny. Ewentualnie, jeśli używasz szablon HTML, HtmlService.createTemplateFromFile(filename). aby wygenerować szablon, HtmlTemplate.evaluate(). aby przekonwertować go na HtmlOutput.

  3. Zadzwoń pod numer Ui.showSidebar(htmlOutput) aby wyświetlić pasek boczny HtmlOutput

Paski boczne nie zawieszają skryptu po stronie serwera, gdy są otwarte. JavaScript po stronie klienta może wykonywać asynchroniczne wywołania po stronie serwera przy użyciu: google.script.run() i powiązane funkcje obsługi. Więcej informacji: Komunikacja między serwerami.