syncfusion-wpf-domain-updown について
WPF 開発者向けに、定義済みの値を順に選択する Syncfusion の SfDomainUpDown コントロールの実装を解説します。データバインディング、外観、入力操作を扱います。
主な機能
- 01文字列やオブジェクトの循環選択
- 02ItemsSource によるデータバインディング
- 03コンテンツテンプレートのカスタマイズ
- 04スピンボタン位置の設定
- 05マウスホイールとキー操作への対応
活用シーン
- 01定義済み候補の選択 UI の作成
- 02複雑なオブジェクトの表示バインド
- 03ボタン位置やコントロールのスタイル調整
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ syncfusion/ wpf-ui-components-skills --skill syncfusion-wpf-domain-updownインストール後、Claude Code で/syncfusion-wpf-domain-updownを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
references/advanced-features.mdappearance-styling.mddata-population.mdgetting-started.mdspin-button-alignment.md詳細
Syncfusion WPF DomainUpDown の実装
Syncfusion® WPF DomainUpDown(SfDomainUpDown)コントロールの実装ガイドです。スピンボタン(増減矢印)を使って、あらかじめ定義された項目リストを順に切り替えられる、多用途な入力コントロールです。
このスキルを使用する場面
次のような場合に、このスキルを使用します。
- 項目選択用の DomainUpDown コントロールを実装する(スピンボタン付き)
- ユーザーが順に切り替えられる項目リストを設定する
- スピンボタンの位置をカスタマイズする(左、右、または両側)
- カスタム表示テンプレートを使って複雑なデータオブジェクトをバインドする
- コントロールの外観をスタイル設定し、テーマを適用する
- 最大値から最小値へ自動で折り返す動作を有効にする
- マウスホイールとキーボードのナビゲーション操作に対応する
- MVVM パターンに対応したデータ駆動型セレクターを作成する
コンポーネントの概要
SfDomainUpDown コントロールを使用すると、上下ボタンのクリック、マウスホイール、またはキーボード操作によって、あらかじめ定義された項目リストから値を選択できます。数値のアップダウンコントロールとは異なり、DomainUpDown では文字列、オブジェクト、カスタム型など、任意の種類のデータを扱えます。
主な機能:
ItemsSourceを使ったデータバインディング- 複雑なオブジェクトに対応するカスタムコンテンツテンプレート
- 設定可能なスピンボタンの配置(左、右、両側)
- 滑らかなスピンアニメーション
- 自動折り返し動作
- マウスホイールとキーボード操作
- 豊富なスタイル設定とテーマ設定のオプション
- MVVM に適したアーキテクチャ
必要なアセンブリ:
Syncfusion.SfInput.WPFSyncfusion.SfShared.WPF
ドキュメントとナビゲーションガイド
はじめに
📄 参照: references/getting-started.md
次のような場合に参照します。
- DomainUpDown コントロールをインストールして設定する
- デザイナーまたはコードからコントロールを追加する
- アセンブリの依存関係を確認する
- 最初の基本的な実装を作成する
Valueプロパティを設定する- 必要な名前空間をインポートする
データの設定とバインディング
📄 参照: references/data-population.md
次のような場合に参照します。
- 項目リストをコントロールに設定する
ItemsSourceプロパティを使ってデータをバインドする- データモデルと ViewModel を作成する
- カスタム表示に
ContentTemplateを使う - 複数のプロパティを持つ複雑なオブジェクトを表示する
- MVVM のデータバインディングパターンを実装する
スピンボタンの設定
📄 参照: references/spin-button-alignment.md
次のような場合に参照します。
- スピンボタンの位置をカスタマイズする
SpinButtonsAlignmentプロパティを使う- ボタンを右側に配置する(既定)
- ボタンを左側に配置する
- ボタンを両側に分けて配置する(減少ボタンは左、増加ボタンは右)
- UI に適した配置を選ぶ
外観とスタイル設定
📄 参照: references/appearance-styling.md
次のような場合に参照します。
- スピンアニメーションを有効または無効にする
AccentBrushを使ってアクセントカラーをカスタマイズするUpDownStyleを使って上下ボタンのスタイルを設定する- カスタムコントロールテンプレートを作成する
- 境界線、背景、前景を変更する
- フォントとレイアウトをカスタマイズする
- 包括的なカスタムテーマを構築する
高度な機能
📄 参照: references/advanced-features.md
次のような場合に参照します。
- 自動折り返し動作を有効にする
- マウスホイールによるスクロールに対応する
- キーボードナビゲーションを実装する
- エッジケースを確認する
- パフォーマンスを最適化する
→ 詳細な例と実装パターンについては、リファレンスファイルを参照してください。