如何设置分割器和分割器颜色与弹出菜单项目在扑动?

Question

在这个简单的实现代码中，我添加了一些PopupMenuButton项目到AppBaractions参数中，现在我想样式化PopupMenuDividercolor，它有默认的颜色。

Answer 1

你可以很容易地使用Theme类，使用它你可以改变图标的颜色，文本的颜色和PopupMenuDivider的颜色。

同样，你可以很容易地在PopupMenuItem的分隔符上使用PopupMenuDivider。

appBar: AppBar(
title: Text("PopUpMenu Flutter"),
centerTitle: true,
actions: [
Theme(
data: Theme.of(context).copyWith(
dividerTheme: DividerThemeData(
color: Colors.black,
),
iconTheme: IconThemeData(color: Colors.white),
textTheme: TextTheme().apply(bodyColor: Colors.white),
),
child: PopupMenuButton<int>(
color: Colors.indigo,
//onSelected: (item) => onSelected(context, item),
itemBuilder: (context) => [
PopupMenuItem<int>(
value: 0,
child: Text('Settings'),
),
PopupMenuDivider(),
PopupMenuItem<int>(
value: 1,
child: Text('Share'),
),
PopupMenuDivider(),
PopupMenuItem<int>(
value: 2,
child: Row(
children: [
Icon(Icons.logout),
const SizedBox(width: 8),
Text('Sign Out'),
],
),
),
],
),
),
],
),

Answer 2

您可以使用PopupMenuItem child并将Column分配为

PopupMenuItem<WhyFarther>(
value: WhyFarther.harder,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('Working a lot harder'),
Divider(
color: Colors.grey,
)
],
),
),

Answer 3

这样做:

class CustomPopupMenuDivider extends PopupMenuDivider {
final double? thickness;
final double? indent;
final double? endIndent;
final Color? color;
const CustomPopupMenuDivider({
super.height,
super.key,
this.thickness,
this.indent,
this.endIndent,
this.color,
}) : super();
@override
State<CustomPopupMenuDivider> createState() => _CustomPopupMenuDividerState();
}
class _CustomPopupMenuDividerState extends State<CustomPopupMenuDivider> {
@override
Widget build(BuildContext context) {
return Divider(
height: widget.height,
thickness: widget.thickness,
indent: widget.indent,
endIndent: widget.endIndent,
color: widget.color,
);
}
}

那么你可以用这个类来代替PopupMenuDivider