Google は AI 技術を使用して、コンテンツをご希望の言語に翻訳しています。AI 翻訳には誤りが含まれる場合があります。

Google ウォレットのパスをカスタマイズする

Google ウォレットには、イベントチケットや搭乗券からポイントカードやギフトカードまで、あらゆるパスの外観とレイアウトをカスタマイズできる強力なツールが用意されています。このガイドでは、カードの構造を定義し、ユーザー固有の動的な情報を表示することで、ユーザーエクスペリエンスをカスタマイズする方法について包括的に説明します。

開始する前に、パスタイプの特定の REST API リファレンスドキュメントを参照して、使用可能なフィールドの完全なリストを確認してください。

基盤: `cardTemplateOverride`

パスのレイアウトをカスタマイズするための主なツールは classTemplateInfo.cardTemplateOverride オブジェクトです。このオブジェクトは、パスの Class リソース（EventTicketClass、LoyaltyClass など）で定義します。このオブジェクトを使用すると、行とその中のアイテムを定義してパスを構造化し、情報の表示方法を制御できます。

Class リソース（すべてのユーザー間で共有される情報）と Object リソース（ユーザー固有の詳細）の両方のデータを参照できます。

1. 事前定義されたウォレットフィールドでカスタマイズする

事前定義されたフィールドは、特定のパスタイプに対して Google Wallet API で使用できる標準プロパティです。これらのフィールドには特定の名前が付けられており、ウォレットで一貫した方法でレンダリングされます。たとえば、バーコード、イベント名、フライト番号、ギフトカードの残高などがあります。

これらの事前定義フィールドの fieldPath を参照することで、パスの任意の場所に配置できます。

例: バーコードとパス固有の詳細を表示する

このパスの例では、2 行目の内側に「Top row」と 3 つのデータフィールドがあります。最初の項目には、Object からのユーザー固有の値（ポイントや座席番号など）が表示されます。2 番目の項目には、Class の詳細（イベント名やロイヤリティプログラムのティアなど）が表示され、3 番目の項目には、Object のユーザー固有の値（セカンダリポイントやセクション / コーチ番号など）が再び表示されます。

事前定義済みフィールド

クラスの定義:

...
"classTemplateInfo": {
      "cardTemplateOverride": {
        "cardRowTemplateInfos": [
          {
            "twoItems": {
              "startItem": {
                "firstValue": {
                  "fields": [
                    {
                    "fieldPath": "object.accountName",
                    }
                  ]
                }
              },
              "endItem": {
                "firstValue": {
                  "fields": [
                    {
                      "fieldPath": "object.secondaryLoyaltyPoints.label"
                    },
                    {
                      "fieldPath": "object.secondaryLoyaltyPoints.balance"
                    }
                  ]
                }
              }
            }
          },
          {
            "twoItems": {
              "startItem": {
                "firstValue": {
                  "fields": [
                    {
                      "fieldPath": "object.loyaltyPoints.label"
                    },
                    {
                      "fieldPath": "object.loyaltyPoints.balance"
                    }
                  ]
                }
              },
              "endItem": {
                "firstValue": {
                  "fields": [
                    {
                      "fieldPath": "class.rewardsTierLabel"
                    },
                    {
                      "fieldPath": "class.rewardsTier"
                    }
                  ]
                }
              }
            }
          },
        ]
      }
    }
...
"rewardsTier": "Gold",
"rewardsTierLabel": "Tier",
...

オブジェクト定義

