Flutter Dev

作者 minimax-ai60aaae52bb2aMIT13K 個星標收錄於 2026年10月8日更新於 2026年10月8日儲存庫5 個月前更新

Flutter cross-platform development guide covering widget patterns, Riverpod/Bloc state management, GoRouter navigation, performance optimization, and platform-specific implementations. Includes const optimization, responsive layouts, testing strategies, and DevTools profiling. Use when: building Flutter apps, implementing state management (Riverpod/Bloc), setting up GoRouter navigation, creating custom widgets, optimizing performance, writing widget tests, cross-platform development.

AI 產生的概覽

一份 Flutter 與 Dart 開發指南,涵蓋元件、狀態管理、導覽、效能、測試與平台特定實作。

功能
此技能提供結構化的 Flutter 3 與 Dart 開發指南,包含速查表、核心原則與檢查清單。內容涵蓋元件模式、Riverpod 與 Bloc 狀態管理、GoRouter 導覽、版面配置、效能最佳化、測試以及平台特定實作。它指向十二份參考文件,涵蓋動畫、網路、表單、在地化與專案結構等主題。產出的是指引與清單,而非程式碼或檔案。
適用情境
適用於建置或擴充 Flutter 應用程式、選擇或套用 Riverpod 與 Bloc 狀態管理、設定 GoRouter 導覽、建立自訂元件、最佳化算繪效能,或撰寫元件測試與整合測試的情境。
執行需求
除代理外不需要指令碼或工具,僅包含說明與參考文件。套用其中的指引需要 Flutter 與 Dart 開發環境。

Flutter Development Guide

A practical guide for building cross-platform applications with Flutter 3 and Dart. Focuses on proven patterns, state management, and performance optimization.

Quick Reference

Widget Patterns

PurposeComponent
State management (simple)StateProvider + ConsumerWidget
State management (complex)NotifierProvider / Bloc
Async dataFutureProvider / AsyncNotifierProvider
Real-time streamsStreamProvider
NavigationGoRouter + context.go/push
Responsive layoutLayoutBuilder + breakpoints
List displayListView.builder
Complex scrollingCustomScrollView + Slivers
HooksHookWidget + useState/useEffect
FormsForm + TextFormField + validation

Performance Patterns

PurposeSolution
Prevent rebuildsconst constructors
Selective updatesref.watch(provider.select(...))
Isolate repaintsRepaintBoundary
Lazy listsListView.builder
Heavy computationcompute() isolate
Image cachingcached_network_image

Core Principles

Widget Optimization

  • Use const constructors wherever possible
  • Extract static widgets to separate const classes
  • Use Key for list items (ValueKey, ObjectKey)
  • Prefer ConsumerWidget over StatefulWidget for state

State Management

  • Riverpod for dependency injection and simple state
  • Bloc/Cubit for event-driven workflows and complex logic
  • Never mutate state directly (create new instances)
  • Use select() to minimize rebuilds

Layout

  • 8pt spacing increments (8, 16, 24, 32, 48)
  • Responsive breakpoints: mobile (<650), tablet (650-1100), desktop (>1100)
  • Support all screen sizes with flexible layouts
  • Follow Material 3 / Cupertino design guidelines

Performance

  • Profile with DevTools before optimizing
  • Target <16ms frame time for 60fps
  • Use RepaintBoundary for complex animations
  • Offload heavy work with compute()

Checklist

Widget Best Practices

  • const constructors on all static widgets
  • Proper Key on list items
  • ConsumerWidget for state-dependent widgets
  • No widget building inside build() method
  • Extract reusable widgets to separate files

State Management

  • Immutable state objects
  • select() for granular rebuilds
  • Proper provider scoping
  • Dispose controllers and subscriptions
  • Handle loading/error states

Navigation

  • GoRouter with typed routes
  • Auth guards via redirect
  • Deep linking support
  • State preservation across routes

Performance

  • Profile mode testing (flutter run --profile)
  • <16ms frame rendering time
  • No unnecessary rebuilds (DevTools check)
  • Images cached and resized
  • Heavy computation in isolates

Testing

  • Widget tests for UI components
  • Unit tests for business logic
  • Integration tests for user flows
  • Bloc tests with blocTest()

References

TopicReference
Widget patterns, const optimization, responsive layoutWidget Patterns [blocked]
Riverpod providers, notifiers, async stateRiverpod State Management [blocked]
Bloc, Cubit, event-driven stateBloc State Management [blocked]
GoRouter setup, routes, deep linkingGoRouter Navigation [blocked]
Feature-based structure, dependenciesProject Structure [blocked]
Profiling, const optimization, DevToolsPerformance Optimization [blocked]
Widget tests, integration tests, mockingTesting Strategies [blocked]
iOS/Android/Web specific implementationsPlatform Integration [blocked]
Implicit/explicit animations, Hero, transitionsAnimations [blocked]
Dio, interceptors, error handling, cachingNetworking [blocked]
Form validation, FormField, input formattersForms [blocked]
i18n, flutter_localizations, intlLocalization [blocked]

Flutter, Dart, Material Design, and Cupertino are trademarks of Google LLC and Apple Inc. respectively. Riverpod, Bloc, and GoRouter are open-source packages by their respective maintainers.

來源與署名

來源:minimax-ai/skills位於skills/flutter-dev提交60aaae5

授權條款: MIT

內容歸原作者所有。SourceWeft 從公開儲存庫中收錄這些內容。

檢舉或申請下架