文档:
By default, a [PopupMenuItem] is [kMinInteractiveDimension] pixels
high. If you use a widget with a different height, it must be
specified in the [height] property.
PopupMenuItem 内容的 height 比它自己的 height 大的时候按内容来显示 。
import 'package:flutter/material.dart';
import 'package:robot3/widgets.dart';
/// 下拉列表 PopupMenuButton的使用
void main() {
final themeData = ThemeData(
popupMenuTheme: PopupMenuThemeData(
menuPadding: EdgeInsets.zero,
color: Colors.red, // 菜单背景颜色
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(0), // 菜单圆角
),
elevation: 8, // 菜单阴影
textStyle: TextStyle(
fontSize: 4,
color: Colors.yellow, // 菜单文字样式
),
),
);
runApp(MaterialApp(
theme: themeData,
home: const SecondScreen()));
}
class SecondScreen extends StatelessWidget {
const SecondScreen({super.key});
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Second Screen'),
),
body: CustomPopupMenuButton(),
);
}
}
class CustomPopupMenuButton extends StatefulWidget {
_CustomPopupMenuButtonState createState() => _CustomPopupMenuButtonState();
}
class _CustomPopupMenuButtonState extends State<CustomPopupMenuButton> {
final map = {
"关于": Icons.info_outline,
"帮助": Icons.help_outline,
"问题反馈": Icons.add_comment,
};
Widget build(BuildContext context) {
return PopupMenuButton<String>(
padding: EdgeInsets.zero, // 移除 PopupMenuButton 的外部 padding
child: RobotText(text: '123456'),
itemBuilder: (context) => buildItems(),
offset: Offset(0, 50),
color: Color(0xffF4FFFA),
elevation: 1,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(0),
bottomRight: Radius.circular(0),
topRight: Radius.circular(0),
bottomLeft: Radius.circular(0),
)),
onSelected: (e) {
print(e);
if (e == '关于') {
// DialogAbout.show(context);
}
},
onCanceled: () => print('onCanceled'),
);
}
List<PopupMenuItem<String>> buildItems() {
return map.keys
.toList()
.map((e) => PopupMenuItem<String>(
height: 1, // 设置菜单项的高度
padding: EdgeInsets.zero, // 移除 PopupMenuItem 的内边距
value: e,
child:
SizedBox(height: 20,child:
Text(e))
)
)
.toList();
}
}
效果: