Power Apps での 日付の選択 コントロール

  • [アーティクル]

ユーザーが日付を選択できるコントロール。

内容

テキスト入力 コ ントロールの代わりに日付の選択コントロールを追加すると、ユーザーが適切な形式で日付を指定しやすくなります。

主要なプロパティ

DefaultDate – ユーザーが変更しない限りの日付コントロールの初期値。

SelectedDate – 日付コントロールで現在選択されている日付。 この日付はローカル時間で表されます。

Format – コントロールで日付が表示され、ユーザーが日付を指定するテキスト形式。 このプロパティを ShortDate (既定) または LongDate に設定して、このコントロールのLanguageプロパティに基づいて日付を書式設定できます。 また、言語に関係なく同じ形式を使用する場合は、このプロパティを yyyy/mm/dd などの式に設定できます。 たとえば、次のようなものです。

  • ユーザーが 2017 年の最終日をクリックまたはタップする場合、コントロールには 12/31/2017 と表示され、Formatプロパティは ShortDate に、Languageプロパティは en-us に設定されます。
  • ユーザーが 2017 年の最終日をクリックまたはタップする場合、コントロールには dimanche 31 decembre 2017 と表示され、Formatプロパティは LongDate に、Languageプロパティは fr-fr に設定されます。

Language – 月の名前を含む、日付の書式を設定するために使用される言語を指定します。 このプロパティが指定されていない場合、ユーザーのデバイスの設定で言語が決まります。 サポートされる値には、"EN-us" および "FR" が含まれます。

追加のプロパティ

AccessibleLabel – スクリーン リーダー用のラベル。

BorderColor – コントロールの境界線の色。

BorderStyle – コントロールの境界線が実線、破線、点線、またはなしかどうか。

BorderThickness – コントロールの境界線の太さ。

Color – コントロールのテキストの色。

DateTimeZone – 日付を UTC またはユーザーのローカル時間で表示するかどうか。

DisplayMode – コントロールがユーザー入力を許可するか (編集)、データのみを表示するか (表示)、または無効にするか (無効) どうか。

DisabledBorderColor – コントロールの DisplayMode プロパティが無効に設定されている場合のコントロールの境界線の色。

DisabledColor – コントロールの DisplayMode プロパティが無効に設定されている場合のコントロール内のテキストの色。

DisabledFill – コントロールの DisplayMode プロパティが無効に設定されている場合のコントロールの背景色。

EndYear – ユーザーが日付の選択コントロールの値を設定できる最新の年。

Fill – コントロールの背景色。

FocusedBorderColor – コントロールがフォーカスされているときのコントロールの境界線の色。

FocusedBorderThickness – コントロールがフォーカスされているときのコントロールの境界線の太さ。

Font – テキストを表示するフォントのファミリーの名前。

FontWeight – コントロール内のテキストの太さ: 太字、中太、標準、または細字。

Height – コントロールの上端と下端間の距離。

IconFill – 日付の選択アイコンの前景色。

IconBackground – 日付の選択アイコンの背景色。

InputTextPlaceholder – 日付が入力されていない場合に表示される説明テキスト。

IsEditable – 日付の選択テキストを編集できるかどうか。 false の場合、日付はカレンダーを使用してのみ変更できます。

Italic – コントロール内のテキストを斜体にするかどうか。

OnSelect – ユーザーがコントロールをタップまたはクリックしたときに実行するアクション。

OnChange – ユーザーがコントロールの値を変更したときに実行するアクション。

OnChange および OnSelect 間の違い: OnSelect および OnChange では、ユーザーのクリックによって変更が発生する場合に、同じユーザー アクションでトリガーされます。この場合、OnSelect は OnChange の前にトリガーします。

PaddingBottom – コントロール内のテキストとそのコントロールの下端間の距離。

PaddingLeft – コントロール内のテキストとそのコントロールの左端間の距離。

PaddingRight – コントロール内のテキストとそのコントロールの右端間の距離。

PaddingTop – コントロール内のテキストとそのコントロールの上端間の距離。

Reset - 日付の選択 コントロールで DefaultDate の値をリセットする必要があるかどうか。

Size – コントロールに表示されるテキストのフォント サイズ。

StartOfWeek – 日付の選択コントロールの最初の日列に表示する曜日。

StartYear – ユーザーが日付の選択コントロールの値を設定できる最初の年。

TabIndex – 他のコントロールに関連するキーボード ナビゲーションの順序。

Visible – コントロールが表示されるか非表示になるか。

Width – コントロールの左端と右端間の距離。

X – コントロールの左端とその親コンテナー (親コンテナーがない場合は画面) の左端間の距離。

Y – コントロールの上端とその親コンテナー (親コンテナーがない場合は画面) の上端間の距離。

Year( DateTimeValue )

例

ベーシック日付選択

  1. 日付の選択コントロールを追加して、"Deadline" という名前を付けます。

    コントロールの追加、名前付け、構成 についてはこちらをご覧ください。

  2. ラベル コントロールを追加して、その Text プロパティを次の数式に設定します。

     DateDiff(Today(), Deadline.SelectedDate) & " days to go!"

    DateDiff 関数または その他の関数 については各関連記事を参照してください。

  3. F5 キーを押して Deadline の日付を選択して、OK を選択します。

    ラベル コントロールでは、当日から選択した日付までの日数が表示されます。

  4. 既定のワークスペースに戻るには、Esc キーを押します。

日付の選択をデフォルトの日付にリセット

  1. 日付の選択コントロールを追加して、"DateTimeReset" という名前を付けます。

    コントロールの追加、名前付け、構成 についてはこちらをご覧ください。

  2. ボタン コントロールを追加して、その OnChange プロパティを次の数式に設定します。

    Reset(DateTimeReset)

  3. F5 キーを押して DateTimeReset に新しい日付を選択して、OK を選択します。

  4. ボタンを押します。 日付は DefaultDate にリセットされます(今日)。

  5. 既定のワークスペースに戻るには、Esc キーを押します。

アクセシビリティのガイドライン

色のコントラスト

スクリーン リーダー サポート

  • AccessibleLabel が存在する必要があります。
  • IsEditable が true で、フォーマットがユーザーが求めるものではない場合、ラベル を追加して受け入れた日付の形式を説明します。

キーボードのサポート

  • TabIndex を 0 以上にして、キーボード ユーザーがそこに移動できるようにする必要があります。
  • フォーカス インジケーターは明確に表示する必要があります。 これを実現するには FocusedBorderColor および FocusedBorderThickness を使用します。

ヒント

カレンダーが開いているときに、Page up キーと Page down キーを押して月の間を移動し、Shift+Page up キーと Shift+Page down キーを押して年の間を移動します。

注意

ドキュメントの言語設定についてお聞かせください。 簡単な調査を行います。 (この調査は英語です)

この調査には約 7 分かかります。 個人データは収集されません (プライバシー ステートメント)。