syncfusion-maui-toolkit-effects-view

.NET MAUI エフェクトビュー（SfEffectsView）

リップル、ハイライト、選択、拡大縮小、回転のアニメーションなど、タッチ操作に応じたモダンな視覚効果を提供するコンテナーコントロールです。任意の MAUI ビューをラップして、プロフェッショナルなタッチフィードバックを追加し、ユーザーエクスペリエンスを向上させます。

このスキルを使用するタイミング

次のことが必要な場合は、必ずこのスキルを使用してください。

• ボタン、カード、リスト項目にリップル効果を追加する
• タッチ時や押下時のハイライトオーバーレイを実装する
• 視覚的なフィードバックを伴う選択インジケーターを作成する
• 操作時に拡大縮小アニメーション（拡大・縮小）を追加する
• インタラクティブな要素に回転効果を実装する
• あらゆる MAUI ビュー（Image、Label、Grid など）にタッチフィードバックを提供する
• 視覚的なフィードバックを伴うタッチイベント（タップ、長押し、タッチ開始・終了）を処理する
• 既存の UI 要素をインタラクティブな効果でラップする
• カスタムビューにボタンのような動作を実装する
• Material Design スタイルのリップル効果で UX を向上させる

コンポーネントの概要

SfEffectsView は、タッチ操作に応じて視覚効果を表示するラッパーコントロールです。

主な機能：

• 5 種類の効果： リップル、ハイライト、選択、拡大縮小、回転
• 3 種類のタッチ操作： TouchDown、TouchUp、LongPress
• カスタマイズ可能： アニメーション時間、色、拡大縮小率、回転角度
• 組み合わせ可能： 複数の効果を同時に適用
• イベント駆動型： AnimationCompleted、SelectionChanged、タッチイベント
• MVVM サポート： LongPressed、TouchDown、TouchUp のコマンドバインディング
• プログラム制御： コードから効果を適用する ApplyEffects() メソッドと Reset() メソッド

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

はじめに

📄 参照： references/getting-started.md

• NuGet パッケージのインストール（Syncfusion.Maui.Toolkit）
• MauiProgram.cs でのハンドラー登録
• XAML と C# による SfEffectsView の基本的な実装
• SfEffectsView へのコンテンツの追加（ビューのラップ）
• 最初のリップル効果の例

タッチ操作と効果の種類

📄 参照： references/interaction-and-effects.md

• タッチ操作の種類（TouchDownEffects、TouchUpEffects、LongPressEffects）
• リップル効果：広がる円のアニメーション
• ハイライト効果：単色のオーバーレイ
• 選択効果：選択状態を保持
• 拡大縮小効果：拡大・縮小アニメーション
• 回転効果：操作時にビューを回転
• 複数の効果の組み合わせ
• 効果のライフサイクルと動作

カスタマイズとスタイル設定

📄 参照： references/customization.md

• RippleAnimationDuration：リップルのタイミングをカスタマイズ
• ScaleAnimationDuration：拡大縮小の速度を制御
• RotationAnimationDuration：回転のタイミングを調整
• InitialRippleFactor：リップルの開始サイズを設定
• ScaleFactor：拡大率を制御（0.0-1.0+）
• HighlightBackground：ハイライトの色を変更
• RippleBackground：リップルの色をカスタマイズ
• SelectionBackground：選択色を設定
• Angle：回転角度（0-360）

機能と設定

📄 参照： references/features.md

• FadeOutRipple：広がりながらリップルをフェードアウト
• IsSelected：プログラムによる選択状態の設定
• ShouldIgnoreTouches：直接操作を無効化
• AutoResetEffects：タッチ終了時に効果を自動的に削除（Android/UWP）
• プラットフォーム固有の動作

イベントとハンドラー

📄 参照： references/events.md

• AnimationCompleted：効果の完了時に発生
• SelectionChanged：選択状態の変更時に発生
• LongPressed：長押しジェスチャー時に発生
• TouchDown：タッチ開始時に発生
• TouchUp：タッチ終了時に発生
• イベントのタイミングとライフサイクル

コマンドとメソッド

📄 参照： references/commands-and-methods.md

• MVVM コマンドのサポート：LongPressedCommand、TouchDownCommand、TouchUpCommand
• データ渡し用のコマンドパラメーター
• ApplyEffects メソッド：プログラムによる効果の適用
• Reset メソッド：適用した効果の削除
• リップルアニメーションの繰り返し
• リップルの開始位置とカスタムポイント

ユースケースとパターン

📄 参照: references/use-cases-and-patterns.md

• カスタムビューでのボタンのようなインタラクション
• 波紋フィードバックを伴うリスト項目の選択
• ダッシュボードでのカード操作
• 長押しアクションとコンテキストメニュー
• タッチエフェクト付きの画像ギャラリー
• エフェクトを組み合わせた豊かなインタラクション
• アクセシビリティに関する考慮事項
• パフォーマンス最適化のヒント