デザイン

ポイントパスはテンプレート レンダリングをサポートしています。テンプレートが定義されていない場合は、デフォルトのテンプレートが使用されます。

テンプレート

パス テンプレートはクラスレベルで定義され、クラスに関連付けられているオブジェクトを表示するために使用されます。テンプレートは、パスのさまざまなセクションに表示するフィールドを定義します。

テンプレートは次のセクションで構成されています。

カードタイトル

カードタイトル セクション

カードタイトル セクションには、カード発行会社のロゴと名前、プログラムのタイトルが表示されます。これらを読み込むのに使用されるフィールド参照やこれらの位置を変更することはできません。

カード テンプレート

カード テンプレート セクションは、追加行を表示するために使用します。これらの行には、テキストベースの構造化データ フィールドやテキスト モジュール フィールドを含めることができます。

行数を指定して class.classTemplateInfo.cardTemplateOverride.cardRowTemplateInfos[] リスト内のオブジェクト数を定義できます。このリストには要素を少なくとも 1 つ指定する必要があります。最大 2 つまで指定できます。各要素は、次のいずれかのタイプにする必要があります。

  • oneItem は、次の 1 つのアイテムを受け取ります。
    • item
  • twoItems は、次の 2 つのアイテムを受け取ります。
    • startItem
    • endItem
  • threeItems は、次の 3 つのアイテムを受け取ります。
    • startItem
    • midItem
    • endItem

各アイテムは、単一のフィールド セレクタ(.firstValue)、2 つのフィールド セレクタ(.firstValue.secondValue)、事前定義されたアイテム(.predefinedItem)として定義できます。選択したフィールドの値とそれぞれのラベルが両方とも表示されます。2 つのフィールド セレクタを定義した場合は、選択したフィールドの値がセパレータ「/」で区切られて表示されます。選択したフィールドのラベルについても同様です。さらに複雑なレンダリングを定義するには、事前定義されたアイテムを使用します。

アイテムが空の場合、そのアイテムは表示されません。詳細については、フィールド参照をご覧ください。行内のすべてのアイテムが空の場合、その行は表示されません。行内のすべてのアイテムではなく、一部のアイテムが空の場合は、空でないアイテムが再配置され、1 行に表示されるアイテム数が少なくなります。

カード テンプレートをオーバーライドしない場合は、デフォルトの行数、デフォルトのアイテム数、デフォルトのフィールド参照が使用されます。詳細については、デフォルト テンプレートをご覧ください。

ヒーロー画像が定義されている場合、cardRowTemplateInfos リストに複数の行が含まれているのであれば、最初の行の後にヒーロー画像が表示されます。行が 1 つのみの場合は、その行の上にヒーロー画像が表示されます。

カード バーコード

カード バーコード要素

カード バーコード セクションは、バーコードの上下に追加のテキストや画像を表示するために使用します。このセクションのフィールドは、どれも必須ではありません。

3 つのフィールド セレクタがあり、これらを使用して、バーコードの上に並ぶ 2 つのフィールドと、バーコードの下の 1 つのフィールドを定義できます。これらのフィールドはラベルなしで表示され、テキストベースの構造化データ フィールド、テキスト モジュール フィールド、画像モジュール フィールドのいずれかを選択できます。画像を使用する場合は、ブランド ガイドラインに従う必要があります。

バーコードはタイプと値で定義されます。サポートされているバーコード タイプのリストについては、リファレンスをご覧ください。また、テキストをバーコードの真下に表示できます。このテキストはバーコードのスキャンを補助するためのものですが、他の用途に使用することもできます。

バーコード セクションをオーバーライドしない場合は、デフォルトのバーコード フィールドが使用されます。詳細については、デフォルト テンプレートをご覧ください。

詳細テンプレート

詳細テンプレート セクション

詳細テンプレート セクションはアイテム class.classTemplateInfo.detailsTemplateOverride.detailsItemInfos[] のリストです。このアイテムには、あらゆる種類の構造化データ フィールド、テキスト モジュール フィールド、リンク モジュール フィールド、画像モジュール フィールド、メッセージを含めることができます。

各アイテムは、単一のフィールド セレクタ(.firstValue)、2 つのフィールド セレクタ(.firstValue.secondValue)、事前定義されたアイテム(.predefinedItem)として定義できます。選択したフィールドの値とそれぞれのラベルが両方とも表示されます。2 つのフィールド セレクタを定義した場合は、選択したフィールドの値がセパレータ「/」で区切られて表示されます。選択したフィールドのラベルについても同様です。さらに複雑なレンダリングを定義するには、事前定義されたアイテムを使用します。画像モジュール フィールドは、全幅、ラベルなしでレンダリングされます。

アイテムが空の場合、そのアイテムは表示されません。詳細については、フィールド参照をご覧ください。

詳細テンプレートをオーバーライドしない場合は、デフォルトの参照フィールドのリストがデフォルトの順番で表示されます。詳細については、デフォルト テンプレートをご覧ください。

リスト テンプレート

リスト テンプレート セクション

リスト テンプレート セクションは、Google Pay アプリの「パス」ビューに表示するフィールドを選択するために使用します。パスは、ロゴ、背景色、3 つの行を含むリストで表示されます。

3 つの行はフィールド セレクタで定義できます。これらのフィールドにはラベルが表示されません。

ラベル

すべての構造化データ フィールドには、Google 提供のラベルが使用されます。これらの各ラベルをサポートされているすべての言語に翻訳する作業は、Google が行います。

class.custom<name_of_the_field>Label フィールドのいずれかを使用して、これらのラベルの一部をカスタマイズできます。ユーザーがラベルをカスタマイズする場合、そのラベルをサポートするすべての言語に翻訳する作業は、ユーザー側で行う必要があります。

フィールド参照

フィールド参照は、テンプレートのさまざまな部分で、class.classTemplateInfo.*.fields[] の形式で使用されます。フィールド参照には、構造化データ フィールド、テキスト モジュール フィールド、リンク モジュール フィールド、画像モジュール フィールド、メッセージへのパスのリストが含まれます。

すべてのフィールド参照ですべての種類のパスを使用できるわけではありません。たとえば、一部のフィールド参照では、テキストベースの構造化データ フィールド、またはテキスト モジュール フィールドのパスだけが許可されています。テキストベースの構造化フィールドは、文字列、ローカライズされた文字列、日付、金額のタイプの構造化データ フィールドです。

このリストを使用すると、代替ロジックを実装することが可能になります。つまり、リスト内の最初のパスが空のフィールドとして解決された場合は、次のパスが評価されます。代替ロジックの主な対象は、テキストベースの構造化データ フィールドやテキスト モジュール フィールドです。同じリストに異なるタイプのフィールドを混在させないでください。一部のオブジェクトではフィールド パターンに一貫性があるが、他のオブジェクトではその一貫性が期待できない場合、代替ロジックは慎重かつ特定の状況でのみ使用してください。ほとんどの場合、ユースケースごとに個別のクラスを作成する方が簡単です。

フィールド参照リスト内のすべてのパスが空のフィールドとして解決された場合は、そのフィールド参照を使用するアイテムは表示されません。フィールド参照を使用するアイテムを常に表示する場合は、少なくとも 1 つのパスが空でないことを確認してください。フィールドによってはスペースを 1 つだけ含む文字列が許可されていることがありますが、そのような場合であっても、null 値を表すには、フィールドに「-」などの特殊文字を設定することをおすすめします。

リストに含まれているフィールドを参照するには、リスト内でのフィールドのインデックスを使用するか、参照 ID を使用します。ほとんどの場合、参照 ID を使用できます。ID で参照できるリストのアイテムには .id フィールドがあります。可能な限り、リスト内でのフィールドのインデックスではなく、参照 ID を使用することをおすすめします。

以下は、リストに含まれるフィールドを参照する方法の例です。

  • object.imageModulesData[0].id = my-first-id
  • object.imageModulesData[1].id = my-second-id
  • class.detailsTemplateOverride.detailsItemInfos[0].item.firstValue.fields[0].fieldPath = object.imageModulesData[‘my-second-id’]
  • class.detailsTemplateOverride.detailsItemInfos[1].item.firstValue.fields[0].fieldPath = object.imageModulesData[0]

この場合、パスの詳細セクション内の最初のアイテムは、オブジェクト内で宣言されている 2 番目の画像になります。パスの詳細セクションの 2 番目のアイテムが、オブジェクト内で宣言されている最初の画像です。

デフォルト テンプレート

デフォルト テンプレート セクション

画像モジュール フィールドには、クラスから 1 つ、オブジェクトから 1 つのみが表示されます。いずれかのレベルで複数の画像モジュール フィールドが必要な場合は、デフォルト テンプレートをオーバーライドします。

テキスト モジュール フィールドについては、クラスから最大 10 個、オブジェクトから最大 10 個のみが表示されます。これらのフィールドは、配列で定義されているのと同じ順序で表示されます。いずれかのレベルで 10 個を超えるテキスト モジュール フィールドが必要な場合は、デフォルト テンプレートをオーバーライドします。

メッセージについては、クラスから最大 10 個、オブジェクトから最大 10 個のみが表示されます。メッセージの順序は保証されていません。いずれかのレベルで 10 個を超えるメッセージが必要な場合や、順序を保証したい場合は、デフォルト テンプレートをオーバーライドします。

リンク モジュール フィールドでは、定義できる URI の数に制限はありません。URI は各レベル(クラスまたはオブジェクト)に対して次の順序でグループ化されて表示されます。

  1. 地図の座標
  2. 電話番号
  3. メールアドレス
  4. ウェブページ
各グループについて、URI は配列で定義されているのと同じ順序で表示されます。順序を変更する必要がある場合は、デフォルト テンプレートをオーバーライドします。

デフォルトのリスト テンプレート セクション