PopUp Menu

Hello everyone, Due to the fact that it is not integrated, I made my own PopUp Menu. Here is a video showing how it works.[PopupMenu.mp4] Create Following!

First Local States:[image.png]  1. A Local State List as a String (you need one for each PopUp menu you want to use!) 2. A local State String (you only need one, it must be SelectedMenu since the custom widget sets it)

The second step is to create the Custom Widget! Create following Parameters: 1. backGroundColor - Type Color - Nullable 2. menuElevation -Type Double 3. action - Type Action 4. values - Type String - List 

Use this Code:

 class PopupMenu extends StatefulWidget {
  const PopupMenu({
    Key? key,
    this.width,
    this.height,
    this.backGroundColor,
    required this.menuElevation,
    required this.action,
    required this.values,
  }) : super(key: key);

  final double? width;
  final double? height;
  final Color? backGroundColor;
  final double menuElevation;
  final Future Function() action;
  final List values;

  @override
  _PopupMenuState createState() => _PopupMenuState();
}

class _PopupMenuState extends State {
  @override
  Widget build(BuildContext context) {
    return PopupMenuButton(
        elevation: widget.menuElevation,
        color: widget.backGroundColor,
        onSelected: (value) async {
          setState(() => {
                FFAppState().SelectedMenu = ("$value"),
              });
           widget.action.call();
        },
        itemBuilder: (context) {
          return widget.values.map((String choice) {
            return PopupMenuItem(
              value: choice,
              child: Text("$choice"),
            );
          }).toList();
        });
  }
}  
 

Next, you can use the Action from the PopUp Menu to navigate to other websites based on a condition: [image.png]Hope this helps!

5
3 replies