次の方法で共有


ウィジェットヘッダー領域をカスタマイズする

最新リリースでは、Windows ウィジェットを実装するアプリは、ウィジェット ボードにウィジェット用に表示されるヘッダーをカスタマイズして、既定のプレゼンテーションをオーバーライドできます。 ヘッダーのカスタマイズは、ウィジェット プロバイダーから OS に渡すアダプティブ カード ペイロードに実装されるため、ウィジェット プロバイダーが実装されている言語に関係なく、手順は同じです。 ウィジェット プロバイダーを作成するチュートリアルについては、「 C# Windows アプリでウィジェット プロバイダーを実装 する」または「 Win32 アプリ (C++/WinRT)でウィジェット プロバイダーを実装する」を参照してください。

既定のヘッダー

既定では、ウィジェット ヘッダーには、アプリ マニフェスト ファイルで指定された表示名とアイコンが表示されます。 表示名は Definition 要素の DisplayName 属性で指定され、アイコンは ThemeResources の下の Icon 要素で指定されます。 ウィジェット アプリ マニフェスト ファイル形式の詳細については、「 ウィジェット プロバイダー パッケージ マニフェスト XML 形式」を参照してください。

次の例は、既定のプレゼンテーションを使用するウィジェットのアダプティブ カード JSON ペイロードの一部を示しています。 以下のセクションでは、このテンプレートを変更して既定のヘッダーをオーバーライドする例を示します。

{ 
    "type": "AdaptiveCard", 
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", 
    "version": "1.6", 
    "body": [
        ...
    ] 
  } 

表示名の文字列をオーバーライドする

ウィジェット ホストに送信する前に、JSON ペイロードの新しい表示名を使用して フィールドを追加することで、アプリ マニフェストの header 要素で指定された値をオーバーライドできます。

次の例では、表示名の文字列をオーバーライドする方法を示します。

{ 
    "type": "AdaptiveCard", 
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", 
    "version": "1.6", 
    "body": [
        ...
    ] ,
    "header": "Redmond Weather"
  } 

表示名の文字列とアイコンをオーバーライドする

表示名文字列とアプリ マニフェストで指定されたアイコンの両方をオーバーライドするには、headertextのフィールドを含むiconUrl オブジェクトを追加します。

次の例では、表示名の文字列とアイコンをオーバーライドする方法を示します。

{ 
    "type": "AdaptiveCard", 
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", 
    "version": "1.6", 
    "body": [
        ...
    ] ,
    "header": { 
         "text": "Redmond weather", 
         "iconUrl": "https://contoso.com/weatherimage.png" 
      } 
  } 

ヘッダーを空に設定する

一部のウィジェット プロバイダーは、ウィジェットのこの領域が操作できない場合でも、完全な UX をウィジェットのヘッダー領域に拡張できるようにしたい場合があります。 このシナリオでは、 header 感を nullに設定することで、ヘッダーを空に設定できます。 ヘッダー内の UX はユーザーがクリックできない点に注意してください。

次の例は、空のヘッダーを設定する方法を示しています。

{ 
    "type": "AdaptiveCard", 
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", 
    "version": "1.6", 
    "body": [
        ...
    ] ,
    "header": null
}