this parameter goes to
FloatingActionButton(
backgroundColor: iconColor,
....
}
and it should go to focusColor AND also provide at the same time the backgroundColor of the FloatingActionButton as a parameter too!!!

How can we open the menu bubble horizontally from right to left?

it is needed for us to understand whta is changed

FloatingActionBubble accepts only Bubble as items, but Bubble is not a widget (BubbleMenu is) so one can not assign key to it.
Why not make Bubble a StatelessWidget and get rid of BubbleMenu?
I mean:

/// Creates a bubble item for floating action menu button.
class Bubble extends StatelessWidget {
  const Bubble({
    required IconData icon,
    required Color iconColor,
    required String title,
    required TextStyle titleStyle,
    required Color bubbleColor,
    required this.onPress,
    super.key,
  })  : _icon = icon,
        _iconColor = iconColor,
        _title = title,
        _titleStyle = titleStyle,
        _bubbleColor = bubbleColor;

  final IconData _icon;
  final Color _iconColor;
  final String _title;
  final TextStyle _titleStyle;
  final Color _bubbleColor;
  final void Function() onPress;

  @override
  Widget build(BuildContext context) => MaterialButton(
        shape: const StadiumBorder(),
        padding: const EdgeInsets.only(top: 11, bottom: 13, left: 32, right: 32),
        color: _bubbleColor,
        splashColor: Colors.grey.withOpacity(0.1),
        highlightColor: Colors.grey.withOpacity(0.1),
        elevation: 2,
        highlightElevation: 2,
        disabledColor: _bubbleColor,
        onPressed: onPress,
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            Icon(
              _icon,
              color: _iconColor,
            ),
            const SizedBox(
              width: 10.0,
            ),
            Text(
              _title,
              style: _titleStyle,
            ),
          ],
        ),
      );
}

You just use:

child: items[index],

instead of:

child: BubbleMenu(items[index]),

and it works.
It's simple as that and doesn't break compatibility.

Here are some features I suggest:

• FloatingActionButton.extended

• No icons for Bubble and remove @required

I Added these parts manually so I thought you may want to implement these features so that others could use :)

As the title suggests, please update the sample code in the README section on pub.dev. There is still the old "onpress" part, which only opens the bubbles but doesn't close them.

Clicking outside the bubbles should dismiss the bubbles menu.

The FloatingActionBubble widget placed in Stack when opened overlaps the content behind it full width.

Widget build(BuildContext context) {
    return Stack(
      children: [
        MyContentPageWidget(...),
        Align(
          alignment: Alignment.bottomRight,
          child: FloatingActionBubble(...)
        ),
      ],
    );
  }

Can display the Bubble menu items under FloatingActionButton?

======== Exception caught by widgets library =======================================================
The following NoSuchMethodError was thrown building Builder:
The method 'dependOnInheritedWidgetOfExactType' was called on null.
Receiver: null
Tried calling: dependOnInheritedWidgetOfExactType<_EffectiveTickerMode>()

The relevant error-causing widget was:
MaterialApp file:///D:/MyProjects/Chromatic%20App/chromatic-app/lib/main.dart:52:12
When the exception was thrown, this was the stack:
#0 Object.noSuchMethod (dart:core-patch/object_patch.dart:54:5)
#1 TickerMode.of (package:flutter/src/widgets/ticker_provider.dart:61:50)
#2 SingleTickerProviderStateMixin.didChangeDependencies (package:flutter/src/widgets/ticker_provider.dart:163:36)
#3 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:4724:11)
#4 ComponentElement.mount (package:flutter/src/widgets/framework.dart:4540:5)

E/flutter (22371): [ERROR:flutter/shell/common/shell.cc(103)] Dart Unhandled Exception: Looking up a deactivated widget's ancestor is unsafe.
E/flutter (22371): At this point the state of the widget's element tree is no longer stable.
E/flutter (22371): To safely refer to a widget's ancestor in its dispose() method, save a reference to the ancestor by calling dependOnInheritedWidgetOfExactType() in the widget's didChangeDependencies() method., stack trace: #0 Element._debugCheckStateIsActiveForAncestorLookup. (package:flutter/src/widgets/framework.dart:3935:9)

Hey,
First of all, thanks for your work.

Do you have any plan to develop to a null-safety version of your plugin?

Is there a way to disable the button's shadow?

The only way to close items is to click on them
the items wont disappear by clicking on fab

Also please update code sample
Thanks.

I am getting the following errors when two instances of FloatingActionBubble are used in my app. Is there anyway that we can set heroTag like we can do for FloatingActionButton?

There are multiple heroes that share the same tag within a subtree.

Within each subtree for which heroes are to be animated (i.e. a PageRoute subtree), each Hero must have a unique non-null tag.
In this case, multiple heroes had the following tag:
Here is the subtree for one of the offending heroes: Hero

When surrounding a page with Directionality(textDirection: TextDirection.rtl, ...., the animation breaks down.
The still bubbles come from left to right and are being cut from the right.

Some users would like to use standard Icon instances (as the animated icon library is very restricted).

FloatingActionButton(
...
child: AnimatedIcon(
icon: icon,
progress: _animation,
),
onPressed: onPress,
),

Tried the sample code but the main open/close fab button is not rotating

Hi,

I'm using the bubble fab on page viewer that display dynamically the fab (onpagechanged).

The standard fab is fading "normally" but with floating action bubble is appearing from another place.

Is it normal? How could we have a normal fade?

Screens below:

Floating action bubble

Standard floating action button

Just replacing the FAB w/ yours

    floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
        floatingActionButton: _buildFab(context), 

Supposed to look like this:

But looks like this: