Menu Offset broken

[coogle]

I am trying to use this widget and I noticed that the offset is broken for my use case.

I'm not doing anything fancy, just aligning the widget to the top-left:

Align(
    alignment: Alignment.topLeft,
    child: Padding(
        padding: const EdgeInsets.only(
            top: 20,
            left: 20,
        ),
        child: FloatingActionButton.extended(
            onPressed: () => print('FAB Tapped'),
            label: Text(state.activeSearchProfile.name),
            icon: Icon(MdiIcons.mapSearch),
            backgroundColor: Theme.of(context).colorScheme.background,
        ).addStarMenu(
            params: StarMenuParameters.dropdown(
                context
            ),
            onStateChanged: (state) => print('State Changed $state'),
            onItemTapped: (index, controller)
            {
                print('Item Tapped $index');
            },
            items: [
                Text('Item 1'),
                Text('Item 2'),
                Text('Item 3'),
                Text('Item 4'),
                Text('Item 5'),
            ],
        )
    )
)

Thoughts on how to fix this?

[alnitak]

Hi @coogle, thanks for reporting this.

It seems that StarMenuParameters.dropdown factory has a shift on the X axis I didn't want to add! I need to fix this, meanwhile, you can try to define your custom parameters and use them:

    final params = StarMenuParameters(
      shape: MenuShape.linear,
     // Here you can adjust the menu offset. Offset(0, 0) means the 
     // topCenter of the menu is positioned in the `FloatingActionButton`'s center
      centerOffset: Offset(0, 40), 
      openDurationMs: 200,
      closeDurationMs: 60,
      startItemScaleAnimation: 1.0,
      linearShapeParams: LinearShapeParams(
        space: 16,
        angle: 270,
      ),
      backgroundParams: BackgroundParams(
        backgroundColor: Colors.transparent,
      ),
      boundaryBackground: BoundaryBackground(
        padding: EdgeInsets.all(12),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(4),
          color: Theme.of(context).popupMenuTheme.color ??
              Theme.of(context).cardColor,
          boxShadow: kElevationToShadow[6],
        ),
      ),
    );

and then, instead of:

        .addStarMenu(
            params: StarMenuParameters.dropdown(
                context
            ),
            ....

use:

       .addStarMenu(
            params: params,
            ...

But I am not really sure it will fix your issue because there is an unintended X shifting on the left. Let me know!