Bu sayfada, bir kart veya iletişim kutusundaki widget'ların nasıl biçimlendirileceği ve yapılandırılacağı açıklanmaktadır mesajını alırsınız.
Chat uygulamaları için JSON kart mesajları tasarlayıp önizlemek üzere Kart Oluşturucu'yu kullanın:
Kart Oluşturucu'yu açınÖn koşullar
Etkileşimli özellikler için etkinleştirilmiş bir Google Chat uygulaması. Bir aşağıdaki hızlı başlangıç kılavuzlarından birini kullanarak oluşturmak istediğiniz uygulama mimarisinde:
- Google Cloud Functions ile HTTP hizmeti
- Google Apps Komut Dosyası
- Google Cloud Dialogflow CX
- Google Cloud Pub/Sub
Kartları ve iletişim kutularını sütunlarda göster
İlgili içeriği oluşturmak için kullanılan
columns
widget'ı
Bir kartta veya iletişim kutusunda en fazla 2 sütun gösterir. Ekleyebileceğiniz:
ekleyebilirsiniz. widget'lar ilk sıraya alındıklarında belirtiliyor.
2'den fazla sütun eklemek veya satırları kullanmak için grid
widget'ını kullanın.
Her bir sütunun yüksekliği, uzun sütuna göre belirlenir. Örneğin, ilk sütun ikinci sütundan daha uzunsa, her iki sütunda da yüksekliğini görebilirsiniz. Her sütun farklı bir sayı içerebileceği için durumda satır tanımlayamaz veya widget'ları sütunlar arasında hizalayamazsınız.
Aşağıdaki örnekte, şu özelliklere sahip bir columns
widget'ı içeren bir kart gösterilmektedir:
2 metin sütunu. Yalnızca sütun düzenini görüntülemek ve kodu daraltmak için
Daralt'ı tıklayın.
Aşağıdaki örnekte olduğu gibi alan kısıtlı olduğunda
ikinci sütun ilk sütunun altında sarmalanır.
Bir sütunun genişliğini tanımlama
Sütunlar yan yana görüntülenir. Her sütunun genişliğini özelleştirebilirsiniz.
her bir arama terimi için
horizontalSizeStyle
alanı.
Kullanıcının ekran genişliği çok darsa ikinci sütun ilk sütunun altına yerleştirilir:
- Web'de, ekran genişliği şundan küçük veya bu değere eşitse ikinci sütun sarmalanır: 480 piksel.
- iOS cihazlarda, ekran genişliği 300 nk'e eşittir.
- Android cihazlarda, ekran genişliği şundan daha azsa ikinci sütun sarmalanır: veya 320 dp'ye eşit olmalıdır.
Aşağıdaki örnekte, şu özelliklere sahip bir columns
widget'ı içeren bir kart gösterilmektedir:
Sütunlarda 4 öğe bulunan 2 metin sütunu. Sütunlardaki her öğe
Metnin ne kadar alanını işlemek için horizontalSizeStyle
uygulandı
her bir sütunu doldurur:
- İlk metin paragrafında %30'dan fazla dolgu yapılmaması için
FILL_MINIMUM_SPACE
kullanılıyor genişliğine göre değişiklik gösterir. - İkinci metin paragrafı, mevcut
FILL_AVAILABLE_SPACE
boşluk ekleyin. Bu örnekte, müşterinin isteğine bağlı olarak dokunun. - Üçüncü metin paragrafı
horizontalSizeStyle
öğesini tanımlamaz, bu nedenle varsayılan olarak kullanabilirsiniz. - Dördüncü metin paragrafında %30'dan fazla doldurmamak için
FILL_MINIMUM_SPACE
kullanılıyor genişliğine göre değişiklik gösterir.
Bir sütunun yatay hizalamasını tanımlama
Widget'ları bir sütunun soluna, sağına veya ortasına yatay olarak hizalayabilirsiniz.
tanımlamak
horizontalAligment
alanı.
horizontalAlignment
alanı tanımlanmamışsa widget'lar
sol sütunda.
Aşağıdaki örnekte, bir sütundaki metni yatay olarak sola hizalar:
Aşağıdaki örnekte, ortadaki bir sütun içindeki metni yatay olarak hizalar:
Aşağıdaki örnekte, bir sütundaki metni yatay olarak sağa hizalar:
Bir sütunun dikey hizalamasını tanımlama
Widget'ları bir sütunun üst, alt veya ortasına dikey olarak hizalayabilirsiniz.
tanımlamak
verticalAlignment
alanı.
verticalAlignment
alanı tanımlanmamışsa bir sütundaki widget'lar hizalanır
dokunun.
Aşağıdaki örnekte, bir sütundaki metin dikey olarak en üste hizalanır:
Aşağıdaki örnek, ortadaki bir sütun içindeki metni dikey olarak hizalar:
Aşağıdaki örnekte, en alttaki sütun içindeki metni dikey olarak hizalar:
Widget'lar arasına yatay ayırıcı ekleyin
İlgili içeriği oluşturmak için kullanılan
divider
widget'ı
bir kartın genişliğini kapsayan yatay bir çizgi görüntüler
widget'ların dikey olarak yığılmasına olanak tanır. Çizgi, birbirinden farklı şekillerde
Kullanıcılar widget'ları birbirinden ayırt ederek kartları kolayca tarayabilirler
anlıyoruz.
Aşağıda, diğer reklam öğesi türleri arasında divider
widget'ından oluşan bir kart
widget'lar:
Öğe koleksiyonunu içeren bir tablo görüntüleme
İlgili içeriği oluşturmak için kullanılan
grid
widget'ı
öğe koleksiyonunu içeren bir ızgara görüntüler. Izgara, istenilen sayıda
emin olmaktır. Satır sayısı, öğelerin sütunlara bölünmesiyle belirlenir.
10 öğe ve 2 sütun içeren bir ızgarada 5 satır vardır. 11 öğe ve 2 öğe içeren bir tablo
sütununda 6 satır var.
Widget, kullanıcıların tek tip veri girmesine yardımcı olan önerileri destekler ve
değişim üzerine yapılan işlemlerdir.
Actions
metin girişi alanında bir değişiklik gerçekleştiğinde (ör. kullanıcı ekleme işlemi veya
metin siliniyor.
Aşağıdaki örnekte, tek bir öğe içeren 2 sütunlu bir ızgara gösterilmektedir:
Izgarada metnin resimle birlikte nerede görüneceğini tanımlayın
İlgili içeriği oluşturmak için kullanılan
gridItemLayout
alan
her bir gridItem
içinde metnin yukarıda mı, yoksa altında mı görüneceğini tanımlamanızı sağlar
ızgarada görebilirsiniz. gridItemLayout
tanımlanmazsa metin varsayılan olarak
ızgaradaki öğenin altında görünür
Aşağıdaki örnekte, metin ve resim içeren 3 sütunlu bir ızgara tıklayın. İlk ızgara, resmin üzerinde görünecek metni tanımlar, ikinci ızgara ızgara, resmin altında görünecek metni tanımlar, üçüncü ızgara ise metnin konumu.
Kullanıcı arayüzü öğelerine kenarlık ekleyin
column
veya grid
widget'ında görünen öğeler için şunlara kenarlık ekleyebilirsiniz:
tanımlayarak bu kullanıcı arayüzü öğelerini
borderType
alanı
ve
borderStyle
alanına dokunun.
Herhangi bir borderStyle
alanı tanımlanmamışsa varsayılan olarak kenarlık gösterilmez. Şunları yapabilirsiniz:
bir widget'taki tüm öğelere uygulanacak bir borderType
tanımlayın veya stili uygulayın
otomatik olarak ekler.
Aşağıdaki örnekte, her ızgarada bir resim içeren 2 sütunlu bir ızgara verilmiştir. kenarlık türü, stil ve renk, kapsamdaki tüm öğelere uygulanacak şekilde ızgara.
Aşağıdaki örnekte, her ızgarada bir resim ve
kenarlık stili ve türü ayrı ayrı tanımlanır. İlk
resmin STROKE
olarak tanımlanmış bir sınırı var. İkinci resmin kenarlığı
NO_BORDER
Üçüncü resimde tanımlı bir kenarlık yoktur.
Sorun giderme
Bir Google Chat uygulaması veya card bir hata döndürürse Chat arayüzünde "Bir sorun oluştu" mesajı gösteriliyor. veya "İsteğiniz işlenemiyor." Chat kullanıcı arayüzü herhangi bir hata mesajı görüntülenmiyor ancak Chat uygulaması veya kart beklenmeyen bir sonuç veriyorsa; Örneğin karttaki bir mesajda görünür.
Chat kullanıcı arayüzünde hata mesajı görüntülenmese de Hataları düzeltmenize yardımcı olmak için açıklayıcı hata mesajları ve günlük verileri sunulur Chat uygulamaları için hata günlük kaydı etkinleştirildiğinde. Görüntüleme konusunda yardım için ve hataları düzeltme ile ilgili daha fazla bilgi edinmek için Google Chat hatalarını giderme ve düzeltme
İlgili konular
columns
horizontalSizeStyle
horizontalAligment
verticalAlignment
divider
grid
gridItemLayout
borderStyle
borderType