Flutter Dynamic Theme Changer #

A Flutter package that allows you to easily change your app's theme color dynamically at runtime using Riverpod.
It provides both a full theme changer wrapper and two beautiful theme picker widgets!

✨ Features #

• 🎨 Dynamic primary color theme switching
• 🧩 Two ready-to-use theme picker widgets:
  • ThemeColorPickerWidget: An expandable color picker that can be placed anywhere(Great for floating).
  • ThemeDialogButton: A convenient AppBar button that shows colors in a dialog. Great for all common use cases.
• 🌈 Allow users to pick from customizable color palettes
• 🚀 Built with Flutter Riverpod 2.0 (StateNotifier based)
• 🎯 Simple API and easy integration
• ✍️ Fully customizable if needed

🎥 Theme Color Picker Demo

Above: Animated demo of ThemeColorPickerWidget.

🎥 Theme Dialog Button Demo

Above: Animated demo of ThemeDialogButton.

Getting started #

Add this to your package's pubspec.yaml file:

dependencies:
  flutter_theme_changer_erfan: ^0.0.1+1

Then run flutter pub get to install the package.

🛠️ How to Use #

Option 1: Using ThemeColorPickerWidget (Expandable Picker) #

Place the color picker directly in your layout:

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: ThemeColorPickerWidget(), // Expands to show colors when tapped
      ),
    );
  }
}

Option 2: Using ThemeDialogButton (Dialog Picker) #

Add a button to your AppBar that shows colors in a dialog:

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('My App'),
        actions: [
          ThemeDialogButton(), // Shows color picker in a dialog
        ],
      ),
    );
  }
}

Basic Setup #

Wrap your app with ThemeChanger:

void main() {
  runApp(
    const ProviderScope(
      child: ThemeChanger(
        title: 'My App',
        child: HomeScreen(),
      ),
    ),
  );
}

🎨 Customizing Colors #

Both widgets accept custom colors:

// For ThemeColorPickerWidget
ThemeColorPickerWidget(
  availableColors: [
    Colors.teal,
    Colors.indigo,
    Colors.deepOrange,
    Colors.cyan,
    Colors.lime,
    Colors.amber,
  ],
)

// For ThemeDialogButton (coming soon)

📦 What's Inside #

📲 Example #

A full working example is available inside the /example folder.

To run the example locally:

flutter run --target=example/lib/main.dart

You'll see a floating color button — tap it, pick a color, and the app's theme changes instantly!

✅ All tests passed,including integration tests #

✅ All tests passed, including integration tests #

🙌 Contributing #

Contributions are welcome! Feel free to open issues or submit pull requests if you'd like to help!

🔥 Author #

Erfan Alizada. Developed with ❤️ using Flutter and Riverpod.

Additional information #

• For more examples, check out the example directory
• Report bugs on the issue tracker
• Contribute to the package on GitHub

📄 License MIT #

This project is licensed under the MIT License. See the LICENSE file for more details.