MaterialUiCompatibilityBridge class

A bridge widget for applications that have migrated to package:material_ui but still contain subtrees or package dependencies using package:flutter/material.dart.

This widget maps the parent modern.ThemeData from package:material_ui into a legacy legacy.ThemeData and overrides legacy.Localizations with delegates so that legacy widgets in child can resolve legacy.Theme.of(context) and legacy.MaterialLocalizations.of(context).

App-wide usage

The recommended way to use this bridge across an entire application is to wrap the app once using modern.MaterialApp.builder:

import 'package:material_ui/material_ui.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: const Color(0xFF6750A4)),
      ),
      builder: (BuildContext context, Widget? child) {
        return MaterialUiCompatibilityBridge(child: child!);
      },
      home: const HomeScreen(),
    );
  }
}

Subtree usage

Alternatively, wrap specific legacy package widgets or subtrees:

import 'package:material_ui/material_ui.dart';
import 'package:some_legacy_package/some_legacy_package.dart';

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Migrated Screen')),
      body: MaterialUiCompatibilityBridge(
        child: LegacyPackageWidget(),
      ),
    );
  }
}