Flutter Cross-Platform Development: Complete Guide 2026

// Non-nullable (default)
String name = 'Flutter';

// Nullable — must use ? and handle null
String? middleName;
if (middleName != null) {
  print(middleName.length); // Promoted to non-nullable
}

// Null-aware operators
final display = middleName ?? 'N/A';
final length = middleName?.length ?? 0;

Future<List<int>> fetchUserIds() async {
  final response = await http.get(Uri.parse('https://api.example.com/users'));
  if (response.statusCode != 200) {
    throw HttpException('Failed to load users', statusCode: response.statusCode);
  }
  final List<dynamic> data = jsonDecode(response.body);
  return data.map((u) => u['id'] as int).toList();
}

// Heavy computation in a background isolate
int computePrimes(int limit) {
  // ... CPU-intensive work
  return count;
}

void main() async {
  final result = await Isolate.run(() => computePrimes(1000000));
  print('Found $result primes');
}

// StatelessWidget example
class Greeting extends StatelessWidget {
  const Greeting({super.key, required this.name});

  final String name;

  @override
  Widget build(BuildContext context) {
    return Text('Hello, $name!', style: Theme.of(context).textTheme.headlineMedium);
  }
}

// StatefulWidget example
class CounterWidget extends StatefulWidget {
  const CounterWidget({super.key});
  @override
  State<CounterWidget> createState() => _CounterWidgetState();
}

class _CounterWidgetState extends State<CounterWidget> {
  int _count = 0;

  void _increment() {
    setState(() => _count++);
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text('Count: $_count'),
        ElevatedButton(onPressed: _increment, child: const Text('Increment')),
      ],
    );
  }
}

class AuthNotifier extends ChangeNotifier {
  User? _currentUser;
  User? get currentUser => _currentUser;

  Future<void> login(String email, String password) async {
    _currentUser = await authService.login(email, password);
    notifyListeners();
  }
}

// Consume via context.watch
class ProfilePage extends StatelessWidget {
  const ProfilePage({super.key});

  @override
  Widget build(BuildContext context) {
    final auth = context.watch<AuthNotifier>();
    if (auth.currentUser == null) return const LoginForm();
    return Text('Welcome, ${auth.currentUser!.name}');
  }
}

// Define a provider globally
@riverpod
class UserList extends _$UserList {
  @override
  Future<List<User>> build() async {
    final response = await http.get(Uri.parse('https://api.example.com/users'));
    final List<dynamic> data = jsonDecode(response.body);
    return data.map((json) => User.fromJson(json)).toList();
  }
}

// Consume in UI
class UsersPage extends ConsumerWidget {
  const UsersPage({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final usersAsync = ref.watch(userListProvider);

    return switch (usersAsync) {
      AsyncData(:final value) => ListView.builder(
          itemCount: value.length,
          itemBuilder: (_, i) => Text(value[i].name),
        ),
      AsyncError(:final error) => Text('Error: $error'),
      _ => const CircularProgressIndicator(),
    };
  }
}

// Events
sealed class AuthEvent {}
final class LoginSubmitted extends AuthEvent {
  LoginSubmitted({required this.email, required this.password});
  final String email;
  final String password;
}

// States
sealed class AuthState {}
final class AuthInitial extends AuthState {}
final class AuthLoading extends AuthState {}
final class AuthSuccess extends AuthState {}
final class AuthFailure extends AuthState {
  AuthFailure(this.error);
  final String error;
}

// Bloc
class AuthBloc extends Bloc<AuthEvent, AuthState> {
  AuthBloc() : super(AuthInitial()) {
    on<LoginSubmitted>((event, emit) async {
      emit(AuthLoading());
      try {
        await authService.login(event.email, event.password);
        emit(AuthSuccess());
      } catch (e) {
        emit(AuthFailure(e.toString()));
      }
    });
  }
}

// Profile card layout using Row, Column, and Expanded
class ProfileCard extends StatelessWidget {
  const ProfileCard({super.key, required this.name, required this.bio});

  final String name;
  final String bio;

  @override
  Widget build(BuildContext context) {
    return Card(
      child: Padding(
        padding: const EdgeInsets.all(16),
        child: Row(
          children: [
            const CircleAvatar(radius: 30, child: Icon(Icons.person, size: 36)),
            const SizedBox(width: 16),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(name, style: Theme.of(context).textTheme.titleMedium),
                  const SizedBox(height: 4),
                  Text(bio, style: Theme.of(context).textTheme.bodyMedium),
                ],
              ),
            ),
            const Icon(Icons.chevron_right),
          ],
        ),
      ),
    );
  }
}

Stack(
  children: [
    Image.network('https://example.com/background.jpg'),
    Positioned(
      bottom: 16,
      left: 16,
      right: 16,
      child: Container(
        padding: const EdgeInsets.all(12),
        decoration: BoxDecoration(
          color: Colors.black54,
          borderRadius: BorderRadius.circular(8),
        ),
        child: const Text('Overlay caption',
            style: TextStyle(color: Colors.white, fontSize: 16)),
      ),
    ),
  ],
)

Row(
  children: [
    Expanded(flex: 2, child: Container(color: Colors.red)),
    Expanded(flex: 3, child: Container(color: Colors.green)),
    Expanded(flex: 1, child: Container(color: Colors.blue)),
  ],
)

dependencies:
  go_router: ^14.0.0

final router = GoRouter(
  initialLocation: '/',
  redirect: (context, state) {
    final isLoggedIn = authService.isLoggedIn;
    final isLoginRoute = state.matchedLocation == '/login';

    if (!isLoggedIn && !isLoginRoute) return '/login';
    if (isLoggedIn && isLoginRoute) return '/';
    return null;
  },
  routes: [
    GoRoute(path: '/', builder: (_, __) => const HomeScreen()),
    GoRoute(path: '/login', builder: (_, __) => const LoginScreen()),
    GoRoute(
      path: '/users/:id',
      builder: (_, state) => UserDetailScreen(userId: state.pathParameters['id']!),
    ),
  ],
);

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(routerConfig: router);
  }
}

<!-- AndroidManifest.xml -->
<intent-filter>
  <action android:name="android.intent.action.VIEW" />
  <category android:name="android.intent.category.DEFAULT" />
  <category android:name="android.intent.category.BROWSABLE" />
  <data android:scheme="https" android:host="calmops.com" />
</intent-filter>

class BatteryLevelService {
  static const _channel = MethodChannel('com.example.app/battery');

  Future<int> getBatteryLevel() async {
    try {
      final level = await _channel.invokeMethod<int>('getBatteryLevel');
      return level ?? -1;
    } on PlatformException {
      return -1;
    }
  }
}

// Android side
class MainActivity : FlutterActivity() {
    override fun configureFlutterEngine(flutterEngine: FlutterEngine) {
        super.configureFlutterEngine(flutterEngine)
        MethodChannel(flutterEngine.dartExecutor.binaryMessenger, "com.example.app/battery")
            .setMethodCallHandler { call, result ->
                if (call.method == "getBatteryLevel") {
                    val battery = getBatteryLevel()
                    result.success(battery)
                } else {
                    result.notImplemented()
                }
            }
    }
}

// iOS side
@UIApplicationMain
@objc class AppDelegate: FlutterAppDelegate {
    override func application(
        _ application: UIApplication,
        didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
    ) -> Bool {
        let controller = window?.rootViewController as! FlutterViewController
        let channel = FlutterMethodChannel(name: "com.example.app/battery",
                                           binaryMessenger: controller.binaryMessenger)
        channel.setMethodCallHandler { call, result in
            if call.method == "getBatteryLevel" {
                let battery = UIDevice.current.isBatteryMonitoringEnabled ? Int(UIDevice.current.batteryLevel * 100) : -1
                result(battery)
            } else {
                result(FlutterMethodNotImplemented)
            }
        }
        return super.application(application, didFinishLaunchingWithOptions: launchOptions)
    }
}

// pigeons/messages.dart
@HostApi()
abstract class CameraApi {
  Future<String> takePhoto();
  Future<List<CameraInfo>> getAvailableCameras();
}

flutter build web --wasm

flutter config --enable-macos-desktop
flutter config --enable-windows-desktop
flutter config --enable-linux-desktop

flutter create --platforms=macos,windows,linux .
flutter build macos   # Produces a .app bundle
flutter build windows # Produces a Windows executable
flutter build linux   # Produces a Linux executable

void main() {
  testWidgets('Counter increments on tap', (tester) async {
    await tester.pumpWidget(const MaterialApp(home: CounterWidget()));

    expect(find.text('Count: 0'), findsOneWidget);

    await tester.tap(find.byType(ElevatedButton));
    await tester.pumpAndSettle();

    expect(find.text('Count: 1'), findsOneWidget);
  });
}

void main() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();

  testWidgets('Full login flow', (tester) async {
    await tester.pumpWidget(const MyApp());

    await tester.enterText(find.byKey(const Key('emailField')), '[email protected]');
    await tester.enterText(find.byKey(const Key('passwordField')), 'securePass1');
    await tester.tap(find.byKey(const Key('loginButton')));
    await tester.pumpAndSettle();

    expect(find.text('Welcome back!'), findsOneWidget);
  });
}

testWidgets('Profile card golden test', (tester) async {
  await tester.pumpWidget(const MaterialApp(
    home: Scaffold(body: ProfileCard(name: 'Alice', bio: 'Engineer')),
  ));
  await expectLater(find.byType(ProfileCard), matchesGoldenFile('profile_card.png'));
});

# codemagic.yaml
workflows:
  default:
    name: Default Workflow
    instance_type: mac_mini_m2
    max_build_duration: 60
    environment:
      flutter: stable
      xcode: latest
    scripts:
      - flutter pub get
      - flutter test
      - flutter build ios --release --no-codesign
      - flutter build apk --release
    artifacts:
      - build/**/outputs/**/*.apk
      - build/ios/ipa/*.ipa
    publishing:
      email:
        recipients:
          - [email protected]

# fastlane/Fastfile
default_platform(:android)

platform :android do
  lane :deploy do
    gradle(task: 'clean')
    gradle(task: 'bundle', build_type: 'Release')
    upload_to_play_store(
      track: 'internal',
      aab: 'build/app/outputs/bundle/release/app-release.aab'
    )
  end
end

platform :ios do
  lane :deploy do
    match(type: 'appstore')
    gym(scheme: 'YourApp')
    upload_to_app_store(skip_metadata: true, skip_screenshots: true)
  end
end

# .github/workflows/flutter.yml
name: Flutter CI
on: [push, pull_request]
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: subosito/flutter-action@v2
        with:
          flutter-version: 'stable'
      - run: flutter pub get
      - run: flutter test
      - run: flutter build apk --release