Flutter开发之——Menu

• PopupMenuButton：菜单按钮组件，点击后弹出PopupMenuItem，PopupMenuDivider设置分割线，空间前带选中的使用CheckedPopupMenuItem、

• showMenu：显示Menu方法，跟onPressed连用

二 PopupMenuButton

---

2.1 源码

const PopupMenuButton({

Key? key,

required this.itemBuilder,

this.initialValue,

this.onSelected,

this.onCanceled,

this.tooltip,

this.elevation,

this.padding = const EdgeInsets.all(8.0),

this.child,

this.icon,

this.iconSize,

this.offset = Offset.zero,

this.enabled = true,

this.shape,

this.color,

this.enableFeedback,

})

2.2 属性说明

| 属性 | 说明 | 取值 |

| :-: | :-: | :-: |

| initialValue | 初始值 | T |

| onSelected | 选中调用 | Function(T value) |

| onCanceled | 取消选中 | Function() |

| tooltip | 长按时显示文本 | String |

| child | menu控件 | Widget |

| icon | menu图标 | Widget |

| iconSize | 图标大小 | double |

| offset | 菜单弹出的位置 | Offset |

| shape | 弹出菜单边框 | ShapeBorder |

| color | 弹出菜单颜色 | Color |

三 PopupMenuItem

---

3.1 源码

const PopupMenuItem({

Key? key,

this.value,

this.enabled = true,

this.height = kMinInteractiveDimension,

this.textStyle,

this.mouseCursor,

required this.child,

})

3.2 属性说明

| 属性 | 说明 | 取值 |

| :-: | :-: | :-: |

| value | 当此项选中后，此值将会通过onSelected返回 | T |

| enabled | 此项是否可用 | bool |

| height | 此项的高度 | double |

| textStyle | 文本样式 | TextStyle |

| child | 子控件 | Widget |

四 PopupMenuDivider

---

4.1 源码

const PopupMenuDivider({ Key? key, this.height = _kMenuDividerHeight })

4.2 属性说明

• height：分割线控件的高度

五 CheckedPopupMenuItem

---

5.1 源码

const CheckedPopupMenuItem({

Key? key,

T? value,

this.checked = false,

bool enabled = true,

Widget? child,

})

5.2 属性说明

| 属性 | 说明 | 取值 |

| :-: | :-: | :-: |

| value | 当此项选中后，此值将会通过onSelected返回 | T |

| checked | 该控件是否被选中 | bool |

| enabled | 该控件是否可用 | bool |

| child | 子控件 | Widget |

六 示例

---

6.1 PopupMenuButton+PopupMenuItem

代码

PopupMenuButton(

shape: RoundedRectangleBorder(side: BorderSide(color: Colors.red), borderRadius: BorderRadius.circular(20)),

offset: Offset(0, 30),

elevation: 5,

padding: EdgeInsets.all(5),

//color: Colors.grey,

child: RaisedButton(child: Text(‘学科’),),

//icon: Icon(Icons.add),

initialValue: ‘语文’,

tooltip: ‘PopupMenuButton’,

onSelected: (value) {

print(‘$value’);

},

onCanceled: () {

print(‘onCanceled’);

},

itemBuilder: (context) {

return <PopupMenuEntry>[

PopupMenuItem(

value: ‘语文’,

child: Text(‘语文’),

),

PopupMenuDivider(height: 20,),

PopupMenuItem(

value: ‘数学’,

enabled: false,

child: Text(‘数学’,style: TextStyle(color: Colors.red),),

),

PopupMenuDivider(),

PopupMenuItem(

value: ‘英语’,

child: Text(‘英语’),

),

PopupMenuDivider(),

PopupMenuItem(

value: ‘生物’,

child: Text(‘生物’),

最后

希望大家能有一个好心态，想进什么样的公司要想清楚，并不一定是大公司，我选的也不是特大厂。当然如果你不知道选或是没有规划，那就选大公司！希望我们能先选好想去的公司再投或内推，而不是有一个公司要我我就去！还有就是不要害怕，也不要有压力，平常心对待就行，但准备要充足。最后希望大家都能拿到一份满意的 offer ！如果目前有一份工作也请好好珍惜好好努力，找工作其实挺累挺辛苦的。

这里附上上述的面试题相关的几十套字节跳动，京东，小米，腾讯、头条、阿里、美团等公司19年的面试题。把技术点整理成了视频和PDF（实际上比预期多花了不少精力），包含知识脉络 + 诸多细节。

由于篇幅有限，这里以图片的形式给大家展示一小部分。

《Android学习笔记总结+移动架构视频+大厂面试真题+项目实战源码》，点击传送门，即可获取！
足。最后希望大家都能拿到一份满意的 offer ！如果目前有一份工作也请好好珍惜好好努力，找工作其实挺累挺辛苦的。

这里附上上述的面试题相关的几十套字节跳动，京东，小米，腾讯、头条、阿里、美团等公司19年的面试题。把技术点整理成了视频和PDF（实际上比预期多花了不少精力），包含知识脉络 + 诸多细节。

由于篇幅有限，这里以图片的形式给大家展示一小部分。

[外链图片转存中…(img-jIrmDOls-1714845082157)]
《Android学习笔记总结+移动架构视频+大厂面试真题+项目实战源码》，点击传送门，即可获取！