...
"accountName": "Camille Walsh",
"loyaltyPoints": {
    "balance": {
        "string": "1500"
    },
    "label": "Points"
},
"secondaryLoyaltyPoints" : {
    "balance": {
        "money": {
            "micros" : "35050000",
            "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": [
        {
            "twoItems": {
              "startItem": {
                "firstValue": {
                  "fields": [
                    {
                    "fieldPath": "object.accountName",
                    }
                  ]
                }
              },
              "endItem": {
                "firstValue": {
                  "fields": [
                    {
                     "fieldPath": "object.textModulesData['mem_since']",
                    }
                  ]
                }
              }
            }
          },
          {
            "twoItems": {
              "startItem": {
                "firstValue": {
                  "fields": [
                    {
                      "fieldPath": "object.loyaltyPoints.label"
                    },
                    {
                      "fieldPath": "object.loyaltyPoints.balance"
                    }
                  ]
                }
              },
              "endItem": {
                "firstValue": {
                  "fields": [
                    {
                      "fieldPath": "class.rewardsTierLabel"
                    },
                    {
                      "fieldPath": "class.rewardsTier"
                    }
                  ]
                }
              }
            }
          },
          {
            "twoItems": {
              "startItem": {
                "firstValue": {
                  "fields": [
                    {
                      "fieldPath": "object.secondaryLoyaltyPoints.label"
                    },
                    {
                      "fieldPath": "object.secondaryLoyaltyPoints.balance"
                    }
                  ]
                }
              },
              "endItem": {
                "firstValue": {
                  "fields": [
                    {
                      "fieldPath": "object.textModulesData['visits']",
                    }
                  ]
                }
              }
            }
          },
        ]
      }
    }
...
"rewardsTier": "Gold",
"rewardsTierLabel": "Tier",

オブジェクト定義: Object は、各フィールドのデータと対応する ID を提供します。

...
"accountName": "Camille Walsh",
"loyaltyPoints": {
    "balance": {
        "string": "1500"
    },
    "label": "Points"
},
"secondaryLoyaltyPoints" : {
    "balance": {
        "money": {
            "micros" : "28250000",
            "currencyCode": "USD",
        }
    },
    "label": "Balance"
},
"textModulesData": [
{
    "header": "Visits",
    "body": "17",
    "id": "visits"
  },
  {
    "header": "Member since",
    "body": "Mar 01, 2024",
    "id": "mem_since"
  },
]
...

バリエーションのクラスデータとオブジェクトデータ

クラスレベルとオブジェクトレベルのデータを組み合わせて、動的でパーソナライズされたパスを作成できます。これは、同じパスの異なるバージョンを作成する場合に便利です。

クラスレベルの textModulesData: ユーザーのグループに共通する詳細情報（すべての VIP チケット所有者向けの「VIP へようこそ」メッセージなど）に使用します。
オブジェクトレベルの textModulesData: 1 人のユーザーに固有の詳細情報（「Jane 様、お席からの眺めは制限されています」など）に使用します。

例: ティア固有のパスを表示する

イベントの「一般入場」と「VIP」、フライトの「エコノミー」と「ビジネス」など、パスのバリエーションごとに異なる Class リソースを作成できます。各クラスには、独自のデザイン（ヒーロー画像、色）とデフォルトのテキストを設定できます。


Silver から始まるメンバー	メンバーがゴールドにアップグレードされました	ダイヤモンドステータスの別のメンバー

パスの下部セクションのコンテンツ

cardTemplateOverride で参照されている場合、linksModuleData、imageModulesData のフィールドはレンダリングされません。このコンテンツはパスの下部に自動的に表示され、ユーザーはカスタマーサービスへのリンク、プロモーション画像、利用規約などの補足情報に簡単にアクセスできます。

3. カードの表面以外: その他のテンプレートのオーバーライド

classTemplateInfo オブジェクトは cardTemplateOverride 以外の機能も提供します。Google ウォレットの他の部分をカスタマイズして、パスをよりリッチで直感的に表示できます。

使用可能なすべてのオーバーライドの詳細については、ClassTemplateInfo リファレンスドキュメントをご覧ください。

listTemplateOverride: Google ウォレットアプリのメインリストビューの行レイアウトをカスタマイズします。これにより、ユーザーがパスを開く前に最も重要なフィールドをハイライト表示できます。
detailsTemplateOverride: パスの下部セクションの行とレイアウトを構造化し、補足情報、リンク、テキストを柔軟に配置できるスペースを提供します。
cardBarcodeSectionDetails: パスのバーコードセクションをカスタマイズできます。