İletişim pencereleri ve kenar çubuğu panelleri, Düzenleyici eklentilerinin çoğunun birincil kullanıcı arayüzleridir. Her ikisi de standart HTML ve CSS kullanılarak tamamen özelleştirilebilir. Kullanıcı kenar çubuğu veya iletişim kutusuyla etkileşim kurduğunda Apps Komut Dosyası işlevlerini çalıştırmak için Apps Komut Dosyası'nın istemci-sunucu iletişim modelini kullanabilirsiniz. Eklentiniz birden çok kenar çubuğu ve iletişim kutusu tanımlayabilir ancak aynı anda yalnızca bir tane görüntüleyebilir.
Kullanıcının eklenti arayüzünde belirli bir seçim yapana kadar düzenleyiciyle etkileşimde bulunmasını önlemek istiyorsanız iletişim kutusu kullanın. Aksi takdirde kenar çubuğu kullanın.
İletişim kutuları
İletişim kutuları, birincil düzenleyici içeriğinin üzerini kaplayan pencere panelleridir. Apps Komut Dosyası iletişim kutuları kalıcıdır; kullanıcı, açıldıklarında düzenleyici arayüzünün diğer öğeleriyle etkileşimde bulunamaz. İletişim kutularının içeriğini ve boyutunu özelleştirebilirsiniz.
Eklenti iletişim kutularını, Apps Komut Dosyası özel iletişim kutularıyla aynı şekilde oluşturursunuz. Önerilen genel prosedür şu şekildedir:
- İletişim kutunuzun HTML yapısını, CSS'sini ve istemci taraflı JavaScript davranışını tanımlayan bir komut dosyası proje dosyası oluşturun. İletişim kutusunu tanımlarken Düzenleyici Eklentisi stil yönergelerine bakın.
- İletişim kutusunun açılmasını istediğiniz sunucu tarafı kodunuzda
HtmlService.createHtmlOutputFromFile(filename)
çağrısı yaparak iletişim kutusunu temsil eden birHtmlOutput
nesnesi oluşturun. Alternatif olarak, şablonlu HTML kullanıyorsanız şablon oluşturmak içinHtmlService.createTemplateFromFile(filename)
çağrısı yapabilir ve ardındanHtmlTemplate.evaluate()
öğesiniHtmlOutput
nesnesine dönüştürebilirsiniz. HtmlOutput
kullanan iletişim kutusunu görüntülemek içinUi.showModalDialog(htmlOutput, dialogTitle)
numarasını çağırın.
İletişim kutuları, açıkken sunucu tarafı komut dosyasını askıya almaz. İstemci taraflı JavaScript, google.script.run()
ve ilişkili işleyici işlevlerini kullanarak sunucu tarafına eşzamansız çağrılar yapabilir. Daha fazla ayrıntı için İstemciden sunucuya iletişim bölümüne bakın.
Dosya açma iletişim kutuları
Dosya açma iletişim kutuları, kullanıcılarınızın Google Drive'larından dosya seçmelerine olanak tanıyan önceden oluşturulmuş iletişim kutularıdır. Eklentinize, tasarlamanız gerekmeden bir dosya açma iletişim kutusu ekleyebilirsiniz ancak bunun için bazı ek yapılandırma gereklidir. Google Picker API'yi etkinleştirmek için eklentinin Cloud Platform projesine de erişmeniz gerekir.
Tüm ayrıntılar için Dosya açma iletişim kutuları konusuna bakın.
Kenar çubukları
Kenar çubukları, düzenleyici arayüzünün sağ tarafında görünen panellerdir ve en yaygın eklenti arayüzü türüdür. İletişim kutularından farklı olarak, bir kenar çubuğu açıkken düzenleyici arayüzünün diğer öğeleriyle etkileşimde bulunmaya devam edebilirsiniz. Kenar çubuklarının genişliği sabittir, ancak kenar çubuklarının içeriğini özelleştirebilirsiniz.
Eklenti kenar çubuklarını, Apps Komut Dosyası özel kenar çubukları ile aynı şekilde oluşturursunuz. Genel önerilen prosedür şu şekildedir:
- Kenar çubuğunuzun HTML yapısını, CSS'sini ve istemci taraflı JavaScript davranışını tanımlayan bir komut dosyası proje dosyası oluşturun. Kenar çubuğunu tanımlarken Düzenleyici Eklentisi stil yönergelerine bakın.
Kenar çubuğunun açılmasını istediğiniz sunucu tarafı kodunuzda
HtmlService.createHtmlOutputFromFile(filename)
çağrısı yaparak kenar çubuğunu temsil eden birHtmlOutput
nesnesi oluşturun. Alternatif olarak, şablonlu HTML kullanıyorsanız şablon oluşturmak içinHtmlService.createTemplateFromFile(filename)
çağrısı yapabilir ve ardındanHtmlTemplate.evaluate()
öğesiniHtmlOutput
nesnesine dönüştürebilirsiniz.HtmlOutput
aracını kullanarak kenar çubuğunu görüntülemek içinUi.showSidebar(htmlOutput)
numaralı telefonu arayın.
Kenar çubukları, açıkken sunucu tarafı komut dosyasını askıya almaz. İstemci taraflı JavaScript, google.script.run()
ve ilişkili işleyici işlevlerini kullanarak sunucu tarafına eşzamansız çağrılar yapabilir. Daha fazla ayrıntı için İstemciden sunucuya iletişim bölümüne bakın.