DateTimeEditors for UWP
手順2:コントロールのカスタマイズ
DateTimePicker for UWP > クイックスタート > 手順2:コントロールのカスタマイズ

前の手順では、C1DateTimePicker コントロールを使用して UWP スタイルのアプリケーションを作成しました。この手順では、コントロールの外観を変更します。

次の手順に従います。

  1. <DateTimeEditors:C1DateTimePicker/> タグに Height="60" を追加して、コントロールの高さを決定します。XAML マークアップは次のようになります。
    XAML マークアップ
    コードのコピー
    <DateTimeEditors:C1DateTimePicker Height="60"/>
  2. <DateTimeEditors:C1DateTimePicker/> タグに Width="450" を追加して、コントロールの幅を決定します。XAML マークアップは次のようになります。
    XAML マークアップ
    コードのコピー
    <DateTimeEditors:C1DateTimePicker Height="60" Width="450"/>
  3. <DateTimeEditors:C1DateTimePicker/>タグに TimeFormat="ShortTime" を追加して、時刻書式を時間と分の領域だけで構成される短い書式に変更します。XAML マークアップは次のようになります。
    XAML マークアップ
    コードのコピー
    <DateTimeEditors:C1DateTimePicker Height="60" Width="450" TimeFormat="ShortTime"/>
  4. <DateTimeEditors:C1DateTimePicker/> タグに DateFormat="Long" を追加して、日付書式を曜日を含む長い書式に変更します。XAML マークアップは次のようになります。
    XAML マークアップ
    コードのコピー
    <DateTimeEditors:C1DateTimePicker Height="60" Width="450" TimeFormat="ShortTime" DateFormat="Long"/>
  5. <DateTimeEditors:C1DateTimePicker/> タグに FirstDayOfWeek="Wednesday" を追加します。これにより、ドロップダウンカレンダーの週の最初の曜日が水曜日に変更されます。XAML マークアップは次のようになります。
    XAML マークアップ
    コードのコピー
    <DateTimeEditors:C1DateTimePicker Height="60" Width="450" TimeFormat="ShortTime" DateFormat="Long" FirstDayOfWeek="Wednesday"/>

この手順では、C1DateTimePicker コントロールの外観をカスタマイズしました。次の手順では、プロジェクトを実行し、コントロールの機能を確認します。

関連トピック