The PopupMenuButton is similar with the DropdownButton, but has a bit different with it. The PopupMenuButton shows the menu but do not change the current button,you can do more things than the DropdownButton. So let's look at an example.
It is a function and should return list with a type of the PopupMenuEntry. It is an abstract class, so we should use its subclasses. The relationship of the extends is below.
So we can add the three classes to the list.So let's use them at the same time.
It will show as follows. When you click the button with a setting icon, it will show the right part, the upper item is the PopupMenuItem, the middle line the PopupMenuDivider, the bottom one is the CheckedPopupMenuItem.
onSelected
In this part, I will give you an example as below.
The initialValue will highlight the item with a grey background when showing the menu. The onCanceled is the function that will be called when you click the area that out of the menu.The onSelected is also a function with a value parameter that is the same as the value of the PopupMenuItem. The icon shows our button for us to click. The result is below.
When you click the item of the menu or other areas that outside of the menu. It will print in the console like this.
I/flutter ( 5472): value:1I/flutter ( 5472):You have canceled the menu.
padding
This is very similar to us, so I just give an example to show the effect and see which part will change.
It will show as follows. The button will show our custom shape.
offset
This can control the location of the menu. So you should set this parameter to show your menu in the fit position. Let's see if we just set it to the Offset(0,100), which position it will be.
If you don't set the offset, it will use the default value Offset.zero.It will show as below.
Conclusion
In this tutorial, we have learned many parameters of the PopupMenuButton. A bit difficult one is the itemBuilder, it isn't very obvious to a newer, it is a function that return list. The others will be easy to understand.