syncfusion-maui-scheduler について
Syncfusion の .NET MAUI Scheduler を実装するためのガイドです。カレンダーやリソース予約画面を開発する人向けに、表示形式、予定の操作、カスタマイズを扱います。
主な機能
- 019 種類のカレンダー・タイムライン表示
- 02繰り返し予定と例外処理
- 03リソースのグループ化と階層管理
- 04ドラッグ、サイズ変更、予定エディター
- 05タイムゾーンと ICS のインポート・エクスポート
活用シーン
- 01.NET MAUI のカレンダーアプリ開発
- 02会議室、スタッフ、機器の予約管理
- 03プロジェクトのタイムライン作成
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ syncfusion/ maui-ui-components-skills --skill syncfusion-maui-schedulerインストール後、Claude Code で/syncfusion-maui-schedulerを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
references/advanced-features.mdappointment-interactions.mdappointments.mdday-week-views.mdgetting-started.mdlocalization.mdmonth-agenda-views.mdnavigation-restrictions.mdresources-calendars.mdtimeline-views.md詳細
スケジューラーの実装
Syncfusion .NET MAUI Scheduler(SfScheduler)は、予定を効率的に表示・管理するための、9 種類の組み込みビューを備えた包括的なスケジューリングコンポーネントです。日、週、稼働週、月、アジェンダ、タイムラインの各ビューをサポートし、繰り返し予定、ドラッグ&ドロップ、サイズ変更、階層型リソース管理、ICS のインポート/エクスポート、アダプティブ UI、フローティングアクションボタン、クイック情報テンプレート、タイムゾーンサポートなどの機能を備えています。
このスキルを使用する場面
次のような場合に、このスキルを使用してください。
- .NET MAUI でスケジュール管理アプリやカレンダーアプリを作成する
- さまざまな期間(日、週、月)にわたる予定を表示する
- 複雑なパターンの繰り返しイベントを実装する
- リソースベースのスケジューリングシステム(会議室、従業員、機器)を構築する
- リソースを階層型(ツリー)構造に整理する
- 同じ時間帯で予定が重複しないように制限する
- 時間スロットのセル内に主目盛りと副目盛りを描画する
- iCalendar(ICS)標準を使用して予定をエクスポート/インポートする
- 月ビューで予定の描画高さを調整する
- 予定エディターをプログラムから開く(追加、編集、削除、クイック情報)
- 予定に合わせて拡張するアダプティブなリソース行を構築する
- 月ビュー内にインラインのアジェンダペインを表示する
- Windows/macOS でモバイルスタイルのドロワーやヘッダーを実現するアダプティブ UI を有効にする
- タイムライン月ビューとアジェンダビューに週番号を表示する
- アジェンダビューをモバイルまたはデスクトップのレイアウトに固定する
- 月ビューのセル内の日付テキスト形式をカスタマイズする
- 新しい予定を作成するフローティングアクションボタンを追加する
- デフォルトのクイック情報ポップアップをカスタムテンプレートに置き換える
- アジェンダビューの空の日(週ヘッダー)テンプレートをカスタマイズする
- アジェンダビューの日付ヘッダーテンプレートをカスタマイズする
- プロジェクト計画や横方向のスケジューリング用にタイムラインビューを作成する
- 予定のドラッグ&ドロップやサイズ変更を追加する
- 複数のタイムゾーンに対応した予定管理を実装する
- カスタムの予定エディターやツールチップを作成する
- アジェンダビューや月間カレンダーを構築する
- 予定のリマインダーと通知を処理する
- 複数のカレンダー種別(グレゴリオ暦、ヒジュラ暦など)をサポートする
- 大規模な予定データセット向けにオンデマンド読み込みを実装する
コンポーネントの概要
Scheduler コントロールには、次の機能があります。
- 9 種類の組み込みビュー:日、週、稼働週、月、アジェンダ、タイムライン日、タイムライン週、タイムライン稼働週、タイムライン月
- 予定の種類:通常、終日、複数日にまたがる予定、例外処理に対応した繰り返し予定
- インタラクティブな機能:ドラッグ&ドロップ、サイズ変更、カスタムエディター、ツールチップ、セル選択
- リソース管理:階層型グループ化、アダプティブな行の高さ、デスクトップ向けアダプティブ UI に対応した複数リソース
- 高度な機能:タイムゾーン、ローカライズ、オンデマンド読み込み、リマインダー、特別な時間帯、ICS のインポート/エクスポート、プログラムから開くエディターポップアップ、フローティングアクションボタン
- カスタマイズ:柔軟なスタイル設定、テンプレート、勤務時間、日付の制限、月と副目盛りの時刻形式、日付文字列の形式、モバイル/デスクトップのアジェンダレイアウト
ドキュメントとナビゲーションガイド
はじめに
📄 参照: references/getting-started.md
ユーザーが次の操作を行う場合:
- Syncfusion .NET MAUI Scheduler をインストールしてセットアップする
- MauiProgram.cs でスケジューラーハンドラーを登録する
- 基本設定で最初のスケジューラーを作成する
- スケジューラーに簡単な予定を追加する
- ビューモードと基本プロパティを理解する
- 初期プロジェクト構成をセットアップする
- 必要な NuGet パッケージをインポートする
予定の管理
📄 参照: references/appointments.md
次のことが必要な場合:
- 予定を作成して設定する
- カスタム業務オブジェクトを予定にマッピングする
- 通常の予定、終日予定、または期間をまたぐ予定を実装する
- パターン(日単位、週単位、月単位、年単位)を指定して繰り返し予定を作成する
- 繰り返しルール(RRULE 構文)を使用する
- 繰り返しの例外(特定の回をスキップまたは変更)を処理する
- 予定のプロパティ(件名、メモ、場所、色)をカスタマイズする
- 予定ソースをカスタムデータコレクションにバインドする
- 予定の描画順を理解する
日表示、週表示、稼働週表示
📄 参照: references/day-week-views.md
次のことが必要な場合:
- 日表示、週表示、または稼働週表示を設定する
- 表示する日数を設定する
- 時間枠の間隔をカスタマイズする
- 時間目盛りと時刻ラベルを設定する
- 時間目盛りの主目盛りと補助目盛りを設定する
- 勤務時間と勤務時間外を設定する
- 特別な時間帯(時間枠のブロック)を作成する
- 時間枠の表示をカスタマイズする
- 日表示の終日パネルで、終日予定の高さをカスタマイズする
- 日表示の終日パネルまたは時間枠セル内に、24時間を超える予定を表示する
- ビューヘッダーを設定する
- 時間枠のサイズとカスタマイズを処理する
タイムライン表示
📄 参照: references/timeline-views.md
次のことが必要な場合:
- タイムラインの日表示、週表示、稼働週表示、または月表示を実装する
- 横方向の時間軸に予定を表示する
- タイムライン表示で表示する日数を設定する
- タイムラインの時間枠の間隔を設定する
- ビューポートの高さをカスタマイズする
- タイムライン表示の時間目盛りと主目盛り/補助目盛りを設定する
- 横方向のスケジュールインターフェースを作成する
- タイムラインの月表示に特別な時間帯を追加する
- タイムライン表示でスクロールとナビゲーションを処理する
月表示と予定一覧表示
📄 参照: references/month-agenda-views.md
次のことが必要な場合:
- 予定を含む月表示を設定する
- 月表示のセルの外観をカスタマイズする
- 月表示のセル内に予定をインライン表示する
- 月表示のセル内にある各予定の描画高さを調整する
- 月表示のセル内の日付番号のテキスト形式をカスタマイズする
- 月のグリッドの下に月間予定一覧パネルを表示し、選択した日付の予定を一覧表示する
- 月表示の日付テキストの配置を設定する
- 予定をリスト形式で表示する予定一覧表示を設定する
- 予定一覧表示をモバイルまたはデスクトップのレイアウトに固定する
- 予定一覧表示の日付と時刻の形式をカスタマイズする
- 予定一覧表示で、予定がない週を非表示にする
- 予定一覧表示の空の日のプレースホルダーまたは日付ヘッダーにカスタムテンプレートを指定する
- 週ごとの予定のグループ化を処理する
- 選択した日付の表示を設定する
- 月表示のインジケーターをカスタマイズする
- 異なる表示モードを組み合わせる
予定の操作
📄 参照: references/appointment-interactions.md
次のことが必要な場合:
- 予定のドラッグ&ドロップを有効にする
- 予定のサイズ変更を許可する
- カスタム予定エディターを作成する
- コードから追加、編集、削除、またはクイック情報のポップアップをプログラムで開く
- 予定のツールチップを設定する
- カスタムの
DataTemplateを使用してクイック情報のポップアップをカスタマイズする - 予定追加エディターを開くフローティングアクションボタンを表示する
- 同じ時間帯で予定が重複しないように制限する
- セル選択を実装する
- 選択時の表示をカスタマイズする
- 操作イベント(タップ、ドラッグ、サイズ変更)を処理する
- 特定の操作を無効にする
- カスタムエディターフォームを作成する
リソースとカレンダーの種類
📄 参照先: references/resources-calendars.md
次のことを行う必要がある場合:
- リソースベースのスケジュール管理(部屋、従業員、機器)を実装する
- 複数のリソースを追加して設定する
- リソースごとに予定をグループ化する
- Windows と macOS の月表示でリソースをグループ化する
- Android と iOS の月表示で適応型のリソースグループ化を有効にする
- タイムライン表示用の階層型(親子)リソースツリーを構築する
- デスクトッププラットフォーム(Windows、macOS)で適応型 UI(モバイルスタイルのドロワー)を使用する
- 各リソースの行が最も高い予定に合わせて自動調整されるよう、適応型の行の高さを使用する
- リソースのヘッダーと外観をカスタマイズする
- 異なるカレンダーの種類(グレゴリオ暦、ヒジュラ暦)を実装する
- カレンダーシステムを切り替える
- リソース固有の予定を処理する
ナビゲーションと日付の制限
📄 参照先: references/navigation-restrictions.md
次のことを行う必要がある場合:
- プログラムによる日付ナビゲーションを実装する
- 日付の最小値と最大値を設定する
- 特定の日付を超えるナビゲーションを防止する
- ヘッダー表示と日付形式をカスタマイズする
- 表示の切り替え(日、週、月など)を処理する
- ナビゲーションボタンを設定する
- タッチやスワイプによるナビゲーションを有効または無効にする
- カスタムのナビゲーションコントロールを実装する
高度な機能
📄 参照先: references/advanced-features.md
次のことを行う必要がある場合:
- 大規模なデータセット向けにオンデマンド読み込みを実装する
- 予定のリマインダーを設定する
- 複数のタイムゾーンを処理する
- タイムゾーン間で予定を変換する
- 予定コレクションを iCalendar(
.ics)ファイルにエクスポートする - iCalendar(
.ics)ファイルから予定をインポートする - タイムライン月表示とアジェンダ表示で ISO 週番号を表示する
- スケジューラーのイベント(Tapped、SelectionChanged、ViewChanged)を使用する
- 視覚効果を高めるためにリキッドグラス効果を実装する
- 予定の読み込みを効率的に処理する
- タイムスロットセルと予定にコンテキストメニューのサポートを追加する
- イベントとコマンドによる右クリック操作のサポートを有効にする
- ユーザー操作用のイベントハンドラーを作成する
ローカライズ
📄 参照先: references/localization.md
次のことを行う必要がある場合:
- スケジューラー UI をさまざまな言語にローカライズする
- 日付と時刻の形式をカスタマイズする
- 文化圏固有の設定を構成する
- RTL(右から左)サポートを実装する
- 曜日名と月名をカスタマイズする
- 地域ごとの日付形式を処理する