ウィジェットの状態と組み込みの UI コンポーネント

ウィジェットの状態

ウィジェットボードにウィジェットが表示される場合、ウィジェットボードとアプリの現在の状態に応じて、ウィジェットが読み込まれているとき、ウィジェットがエラー状態のとき、またはユーザーがウィジェットレイアウトをカスタマイズしたときなど、いくつかの異なる状態があります。 一部の状態はアプリによって設計および実装され、他の状態は Widgets ホストに組み込まれます。 このセクションでは、各ウィジェットの状態を示し、説明します。 ウィジェットは明るいテーマと暗いテーマの両方をサポートするため、組み込みの状態とカスタマイズする状態の両方が現在のテーマによって異なる場合があることに注意してください。

既定の状態

既定の状態は、ウィジェットが正常に実行されている場合の外観です。 これは、ウィジェットの主要なユーザー エクスペリエンスです。 ウィジェットの既定の状態のレイアウトを設計します。 ウィジェットの既定の状態の UI はユーザーの構成に応じて変更される可能性がありますが、ウィジェットの既定の状態は完全に実装する必要があり、ユーザー構成の前に空にしないでください。 ウィジェットでユーザーがサインインする必要がある場合は、以下で説明するサインアウト状態を実装できます。 ウィジェットの既定の状態を作成するための設計ガイダンスについては、 ウィジェットの設計の基礎を参照してください。

DO

• ウィジェットは、既定のアクティブな状態では、パーソナルでユーザーとのつながりを感じられるものにすべきです。
• ウィジェットには、その時点でユーザーに価値をもたらす魅力的なコンテンツを表示する必要があります。
• ユーザーがウィジェットとの対話をすぐに開始できるようにします。
• 一貫性を最大限に高め、学習曲線を小さくするために、ウィジェットの設計上の制約内に留まりながら、アプリの UI を反映する UI を提供します。
• ユーザーの場所を使用して、一般的なデータではなく追加するスポーツや推奨カレンダーなどのコンテンツのデータを事前に設定することを検討してください。
• 要素間の十分な呼吸空間を許可します。

できません

• 一般的な商用向けオファーには、ウィジェットを使用してください。 コンテンツには、ユーザーの要望と意図が反映されている必要があります。
• 煩雑で複雑なレイアウトは避けます。

ひと目で確認してすぐ使える使い方を実現できるよう、各ウィジェットサイズ内では、見やすい情報密度と適切な余白を確保します。 含める情報が多い場合は、次のサイズを考慮して、より多くのコンテンツを表示することを検討してください。 また、ユーザーがそのコンテンツをぱっと見てどれだけ簡単に理解できるか、あるいは理解しにくいかについても考慮します。

エクスペリエンスを向上させるために、ウィジェットに驚きと喜びの瞬間を追加することを検討してください。 たとえば、家族ウィジェットやカレンダー ウィジェットでは、さまざまな視覚処理を使用して、子供の誕生日を強調表示できます。

これは、設計の柔軟性が最も高い状態です。 この記事のガイドラインに加えて、 ウィジェットの原則、 ウィジェットの設計の基礎、 ウィジェットの相互作用設計のガイダンス を使用して、コンテンツのレイアウト方法を設計します。

サインアウト状態 (認証が必要なウィジェットの場合)

一部のウィジェット シナリオでは、ユーザーがサインインするか、他のアクションを実行して、パーソナライズされたウィジェットコンテンツを表示する必要があります。 ユーザーがサインインしていない場合は、パーソナライズされていないコンテンツの提示を検討する必要があります。

エラー状態 - システムによって提供される

何らかの理由でウィジェットボードがウィジェットのレイアウトまたはデータを取得できない場合は、エラー状態が表示されます。 Windows、ウィジェット ヘッダーにエラー メッセージと再読み込みボタンが表示されます。 このメッセージは、すべてのウィジェットで同じように表示されます。

キャッシュされたコンテンツを表示できる場合、ウィジェット ヘッダーには、データが最後に更新された日時が次の形式で表示されます。

1. 1 時間未満の場合の分数
2. 1 時間を超える場合は、最も近い時間に切り上げる

キャッシュされたメッセージを最大 15 文字で表示すると、長いウィジェット パートナー名が切り捨てられます。

カスタマイズの状態

Windows アプリ SDK 1.4 以降では、ウィジェットは、ウィジェットの外観やウィジェットによって表示されるデータをカスタマイズするためのコントロールをユーザーに提供するカスタマイズ テンプレートを提供できます。 カスタマイズ UI は JSON テンプレートで定義されます。

組み込みのウィジェット UI コンポーネント

ウィジェットの一部の UI 要素はウィジェット エクスペリエンスに組み込まれており、これらの要素はウィジェット プロバイダーによってカスタマイズできませんが、これらの要素の内容と動作を認識することが重要です。

コンテキスト メニュー (システム提供)

ユーザーが右上の 3 点アイコンをクリックすると、コンテキスト メニューが表示されます。 このメニューを使用すると、ユーザーは好みのウィジェット サイズを選択し、ウィジェットの構成状態にアクセスできます。 パートナーは、同じテンプレート ウィジェット レジスタ "powered by ___" を使用します。

アトリビューション領域

属性領域は、ウィジェットの登録時に提供されるウィジェット名とアイコンに基づいてウィジェット ボードによってレンダリングされます。 ウィジェットの登録の詳細については、「 ウィジェット プロバイダー パッケージ マニフェスト XML 形式」を参照してください。