skrypty powiązane z Dokumentami Google, Arkusze i Formularze mogą wyświetlać kilka typów elementów interfejsu użytkownika: gotowe alerty i prompty, a także okna i paski boczne, strony usługi HTML. Zazwyczaj te elementy otwieranych z poziomu pozycji menu. (Pamiętaj, że w Formularzach Google elementy interfejsu użytkownika są widoczne tylko dla edytującego, który otwiera formularz jego modyfikowanie, a nie użytkownikowi, który otwiera formularz, aby na nie odpowiedzieć).
Okna alertów
Alert to gotowe okno dialogowe, które można otworzyć w Dokumentach, Arkuszach Google
Prezentacje lub Edytor Formularzy. Wyświetla się komunikat i komunikat „OK”. (przycisk) tytuł,
(przyciski alternatywne są opcjonalne). Działa to podobnie do dzwonienia
window.alert()
w JavaScripcie po stronie klienta w przeglądarce.
Alerty zawieszają skrypt po stronie serwera na czas otwierania okna. Skrypt zostanie wznowione, gdy użytkownik zamknie okno, ale JDBC i nie utrzymują się przez cały czas jego zawieszenia.
Jak widać na przykładzie poniżej, Dokumenty, Formularze, Prezentacje Google
a Arkusze używają metody Ui.alert()
, która
jest dostępna w trzech wersjach. Aby zastąpić domyślne „OK” , prześlij
wartość z wyliczenia Ui.ButtonSet
jako argumentu buttons
. Aby ocenić, który przycisk został kliknięty przez użytkownika, porównaj
wartość zwrócona dla funkcji alert()
do funkcji
Wyliczenie Ui.Button
.
function onOpen() {
SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
.createMenu('Custom Menu')
.addItem('Show alert', 'showAlert')
.addToUi();
}
function showAlert() {
var ui = SpreadsheetApp.getUi(); // Same variations.
var result = ui.alert(
'Please confirm',
'Are you sure you want to continue?',
ui.ButtonSet.YES_NO);
// Process the user's response.
if (result == ui.Button.YES) {
// User clicked "Yes".
ui.alert('Confirmation received.');
} else {
// User clicked "No" or X in the title bar.
ui.alert('Permission denied.');
}
}
Okna z promptami
Prompt to gotowe okno, które otwiera się w Dokumentach, Arkuszach Google
Prezentacje lub Edytor Formularzy. Wyświetla się komunikat, pole do wprowadzania tekstu i „OK”.
(przycisk) tytuł i przyciski alternatywne są opcjonalne. Działa to podobnie do dzwonienia
window.prompt()
w JavaScripcie po stronie klienta w przeglądarce.
Pojawią się prośby o zawieszenie skryptu po stronie serwera na czas otwarcia okna. Skrypt zostanie wznowione, gdy użytkownik zamknie okno, ale JDBC i nie utrzymują się przez cały czas jego zawieszenia.
Jak widać na przykładzie poniżej, w Dokumentach Google jako w Formularzach, Prezentacjach i Arkuszach używana jest metoda Ui.prompt()
,
który jest dostępny w 3 wersjach. Aby zastąpić domyślne „OK” przycisk
przekaż wartość z Ui.ButtonSet
wyliczenie jako argument buttons
. Aby ocenić odpowiedź użytkownika, zarejestruj
zwraca wartość dla prompt()
, a następnie wywołaj
PromptResponse.getResponseText()
.
do pobierania danych wejściowych użytkownika i porównywania wartości zwracanej przez
PromptResponse.getSelectedButton()
do wyliczenia Ui.Button
.
function onOpen() {
SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
.createMenu('Custom Menu')
.addItem('Show prompt', 'showPrompt')
.addToUi();
}
function showPrompt() {
var ui = SpreadsheetApp.getUi(); // Same variations.
var result = ui.prompt(
'Let\'s get to know each other!',
'Please enter your name:',
ui.ButtonSet.OK_CANCEL);
// Process the user's response.
var button = result.getSelectedButton();
var text = result.getResponseText();
if (button == ui.Button.OK) {
// User clicked "OK".
ui.alert('Your name is ' + text + '.');
} else if (button == ui.Button.CANCEL) {
// User clicked "Cancel".
ui.alert('I didn\'t get your name.');
} else if (button == ui.Button.CLOSE) {
// User clicked X in the title bar.
ui.alert('You closed the dialog.');
}
}
Okna niestandardowe
Okno niestandardowe może wyświetlać użytkownika usługi HTML w edytorze Dokumentów, Arkuszy, Prezentacji lub Formularzy Google.
Okna niestandardowe nie zawieszają skryptu po stronie serwera, gdy jest ono otwarte.
Komponent po stronie klienta może wykonywać asynchroniczne wywołania skryptu po stronie serwera
za pomocą interfejsu API google.script
dla interfejsów usługi HTML.
Okno może się zamknąć, wywołując
google.script.host.close()
po stronie klienta w interfejsie usługi HTML. Okno nie może zostać zamknięte przez
za pomocą innych metod.
Jak widać na przykładzie poniżej, Dokumenty, Formularze, Prezentacje i Arkusze Google używają metody Ui.showModalDialog()
do otwierania okna.
Code.gs
function onOpen() { SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp. .createMenu('Custom Menu') .addItem('Show dialog', 'showDialog') .addToUi(); } function showDialog() { var html = HtmlService.createHtmlOutputFromFile('Page') .setWidth(400) .setHeight(300); SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp. .showModalDialog(html, 'My custom dialog'); }
Page.html
Hello, world! <input type="button" value="Close" onclick="google.script.host.close()" />
Niestandardowe paski boczne
Pasek boczny może wyświetlać użytkownika usługi HTML w interfejsie Dokumentów, Formularzy, Prezentacji i Arkuszy Google.
Paski boczne nie zawieszają skryptu po stronie serwera, gdy okno jest otwarte.
komponent po stronie klienta może wykonywać asynchroniczne wywołania skryptu po stronie serwera.
za pomocą interfejsu API google.script
dla interfejsów usługi HTML.
Pasek boczny może się zamknąć, wywołując
google.script.host.close()
po stronie klienta w interfejsie usługi HTML. Nie można zamknąć paska bocznego
za pomocą innych interfejsów, tylko przez użytkownika lub przez niego.
Jak widać na przykładzie poniżej, Dokumenty, Formularze, Prezentacje i Arkusze Google otwierają pasek boczny za pomocą metody Ui.showSidebar()
.
Code.gs
function onOpen() { SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp. .createMenu('Custom Menu') .addItem('Show sidebar', 'showSidebar') .addToUi(); } function showSidebar() { var html = HtmlService.createHtmlOutputFromFile('Page') .setTitle('My custom sidebar'); SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp. .showSidebar(html); }
Page.html
Hello, world! <input type="button" value="Close" onclick="google.script.host.close()" />
Okna dialogowe otwierania pliku
Selektor Google ma typ „file-open” okna z informacjami przechowywanymi Serwery Google, w tym Dysk Google, wyszukiwarka grafiki Google i Google Video Wyszukiwanie i inne funkcje.
Jak widać w przykładzie poniżej, można użyć interfejsu JavaScript API selektora po stronie klienta w usłudze HTML, by utworzyć niestandardowe okno, użytkownicy wybierają istniejące pliki lub przesyłają nowe, a następnie przekazują ten wybór z powrotem do skrypt do dalszego wykorzystania.
Aby włączyć selektor i uzyskać klucz interfejsu API, wykonaj te czynności:
- Sprawdź, czy Twój projekt skryptu korzysta ze standardowego projektu GCP.
- Włączanie interfejsu „Google Picker API” w projekcie Google Cloud.
- Jeśli Twój projekt Google Cloud jest nadal otwarty, wybierz Interfejsy API Usługi, a następnie kliknij Dane logowania.
- Kliknij Utwórz dane logowania > Klucz interfejsu API. To działanie powoduje utworzenie klucza, ale należy zmodyfikować klucz, aby dodać do klucza zarówno ograniczenia aplikacji, jak i ograniczenie interfejsu API.
- W oknie klucza interfejsu API kliknij Zamknij.
- Obok utworzonego klucza interfejsu API kliknij Więcej > Edytuj klucz interfejsu API.
W sekcji Ograniczenia aplikacji wykonaj te czynności:
- Wybierz Strony odsyłające HTTP (witryny internetowe).
- W sekcji Ograniczenia dostępu do stron kliknij Dodaj element.
- Kliknij Referrer i wpisz
*.google.com
. - Dodaj kolejny produkt i podaj
*.googleusercontent.com
jako stronę odsyłającą. - Kliknij Gotowe.
W sekcji Ograniczenia interfejsów API wykonaj te czynności:
- Wybierz Ogranicz klucz.
W sekcji Wybierz interfejsy API wybierz Google Picker API i kliknij OK.
Uwaga: interfejs Google Picker API nie jest widoczny, jeśli nie włączysz go, ponieważ na liście znajdują się tylko interfejsy API, które zostały włączone dla Cloud w projektach AI.
W sekcji Klucz interfejsu API kliknij Kopiuj do schowka .
U dołu strony kliknij Zapisz.