Google ウォレットには、イベント チケットや搭乗券からポイントカードやギフトカードまで、あらゆるパスの外観とレイアウトをカスタマイズできる強力なツールが用意されています。このガイドでは、カードの構造を定義し、ユーザー固有の動的な情報を表示することで、ユーザー エクスペリエンスをカスタマイズする方法について包括的に説明します。
開始する前に、パスタイプの特定の REST API リファレンス ドキュメントを参照して、使用可能なフィールドの完全なリストを確認してください。
基盤: cardTemplateOverride
パスのレイアウトをカスタマイズするための主なツールは classTemplateInfo.cardTemplateOverride オブジェクトです。これは、パスの Class リソース（EventTicketClass、LoyaltyClass）。このオブジェクトを使用すると、行とその中のアイテムを定義してパスを構造化し、情報の表示方法を制御できます。
Class リソース（すべてのユーザー間で共有される情報）と Object リソース（ユーザー固有の詳細）の両方のデータを参照できます。
1. 事前定義されたウォレット フィールドでカスタマイズする
事前定義されたフィールドは、特定のパスタイプに対して Google Wallet API で使用できる標準プロパティです。これらのフィールドには特定の名前があり、Wallet によって一貫した方法でレンダリングされます。バーコード、イベント名、フライト番号、ギフトカードの残高などが該当します。
これらの事前定義フィールドの fieldPath を参照することで、パスの任意の場所に配置できます。
例: バーコードとパス固有の詳細を表示する
このパスの例では、2 行目の内側に「Top row」と 3 つのデータ フィールドがあります。最初の項目には、Object からのユーザー固有の値（ポイントや座席番号など）が表示されます。2 つ目の項目には、Class の詳細（イベント名やロイヤリティ プログラムのティアなど）が表示され、3 つ目の項目には、Object のユーザー固有の値（セカンダリ ポイントやセクション / コーチ番号など）が再び表示されます。
クラスの定義:
...
"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",
...
オブジェクト定義
...
"loyaltyPoints": {
"balance": {
"string": "1500"
},
"label": "Points"
},
"secondaryLoyaltyPoints" : {
"balance": {
"money": {
"micros" : "28250000",
"currencyCode": "USD",
}
},
"label": "Balance"
}
...
日付と時刻のフィールドの形式を設定する
サポートされているパスの任意の日付または時刻フィールドで、dateFormat プロパティを使用してカスタム形式を指定できます。これにより、パスに表示する日付の形式（時刻のみ、日付と時刻、日付のみなど）を制御できます。dateFormat が指定されていない場合は、デフォルトの形式が使用されます。
"fields": [
{
"fieldPath": "object.validTimeInterval.start.date",
"dateFormat": "DATE_ONLY"
}
]
使用可能な形式の完全なリストについては、DateFormat のドキュメントをご覧ください。
2. デベロッパー定義のフィールドでカスタマイズする
Google ウォレットでは、textModulesData を使用して独自のカスタム データ フィールドを作成できるため、柔軟性が最大限に高まります。カスタムの短いメモ、メンバー特典、場所固有の詳細など、定義済みのフィールドに収まらない固有の情報を表示するのに最適です。
Object または Class で一意の id を持つ textModulesData 項目を定義し、cardTemplateOverride でその id を参照します。
構造カードの行
パスごとに 1 つ、2 つ、または 3 つのデータ項目を含むパスを設計して、情報を論理的に整理できます。追加できる行数に厳密な制限はありませんが、ユーザー エクスペリエンスを向上させるため、カードの表面に表示する最も重要な情報を検討してください。
- ベスト プラクティス: 補足情報については、パスの詳細ビューまたは
messages、linksModuleData、linkedOfferIdsなどの他のウォレット機能を使用します。これにより、メインのパスビューがすっきりします。
例: カスタムデータを含む 3 項目の行
カスタムの詳細を表示する行を作成します。ポイントカードの場合、ポイント、階層、残高などが考えられます。イベント チケットの場合は、「セクション」、「列」、「座席」などになります。
クラス定義:
cardTemplateOverride は、detail1、detail2、detail3 の 3 つの固有 ID を参照します。
...
"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",
オブジェクト定義:
Object は、各フィールドのデータと対応する ID を提供します。
...
"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"
}
]
...
バリエーションのクラスデータとオブジェクト データ
クラスレベルとオブジェクト レベルのデータを組み合わせて、動的でパーソナライズされたパスを作成できます。これは、同じパスの異なるバージョンを作成する場合に便利です。
- クラスレベルの
textModulesData: ユーザーのグループに共通する詳細情報（すべての VIP チケット所有者向けの「VIP へようこそ」メッセージなど）に使用します。 - オブジェクト レベルの
textModulesData: 1 人のユーザーに固有の詳細情報（「Jane さん、お席からの眺めは制限されています」）。
例: ティア固有のパスを表示する
イベントの「一般入場」と「VIP」、フライトの「エコノミー」と「ビジネス」など、さまざまなパスのバリエーションに対して、異なる Class リソースを作成できます。各クラスには、固有のデザイン（ヒーロー画像、色）とデフォルトのテキストを設定できます。
 |
 |
 |
| Silver から始まるメンバー | メンバーがゴールドにアップグレードされました | ダイヤモンド ステータスの別のメンバー |
パスの詳細ビューのコンテンツ
cardTemplateOverride で参照されている場合、linksModuleData、imageModulesData のフィールドはパスの前面にレンダリングされません。このコンテンツは [パスの詳細] ビュー（「パスの裏面」）に自動的に表示され、ユーザーはカスタマー サービスへのリンク、プロモーション画像、利用規約などの補足情報に簡単にアクセスできます。
3. カードの表面以外: その他のテンプレートのオーバーライド
classTemplateInfo オブジェクトは cardTemplateOverride 以外の機能も提供します。Google ウォレットの他の部分をカスタマイズして、パスをよりリッチで直感的に表示できます。
使用可能なすべてのオーバーライドの詳細については、ClassTemplateInfo リファレンス ドキュメントをご覧ください。
listTemplateOverride: Google ウォレット アプリのメインリスト ビューの行レイアウトをカスタマイズします。これにより、ユーザーがパスを開く前に最も重要なフィールドをハイライト表示できます。detailsTemplateOverride: 「パスの詳細」ビュー（パスの裏面）の行とレイアウトを構造化し、補足情報、リンク、テキストを柔軟に配置できるスペースを提供します。cardBarcodeSectionDetails: パスのバーコード セクションをカスタマイズできます。