Google Cüzdan, etkinlik biletlerinden ve biniş kartlarından bağlılık ve hediye kartlarına kadar tüm kartların görünümünü ve düzenini özelleştirmek için güçlü araçlar sunar. Bu kılavuzda, kartın yapısını tanımlayarak ve dinamik, kullanıcıya özel bilgiler göstererek kullanıcı deneyimini nasıl özelleştirebileceğiniz hakkında kapsamlı bir genel bakış sunulmaktadır.
Başlamadan önce, kullanılabilir alanların tam listesini görmek için kart türünüze özel REST API referans belgelerine göz atın.
Vakıf: cardTemplateOverride
Kartın düzenini özelleştirmek için kullanılan birincil araç, kartın Class kaynağında (ör.classTemplateInfo.cardTemplateOverride EventTicketClass, LoyaltyClass). Bu nesne, satırları ve satırlardaki öğeleri tanımlayarak kartı yapılandırmanıza olanak tanır. Böylece, bilgilerin nasıl sunulacağı üzerinde kontrol sahibi olursunuz.
Hem Class kaynağındaki (tüm kullanıcılarla paylaşılan bilgiler için) hem de Object kaynağındaki (kullanıcıya özel ayrıntılar için) verilere başvurabilirsiniz.
1. Önceden tanımlanmış Cüzdan alanlarıyla özelleştirme
Önceden tanımlanmış alanlar, belirli bir kart türü için Google Cüzdan API'sinde bulunan standart özelliklerdir. Bu alanların belirli adları vardır ve Cüzdan tarafından tutarlı bir şekilde oluşturulur. Örnek olarak barkod, etkinlik adı, uçuş numarası veya hediye kartı bakiyesi verilebilir.
Bu önceden tanımlanmış alanların fieldPath değerine referans vererek bunları kartınızda istediğiniz yere yerleştirebilirsiniz.
Örnek: Barkod ve karta özel ayrıntıları gösterme
Bu kart örneğinde "Üst satır" ve 2. satırda 3 veri alanı bulunuyor. İlk öğede, kullanıcının Object puanları veya kullanıcıya özel koltuk numarası gibi belirli değerleri gösterilir. İkinci öğe, Class içindeki ayrıntıları (ör. etkinlik adı veya bağlılık programı katmanı) gösterir. Üçüncü öğe ise Object içindeki kullanıcıya özel değerleri (ör. ikincil puan veya bölüm / antrenör numarası) gösterir.
Sınıf Tanımı:
...
"classTemplateInfo": {
"cardTemplateOverride": {
"cardRowTemplateInfos": [
{
"threeItems": {
"startItem": {
"firstValue": {
"fields": [
{
"fieldPath": "object.loyaltyPoints.label",
"fieldPath": "object.loyaltyPoints.balance",
}
]
}
},
"middleItem": {
"firstValue": {
"fields": [
{
"fieldPath": "class.rewardsTierLabel",
"fieldPath": "class.rewardsTier",
}
]
}
},
"endItem": {
"firstValue": {
"fields": [
{
"fieldPath": "object.secondaryLoyaltyPoints.label",
"fieldPath": "object.secondaryLoyaltyPoints.balance",
}
]
}
}
}
},
]
}
}
...
"rewardsTier": "Gold",
"rewardsTierLabel": "Tier",
...
Nesne Tanımı
...
"loyaltyPoints": {
"balance": {
"string": "1500"
},
"label": "Points"
},
"secondaryLoyaltyPoints" : {
"balance": {
"money": {
"micros" : "28250000",
"currencyCode": "USD",
}
},
"label": "Balance"
}
...
Tarih ve Saat Alanlarını Biçimlendirme
Desteklenen kartlardaki herhangi bir tarih veya saat alanı için dateFormat özelliğini kullanarak özel bir biçim belirtebilirsiniz. Bu ayar, kartta tarihin nasıl gösterileceğini (ör. yalnızca saat, tam tarih ve saat veya yalnızca tarih) kontrol etmenize olanak tanır. dateFormat belirtilmezse varsayılan bir biçim kullanılır.
"fields": [
{
"fieldPath": "object.validTimeInterval.start.date",
"dateFormat": "DATE_ONLY"
}
]
Kullanılabilir biçimlerin tam listesi için DateFormat dokümanlarına bakın.
2. Geliştirici Tarafından Tanımlanan Alanlarla Özelleştirme
Google Cüzdan, textModulesData kullanarak kendi özel veri alanlarınızı oluşturmanıza olanak tanıyarak en üst düzeyde esneklik sunar. Bu alan, önceden tanımlanmış alanlara uymayan benzersiz bilgileri (ör. özel kısa notlar, üyelere sunulan avantajlar veya konuma özgü ayrıntılar) göstermek için idealdir.
Object veya Class içinde benzersiz bir id ile textModulesData öğesi tanımlar, ardından cardTemplateOverride içinde bu id öğesine referans verirsiniz.
Kart satırlarını yapılandırma
Kart başına bir, iki veya üç veri öğesi içeren kartlar tasarlayarak bilgileri mantıksal olarak düzenleyebilirsiniz. Ekleyebileceğiniz satır sayısıyla ilgili kesin bir sınır yoktur ancak sorunsuz bir kullanıcı deneyimi için kartın ön yüzünde gösterilecek en önemli bilgileri göz önünde bulundurun.
- En İyi Uygulama: Ek bilgiler için kart ayrıntıları görünümünü veya
messages,linksModuleDataya dalinkedOfferIdsgibi diğer Cüzdan özelliklerini kullanın. Bu sayede ana kart görünümü düzenli kalır.
Örnek: Özel veriler içeren üç öğeli satır
Özel ayrıntıları göstermek için bir satır oluşturun. Bağlılık kartı için bu bilgiler puanlar, katman ve bakiye olabilir. Etkinlik biletleri için "Bölüm", "Sıra" ve "Koltuk" olabilir.
Sınıf Tanımı:
cardTemplateOverride, üç benzersiz kimliğe (detail1, detail2 ve detail3) referans veriyor.
...
"classTemplateInfo": {
"cardTemplateOverride": {
"cardRowTemplateInfos": [
{
"oneItem": {
"item": {
"firstValue": {
"fields": [
{
"fieldPath": "object.accountName",
}
]
}
}
}
},
{
"threeItems": {
"startItem": {
"firstValue": {
"fields": [
{
"fieldPath": "object.loyaltyPoints.label",
"fieldPath": "object.loyaltyPoints.balance",
}
]
}
},
"middleItem": {
"firstValue": {
"fields": [
{
"fieldPath": "class.rewardsTierLabel",
"fieldPath": "class.rewardsTier",
}
]
}
},
"endItem": {
"firstValue": {
"fields": [
{
"fieldPath": "object.secondaryLoyaltyPoints.label",
"fieldPath": "object.secondaryLoyaltyPoints.balance",
}
]
}
}
}
},
{
"threeItems": {
"startItem": {
"firstValue": {
"fields": [
{
"fieldPath": "object.textModulesData['row1left']",
}
]
}
},
"middleItem": {
"firstValue": {
"fields": [
{
"fieldPath": "object.textModulesData['row1mid']"
}
]
}
},
"endItem": {
"firstValue": {
"fields": [
{
"fieldPath": "object.textModulesData['row1right']"
}
]
}
}
}
},
{
"twoItems": {
"startItem": {
"firstValue": {
"fields": [
{
"fieldPath": "object.textModulesData['mem_since']",
}
]
}
},
"endItem": {
"firstValue": {
"fields": [
{
"fieldPath": "object.textModulesData['park']",
}
]
}
}
}
},
]
}
}
...
"rewardsTier": "Gold",
"rewardsTierLabel": "Tier",
Nesne Tanımı:
Object, her alan için verileri ve ilgili kimlikleri sağlar.
...
"accountName": "Lorenaisabel Aliwarringlen",
"loyaltyPoints": {
"balance": {
"string": "1500"
},
"label": "Points"
},
"secondaryLoyaltyPoints" : {
"balance": {
"money": {
"micros" : "28250000",
"currencyCode": "USD",
}
},
"label": "Balance"
},
"textModulesData": [
{
"header": "Visits",
"body": "17",
"id": "row1left"
},
{
"header": "Rides",
"body": "259",
"id": "row1mid"
},
{
"header": "Park hours",
"body": "140",
"id": "row1right"
},
{
"header": "Member since",
"body": "Mar 01, 2017",
"id": "mem_since"
},
{
"header": "Parking",
"body": "Included (Free)",
"id": "park"
}
]
...
Varyasyonlar için Sınıf ve Nesne Verileri
Dinamik ve kişiselleştirilmiş kartlar oluşturmak için sınıf düzeyindeki ve nesne düzeyindeki verileri birleştirebilirsiniz. Bu özellik, aynı kartın farklı versiyonlarını oluştururken kullanışlıdır.
- Sınıf düzeyi
textModulesData: Bir grup kullanıcı için aynı olan ayrıntılar (ör. tüm VIP bilet sahiplerine yönelik "VIP'ye hoş geldiniz" mesajı) için bu seçeneği kullanın. - Nesne düzeyi
textModulesData: Tek bir kullanıcıya özgü ayrıntılar için (ör. "Jane, koltuğunuzun görüş açısı sınırlı").
Örnek: Katmana özel kartları gösterme
Farklı kart varyasyonları için farklı Class kaynakları oluşturabilirsiniz. Örneğin, bir etkinlik için "Genel Giriş" ve "VIP" veya bir uçuş için "Ekonomi" ve "Business" gibi. Her sınıfın benzersiz bir tasarımı (ana resim, renk) ve varsayılan metni olabilir.
 |
 |
 |
| Silver ile başlayan üyelik | Üye, Altın seviyesine yükseltildi | Elmas seviyesindeki başka bir üye |
Kart ayrıntıları görünümündeki içerik
linksModuleData, imageModulesData alanları, cardTemplateOverride içinde referans verildiğinde kartın ön yüzünde oluşturulmaz. Bu içerik, Kart Ayrıntıları görünümünde (kartın "arka yüzü") otomatik olarak gösterilir. Böylece kullanıcılar, müşteri hizmetleri bağlantılarına, promosyon resimlerine, hüküm ve koşullara ve diğer ek bilgilere daha kolay erişebilir.
3. Kart Yüzünün Ötesinde: Diğer Şablon Geçersiz Kılmaları
classTemplateInfo nesnesi, cardTemplateOverride'den daha fazlasını sunar. Google Cüzdan deneyiminin diğer kısımlarını özelleştirerek kartlarınızı daha zengin ve sezgisel bir şekilde sunabilirsiniz.
Mevcut tüm geçersiz kılmalarla ilgili ayrıntılı bilgi için ClassTemplateInfo referans belgelerine bakın.
listTemplateOverride: Google Cüzdan uygulamasının ana liste görünümündeki satır düzenini özelleştirir. Böylece, kullanıcı kartını açmadan önce en önemli alanları vurgulayabilirsiniz.detailsTemplateOverride: "Kart ayrıntıları" görünümünün (kartın arkası) satırlarını ve düzenini yapılandırarak ek bilgiler, bağlantılar ve metin için esnek bir alan sağlar.cardBarcodeSectionDetails: Karttaki barkod bölümünü özelleştirmenizi sağlar.