Search code examples
fluttermenuflutter-animation

Flutter Radial Menu Error : There are multiple heroes that share the same tag within a subtree


I checked other Stack Overflow answers and suggested it has to do with floating action button, but:

  • There is no floating action button in my code to trigger this error.
  • The Radial Button does not include a tag attribute.
  • This error is triggered when I click on a Radial Button.

Error:

Exception caught by scheduler library =====================================================
The following assertion was thrown during a scheduler callback:
There are multiple heroes that share the same tag within a subtree.

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black87,
      appBar: AppBar(
        backgroundColor: Colors.black45,
        title: const Text("Animated Radial Menu Example"),
        centerTitle: true,
      ),
      body: RadialMenu(
        children: [
          RadialButton(
            icon: const Icon(Icons.ac_unit),
            buttonColor: Colors.teal,
            onPress: () => Navigator.push(
              context,
              MaterialPageRoute(builder: (_) => const TargetScreen()),
            ),
          ),
          RadialButton(
            icon: const Icon(Icons.camera_alt),
            buttonColor: Colors.green,
            onPress: () => Navigator.push(
              context,
              MaterialPageRoute(builder: (_) => const TargetScreen()),
            ),
          ), e.t.c

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: const Text("Target Screen")),
        );
    }
}

Solution

  • Package: https://pub.dev/packages/animated_radial_menu

    This package is outdated, last updated 3 years ago. You should replace it with a more up-to-date and supported package, or you should fork the repostory from github and give the "heroTag" variable to the FloatingActionButton sections.

    Here is the reason for your issue: https://api.flutter.dev/flutter/material/FloatingActionButton/heroTag.html

    If this is not explicitly set, then there can only be one FloatingActionButton per route (that is, per screen), since otherwise there would be a tag conflict (multiple heroes on one route can't have the same tag). The Material Design specification recommends only using one floating action button per screen.