--- name: flutter-patterns description: Comprehensive Flutter development patterns covering widgets, testing, performance, security, and animations. Use when you need quick reference for Flutter best practices, common UI patterns, performance optimization techniques, security guidelines, or animation implementations. --- # Flutter Patterns A comprehensive collection of battle-tested Flutter patterns and best practices for building production-quality applications. ## Overview This skill provides quick-reference patterns for: - **Widget Patterns**: Common UI components (cards, lists, forms, dialogs, navigation) - **Testing Patterns**: Unit, widget, and integration testing approaches - **Performance Patterns**: Optimization techniques and performance checklists - **Security Patterns**: Security best practices and vulnerability prevention - **Animation Patterns**: Common animation implementations and transitions ## When to Use This Skill Use this skill when you need: - Quick reference for standard Flutter UI patterns - Testing strategy guidance and examples - Performance optimization checklists - Security vulnerability prevention - Animation implementation examples - Best practices for common Flutter development scenarios ## Pattern Categories ### Widget Patterns See [patterns/flutter-widget-patterns.md](patterns/flutter-widget-patterns.md) for: - Card patterns (basic, image, custom) - List patterns (lazy loading, sectioned) - Form patterns with validation - Dialog and bottom sheet patterns - Loading and empty states - Navigation patterns - Responsive layouts ### Testing Patterns See [patterns/flutter-testing-patterns.md](patterns/flutter-testing-patterns.md) for: - Unit test structure and best practices - Widget testing approaches - Integration test patterns - Mock and stub strategies - Test organization and naming conventions - Coverage best practices ### Performance Patterns See [patterns/flutter-performance-checklist.md](patterns/flutter-performance-checklist.md) for: - Build method optimization - Widget rebuilding minimization - List and grid performance - Image loading optimization - Memory leak prevention - Rendering performance tips ### Security Patterns See [patterns/flutter-security-patterns.md](patterns/flutter-security-patterns.md) for: - Input validation and sanitization - Secure storage practices - API security best practices - Authentication and authorization patterns - Data encryption approaches - Common vulnerability prevention (XSS, injection, etc.) ### Animation Patterns See [patterns/flutter-animation-patterns.md](patterns/flutter-animation-patterns.md) for: - Basic animation controllers - Tween animations - Hero animations - Page transitions - Implicit animations - Physics-based animations - Custom animation patterns ## Usage Examples **Example 1: Need a card UI pattern** ``` User: "I need to create a product card with an image and details" → Reference Widget Patterns for image card implementation ``` **Example 2: Writing tests** ``` User: "How should I structure my widget tests?" → Reference Testing Patterns for widget test examples ``` **Example 3: Performance issues** ``` User: "My list is laggy when scrolling" → Reference Performance Patterns for list optimization techniques ``` **Example 4: Security concern** ``` User: "How do I securely store user credentials?" → Reference Security Patterns for secure storage approaches ``` **Example 5: Adding animations** ``` User: "I want to animate a page transition" → Reference Animation Patterns for page transition examples ``` ## Pattern Quality All patterns in this skill are: - ✓ Production-tested and battle-proven - ✓ Following Flutter best practices - ✓ Performance-optimized - ✓ Security-conscious - ✓ Well-documented with code examples ## Quick Access For fast pattern lookup, each category file is self-contained with: - Complete, runnable code examples - Explanation of when to use each pattern - Common pitfalls and how to avoid them - Performance and security considerations --- **Pro tip**: Combine patterns from different categories for comprehensive solutions. For example, use Widget Patterns + Performance Patterns + Security Patterns together when building production features.