相信在实际开发过程当中，肯定少不了这样的功能：

点击导航栏右上角的按钮，弹出一个菜单供用户选择。

幸运的是颤振提供给我们了一个小部件，直接就能实现如上的效果。

弹出按钮

还是老规矩，先看官方的说明：

当按下时显示一个菜单，当菜单因为选择了一个项目而被取消时调用当选[1]时.传递给当选[2]的值是所选菜单项的值。

可以提供子[3]或图标[4]中的一个，但不能同时提供两个。如果提供了图标[5],则弹出按钮[6]的行为类似于图标按钮[7]。

如果两者都为空，则会创建一个标准的溢出图标（取决于平台)。

大致意思为：

当按下的时候显示一个菜单，选择了一个项目的时候会回调当选后，传递的值是所选菜单的值。

可以提供孩子或图标，但是不能同时提供。

如果为空，则提供一个默认的图标，取决于平台。

构造函数

看完了官方说明，再来看构造函数：

const PopupmunButton({ Key Key，@required this.itemBuilder，this.initialValue，this.onSelected，this.onCanceled，this.tooltip，this.elevation=8.0，this。padding=常量边缘insets。all(8.0)，this.child，this.icon，this.offset=Offset.zero，this.enabled=true，}) : assert(itemBuilder！=null)，断言（偏移量！=null)，断言（已启用！=null)，断言(!（孩子！=空图标！=null))，//如果传递了两个参数ssup per(密钥：密钥)，则失败；这里面每一个参数应该都很好理解，就不做过多的解释了，

唯一必传的参数就是itemBuilder，也可以看到后面的断言：

assert(！（孩子！=空图标！=null))判断了孩子、图标是否同时不为空，如果是的话就报错了。

简单演示

构造函数理解了，官方也提供了一个演示，我们来看一下运行效果：

再来看一下代码：

///首先定义了一个枚举枚举为什么更远{更难，更聪明、selfStarter、tradingCharter、}///////build方法小部件构建(构建上下文上下文){ 0返回脚手架(AppBar : AppBar(title : Text(' PopupMenuButtonPage ')))，动作3360 Widget[popupmenubuttonwhymouter(on selected :(whymouter result){ setState((){ _ selection=result；});}，icon: Icon(Icons.more_vert)，项目生成器：(构建上下文上下文)=popuminentrywhy farer[const popuminitewhy farer(值：为什么更远。硬，儿童：文本('工作更努力)，)，const popuminuitewhy farer(值：为什么更远。更聪明，孩子：文字('更聪明)，const popuminuitewhy farer(值：为什么是farer)}解释一下逻辑：

1.首先定义了一个枚举

2.然后在导航栏的「行动」里定义了弹出按钮

3.设置图标为图标（图标。更多垂直)

4.项目生成器需返回一个列表人口项目

5.这里传入的值就是弹出项目为什么更远

6.然后定义当选时参数接收点击回调

这样整体的逻辑就是定义好了，运行一下：

总结

这样就完成了一个超级简单并且实用的菜单弹出框，

其实它的实现逻辑和下拉按钮差不多，都是使用了人口，

有对这方面感兴趣的同学，可以查看我以前写的文章：颤动源码系列：DropdownButton源码浅析

完整代码已经传至GitHub:https://GitHub。com/王璐1209/WFlutterDemo

参考

[1]在选定的：和https://API上。颤动。选择开发/颤振/材料/弹出数字按钮/on。选中的： https://API上的html[2]。颤动。选择开发/颤振/材料/弹出数字按钮/on。html[3]子： https://API。颤动。dev/flutter/material/popup number button/child。html[4]图标： 3359 API。颤动.

总结

以上所述是小编给大家介绍的摆动超实用简单菜单弹出框弹出按钮功能，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！