syncfusion-wpf-datetimepicker

DateTimeEdit の実装（WPF）

マスク編集、カレンダー／時計のドロップダウン、日付範囲の制限、書式設定、MVVM バインディングに対応した、機能強化版の日付時刻入力コントロールです。

このスキルを使用する場面

次のような場合に、このスキルを使用します。

• WPF アプリケーションに日付／時刻の入力フィールドを追加する
• 選択した日付を ViewModel プロパティにバインドする（DateTime の双方向バインディング）
• 表示する日付／時刻の書式を設定する（定義済みパターンまたはカスタムパターン）
• 最小／最大範囲または選択不可日で選択可能な日付を制限する
• インライン編集を有効にする（マスクモードまたは自由形式のテキスト編集）
• カレンダー、時計、または両方を組み合わせたドロップダウンピッカーを表示する
• 日付が選択されていないときにウォーターマークテキストを表示する
• null の日付値を処理する
• CultureInfo によってロケール固有の日付書式を適用する
• ドロップダウンボタンのラベル（Today／None）をローカライズする

---

コンポーネントの概要

クラス	名前空間	アセンブリ
DateTimeEdit	Syncfusion.Windows.Shared	Syncfusion.Shared.WPF

XAML 名前空間：

xmlns:syncfusion="http://schemas.syncfusion.com/wpf"

NuGet：

Install-Package Syncfusion.Shared.WPF

---

ドキュメントとナビゲーションガイド

はじめに

📄 参照： references/getting-started.md

• アセンブリの設定と XAML 名前空間
• デザイナー、XAML、または C# による追加
• DateTime 値の設定
• DateTimeChanged イベントを使用した MVVM 双方向バインディング
• 定義済み Pattern のクイックリファレンス
• MinDateTime／MaxDateTime の基本
• SfSkinManager のテーマ設定

日時の編集

📄 参照： references/datetime-editing.md

• マスク編集（既定）— フィールド単位の入力と自動検証
• 日付／時刻フィールド間のキーボードナビゲーション
• 自由形式のテキスト編集（CanEdit="True"）
• マウスホイールによる値の変更（EnableMouseWheelEdit）
• 上下のリピートボタン（IsVisibleRepeatButton、IsEnabledRepeatButton）
• リピートボタン用のカスタム UI テンプレート
• アルファキーによる月の移動（EnableAlphaKeyNavigation）
• BackSpace／Delete キーによる編集
• フォーカス制御用の OnFocusBehavior と AutoForwarding

書式設定とカルチャ

📄 参照： references/formatting-and-culture.md

• 定義済み Pattern 値 11 種類
• Pattern="CustomPattern" を指定した CustomPattern
• DateTimeFormatInfo を使用した DateTimeFormat
• ロケール固有の書式設定用の CultureInfo
• PatternChanged／CustomPatternChanged イベント

ドロップダウンポップアップ

📄 参照： references/dropdown-popup.md

• DropDownView：Calendar／Clock／Combined
• キーボードショートカット（Alt+Down、F4）
• TodayButtonAction（Date または DateTime）
• IsEmptyDateEnabled — None ボタン／null にリセット
• AbbreviatedMonthNames／ShortestDayNames
• PopupDelay、IsButtonPopUpEnabled
• カスタム UI 用の DropDownButtonTemplate
• カスタムカレンダーと時計（SfDateSelector／SfTimeSelector）
• 時計用の TimeStepInterval

日付の制限と null 値

📄 参照： references/date-restrictions.md

• MinDateTime／MaxDateTime — 範囲外の選択を防止
• BlackoutDates — 特定の日付範囲を選択不可にする
• DisableDateSelection — 月／年のみの選択
• IsReadOnly — すべてのユーザー編集を禁止
• NullValue／IsEmptyDateEnabled／ShowMaskOnNullValue
• NoneDateText ウォーターマーク

外観

📄 参照： references/appearance.md

• Foreground、Background、SelectionBrush
• FocusedBorderBrush
• RTL 用の FlowDirection
• リピートボタンの背景と余白
• SfSkinManager のテーマ一覧

ローカライズ

📄 参照： references/localization.md

• CurrentUICulture の設定
• リソースファイルの命名規則：Syncfusion.Shared.Wpf.{culture}.resx
• Today／None ボタンラベルの Name／Value ペア
• フランス語カルチャの例

---

クイックスタートの例

<Window xmlns:syncfusion="http://schemas.syncfusion.com/wpf">
    <Window.DataContext>
        <local:ViewModel/>
    </Window.DataContext>
    <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
        <syncfusion:DateTimeEdit DateTime="{Binding SelectedDate, Mode=TwoWay}"
                                 Pattern="ShortDate"
                                 MinDateTime="01/01/2020"
                                 MaxDateTime="12/31/2030"
                                 Height="25" Width="200"
                                 Name="dateTimeEdit"/>
    </StackPanel>
</Window>

// ViewModel.cs
public class ViewModel : NotificationObject
{
    private DateTime _selectedDate = DateTime.Now;
    public DateTime SelectedDate
    {
        get => _selectedDate;
        set { _selectedDate = value; RaisePropertyChanged(nameof(SelectedDate)); }
    }
}

---

よくあるパターン

シナリオ	プロパティ／アプローチ
日付の双方向バインディング	DateTime="{Binding SelectedDate, Mode=TwoWay}"
カレンダーと時計を表示	DropDownView="Combined" Pattern="FullDateTime"
自由形式のテキスト編集	CanEdit="True"
日付のみの範囲制限	MinDateTime="..." MaxDateTime="..."
null を許可／値をクリア	IsEmptyDateEnabled="True" NullValue="{x:Null}" ShowMaskOnNullValue="False"
null のときに透かしテキストを表示	null 値のプロパティとともに NoneDateText="Select a date" を追加します
日付の表示をカスタマイズ	Pattern="CustomPattern" CustomPattern="dd-MMM-yyyy"
カルチャに応じた書式設定	CultureInfo="fr-FR" Pattern="FullDateTime"
読み取り専用入力	IsReadOnly="True"
RTL レイアウト	FlowDirection="RightToLeft"
テーマを適用	SfSkinManager.SetVisualStyle(dte, VisualStyles.FluentLight)

---

主なプロパティ

プロパティ	型	デフォルト	説明
DateTime	DateTime	DateTime.Now	選択した日付／時刻の値
Pattern	DateTimePattern	ShortDate	表示形式のパターン
CustomPattern	string	null	カスタム書式文字列（Pattern="CustomPattern" が必要です）
CultureInfo	CultureInfo	システムカルチャ	日付の書式設定に使用するロケール
CanEdit	bool	false	自由形式のテキスト編集を有効にします
MinDateTime	DateTime	DateTime.MinValue	選択可能な最小日付
MaxDateTime	DateTime	DateTime.MaxValue	選択可能な最大日付
DropDownView	DropDownViews	Calendar	ポップアップの内容：Calendar／Clock／Combined
IsEmptyDateEnabled	bool	false	null の日付値を許可します
NullValue	DateTime?	null	日付がクリアされたときの値
NoneDateText	string	""	値が null のときの透かしテキスト
ShowMaskOnNullValue	bool	true	null のときにマスクと透かしテキストのどちらを表示するかを指定します
IsReadOnly	bool	false	ユーザーによる編集を禁止します
IsVisibleRepeatButton	bool	false	上下のスピナーボタンを表示します
EnableMouseWheelEdit	bool	true	マウスホイールによる値の変更を許可します