Skip to content

(WIP -experiment) feat: add flutter-convert-to-flutter skill for native Android and iOS migrations #237

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
jwren wants to merge 1 commit into
base: main
Choose a base branch
from
Open

(WIP -experiment) feat: add flutter-convert-to-flutter skill for native Android and iOS migrations #237

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ Refer to [Get started developing with AI](https://docs.flutter.dev/ai/get-starte
| [flutter-add-widget-test](skills/flutter-add-widget-test/SKILL.md) | Implement a component-level test using `WidgetTester` to verify UI rendering and user interactions (tapping, scrolling, entering text). Use when validating that a specific widget displays correct data and responds to events as expected. | Add a widget test for the CustomButton to verify the onTap callback is called |
| [flutter-apply-architecture-best-practices](skills/flutter-apply-architecture-best-practices/SKILL.md) | Architects a Flutter application using the recommended layered approach (UI, Logic, Data). Use when structuring a new project or refactoring for scalability. | Refactor the authentication flow to follow the recommended layered architecture |
| [flutter-build-responsive-layout](skills/flutter-build-responsive-layout/SKILL.md) | Use `LayoutBuilder`, `MediaQuery`, or `Expanded/Flexible` to create a layout that adapts to different screen sizes. Use when you need the UI to look good on both mobile and tablet/desktop form factors. | Make the home screen responsive so it displays a grid on tablets and a list on phones |
| [flutter-convert-to-flutter](skills/flutter-convert-to-flutter/SKILL.md) | Migrate and convert native iOS (Swift, Objective-C) and Android (Kotlin, Java) applications, architecture patterns, concurrency, UI components, and subsystems to cross-platform Dart and Flutter. Use when converting native mobile codebases or UI screens to Flutter, translating language features and idioms to Dart 3, establishing platform channel or Pigeon interop, or modernizing mobile architectures. | Convert this native Android and iOS mobile application code to idiomatic Flutter and Dart |
| [flutter-fix-layout-issues](skills/flutter-fix-layout-issues/SKILL.md) | Fixes Flutter layout errors (overflows, unbounded constraints) using Dart and Flutter MCP tools. Use when addressing "RenderFlex overflowed", "Vertical viewport was given unbounded height", or similar layout issues. | Fix the overflow error on the profile page when the keyboard is visible |
| [flutter-implement-json-serialization](skills/flutter-implement-json-serialization/SKILL.md) | Create model classes with `fromJson` and `toJson` methods using `dart:convert`. Use when manually mapping JSON keys to class properties for simple data structures. | Implement JSON serialization for the User model class |
| [flutter-setup-declarative-routing](skills/flutter-setup-declarative-routing/SKILL.md) | Configure `MaterialApp.router` using a package like `go_router` for advanced URL-based navigation. Use when developing web applications or mobile apps that require specific deep linking and browser history support. | Set up GoRouter with paths for home, details, and settings |
Expand Down
57 changes: 56 additions & 1 deletion resources/flutter_skills.yaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -431,4 +431,59 @@
- https://docs.flutter.dev/cookbook/networking/send-data
- https://docs.flutter.dev/cookbook/networking/update-data
- https://docs.flutter.dev/data-and-backend/serialization
- https://docs.flutter.dev/data-and-backend/serialization/json
- https://docs.flutter.dev/data-and-backend/serialization/json
- name: flutter-convert-to-flutter
description: Migrate and convert native iOS (Swift, Objective-C) and Android (Kotlin,
Java) applications, architecture patterns, concurrency, UI components, and
subsystems to cross-platform Dart and Flutter. Use when converting native mobile
codebases or UI screens to Flutter, translating language features and idioms
to Dart 3, establishing platform channel or Pigeon interop, or modernizing mobile
architectures.
examplePrompt: "Convert this native Android and iOS mobile application code to idiomatic Flutter and Dart"
instructions: |
1. **Analyze and Classify Native Components:**
* Audit source files across iOS (Swift, Objective-C) and Android (Kotlin, Java) to categorize domain models, business logic, UI screens, and platform SDK dependencies.
* Separate code candidates for a 100% pure Dart rewrite from hardware/OS-specific components requiring native bridges.

2. **Consult Language-Specific References:**
* For Android Java: refer to `reference/android.md`.
* For Android Kotlin: refer to `reference/kotlin.md`.
* For iOS Swift & SwiftUI: refer to `reference/swift.md`.
* For iOS Objective-C: refer to `reference/objective-c.md`.

3. **Convert Data Models and Logic to Dart 3:**
* Convert native structs, POJOs, and classes into immutable Dart classes with `final` fields, `const` constructors, and `copyWith()` methods (or `package:freezed`).
* Map state hierarchies and algebraic data types to Dart 3 `sealed class` hierarchies with exhaustive pattern matching.
* Enforce sound null safety throughout.

4. **Translate Concurrency to Dart Primitives:**
* Replace GCD, Threads, Handlers, Coroutines, and completion blocks with `Future<T>`, `Stream<T>`, and `async`/`await`.
* Dart code on the root isolate runs on the main UI thread; do not perform redundant main thread dispatching.
* Offload CPU-bound tasks to `Isolate.run()`.

5. **Build Declarative Flutter UI:**
* Replace imperative ViewControllers, Activities, Fragments, Compose functions, and XML layouts with `StatelessWidget` and `StatefulWidget`.
* Virtually recycle lists using `ListView.builder` or `GridView.builder`.

6. **Implement Native Interoperability:**
* Use `package:pigeon` for type-safe IPC across iOS (Swift/Obj-C) and Android (Kotlin/Java).
* Use `package:ffigen` for in-process C/ObjC FFI or `package:jni` for Java/Kotlin.
* Use `AndroidView` or `UiKitView` for embedded native UI views.

7. **Verify and Test:**
* Dispose all controllers, timers, and stream subscriptions in `State.dispose()`.
* Verify zero errors with `dart analyze` and run automated unit/widget tests with `flutter test`.
resources:
- https://docs.flutter.dev/get-started/flutter-for/ios-devs
- https://docs.flutter.dev/get-started/flutter-for/android-devs
- https://docs.flutter.dev/get-started/fundamentals
- https://docs.flutter.dev/ui/layout
- https://docs.flutter.dev/data-and-backend/state-mgmt/intro
- https://docs.flutter.dev/platform-integration/ios
- https://docs.flutter.dev/platform-integration/android
- https://docs.flutter.dev/platform-integration/platform-channels
- https://dart.dev/language/patterns
- https://dart.dev/language/class-modifiers
- https://pub.dev/packages/pigeon
- https://pub.dev/packages/ffigen
- https://pub.dev/packages/jni
Loading
Loading