Column Filter popup is still out of place [Bug]

[stingrayx]

Hello,

The fix provided related to #423 still does not fix the issue of the popup being out of place in my case.

I'm not sure what's causing the issue on my side. I tried to reproduce it in the pluto_grid example, but was not successful.

However after some debugging, I found out that it's needed to get the offset of the grid on the screen, if any! In the example provided, this offset is x=0;y=0. However in my case it was something like x=200;y=90. Indeed the context menu was misplaced exactly by this values each time.

The below code shows a possible solution to the issue:

Future<T?>? showColumnMenu<T>({
  required BuildContext context,
  required Offset position,
  required List<PopupMenuEntry<T>> items,
  Color backgroundColor = Colors.white,
}) {
  final RenderBox overlay =
      Overlay.of(context)!.context.findRenderObject() as RenderBox;

  final Offset offset = overlay.localToGlobal(Offset.zero);

  return showMenu<T>(
    context: context,
    color: backgroundColor,
    position: RelativeRect.fromLTRB(
      offset.dx == 0 ? position.dx : position.dx - offset.dx,
      offset.dy == 0 ? position.dy : position.dy - offset.dy,
      position.dx + overlay.size.width,
      position.dy + overlay.size.height,
    ),
    items: items,
    useRootNavigator: true,
  );
}

@bosskmk Do you want me to create a pull request or are you ok to take above code, test and eventually integrate it into your next version?

Thanks a lot

Execution Environment

Flutter version Flutter version is 3.0.4

PlutoGrid version PlutoGrid version is 5.0.3

OS Windows 11

[bosskmk]

I'll test it with go_router . thank you.

[bosskmk]

I received go_router and tested it, but the position of the column menu was not a problem. Can you provide sample code to solve your problem?

[stingrayx]

Hello,

thanks for looking into this. My Widget Tree is quite complex and not so easy to reproduce. But I will post later today some screenshots related to my problem.

Best regards

[stingrayx]

So here some more details.

My Widget Tree looks like this:

I'm using Consumer/Provider widgets, some responsive layout widgets and Column/Row.

However when using the code from 5.0.2, it looks like this still in my web app:

As said, after some debugging I found out that the positioning of the PlutoGrid on my screen is different to the example. The coordinate x=0;y=0 is the top left corner of the pluto grid in my case and not, like in other examples, x=0;y=0 is the top left corner of the web app screen!

So I made some code changes locally (see above in my first comment) and it works:

The localToGlobal function did the trick, according flutter docs it: "Convert the given point from the local coordinate system for this box to the global coordinate system in logical pixels." Which is exactly what I needed.

So maybe I'm really having a very special case, but it might be useful for other's too and I think it works as well in "normal" cases.

Thanks

[github-actions[bot]]

This issue is stale because it has been open for 30 days with no activity.

[github-actions[bot]]

This issue was closed because it has been inactive for 14 days since being marked as stale.