如何在同一Flutter项目中整合多应用以共享主题、组件等资源？

Absolutely! This is a super practical approach for apps that need distinct client versions (like Uber's rider and driver apps) while reusing core components, themes, and utilities. Here's a step-by-step breakdown of how to implement this:

1. Structure your project for shared and app-specific code #

Organize your codebase to separate shared resources from app-specific logic. A typical structure might look like this:

lib/
├── src/
│   ├── common/          # Shared resources
│   │   ├── theme.dart   # Shared theme definitions
│   │   ├── widgets/     # Reusable widgets (buttons, cards, etc.)
│   │   └── utils/       # Helper functions, constants
│   ├── rider/           # Rider app-specific code
│   │   ├── rider_app.dart
│   │   └── screens/
│   └── driver/          # Driver app-specific code
│       ├── driver_app.dart
│       └── screens/
├── main_rider.dart      # Rider app entry point
└── main_driver.dart     # Driver app entry point

2. Create separate entry points for each app #

Each app will have its own main file that initializes its specific UI and configuration, while importing shared resources.

Example: Rider app entry (main_rider.dart)

import 'package:flutter/material.dart';
import 'src/common/theme.dart';
import 'src/rider/rider_app.dart';

void main() {
  runApp(const RiderApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Uber Rider',
      theme: AppTheme.riderLightTheme, // Use shared + rider-specific theme
      home: const RiderHomeScreen(),
      // Add rider-specific routes here
    );
  }
}

Example: Driver app entry (main_driver.dart)

import 'package:flutter/material.dart';
import 'src/common/theme.dart';
import 'src/driver/driver_app.dart';

void main() {
  runApp(const DriverApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Uber Driver',
      theme: AppTheme.driverLightTheme, // Use shared + driver-specific theme
      home: const DriverHomeScreen(),
      // Add driver-specific routes here
    );
  }
}

3. Build shared resources with flexibility #

Design your shared components and themes to support app-specific variations when needed. For example, a shared theme can have base styles that each app overrides:

Example: Shared theme (src/common/theme.dart)

import 'package:flutter/material.dart';

class AppTheme {
  // Base shared theme styles
  static ThemeData get baseTheme {
    return ThemeData(
      primaryColor: Colors.blue[700],
      fontFamily: 'Roboto',
      buttonTheme: const ButtonThemeData(
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.all(Radius.circular(8)),
        ),
      ),
    );
  }

  // Rider-specific theme variations
  static ThemeData get riderLightTheme => baseTheme.copyWith(
        accentColor: Colors.green[500],
        scaffoldBackgroundColor: Colors.grey[50],
      );

  // Driver-specific theme variations
  static ThemeData get driverLightTheme => baseTheme.copyWith(
        accentColor: Colors.orange[500],
        scaffoldBackgroundColor: Colors.grey[100],
      );
}

4. Run/build each app separately #

To launch a specific app, use the -t flag to specify the entry point file:

• For rider app: flutter run -t lib/main_rider.dart
• For driver app: flutter run -t lib/main_driver.dart

When building for release, use the same flag with build commands:

• Rider release: flutter build apk -t lib/main_rider.dart
• Driver release: flutter build apk -t lib/main_driver.dart

Key Benefits #

• Reduced redundancy: No need to copy-paste shared widgets, themes, or utilities across multiple projects.
• Consistent updates: Changes to shared components automatically apply to both apps.
• Simplified maintenance: Manage all code in a single repository instead of multiple ones.

A quick note: If your apps grow significantly and start to diverge a lot, you can later extract the shared code into a private Flutter package. But for most cases, keeping everything in one project is simpler and more efficient.

内容的提问来源于stack exchange，提问作者kjmj