flutter - 如何在 Flutter 中更改 PopupMenuItem 的背景颜色

Question

flutter中如何改变PopupMenuItem的背景颜色？

现在我只是改变了 PopupMenuItem 子项的颜色，结果是这样的:

代码如下:

PopupMenuButton<int>(
        onSelected: (value) {
          // TODO: Implement onSelect
        },
        offset: Offset(50, 50),
        itemBuilder: (context) => [
          PopupMenuItem(
            value: 1,
            child: Container(
              height: double.infinity,
              width: double.infinity,
              color: Colors.greenAccent,  // i use this to change the bgColor color right now
              child: Row(
                mainAxisAlignment: MainAxisAlignment.end,
                children: <Widget>[
                  Icon(Icons.check),
                  SizedBox(width: 10.0),
                  Text("Konfirmasi Update"),
                  SizedBox(width: 10.0),
                ],
              ),
            ),
          ),

我想要的是更改“Konfirmasi Update”选项的背景颜色，正如您在上图中看到的那样，颜色在选项外留下了白色区域。

如何完全改变 PopupMenuItem 的背景颜色，而不留下 PopupMenuItem 外部的白色区域？

Answer 1

另一种选择是从 PopupMenuItem 继承。

要使用仅更改 CustomPopupMenuItem 的 PopupMenuButton 并设置颜色。

import 'package:flutter/material.dart';

class CustomPopupMenuItem<T> extends PopupMenuItem<T> {
  final Color color;

  const CustomPopupMenuItem({
    Key key,
    T value,
    bool enabled = true,
    Widget child,
    this.color,
  }) : super(key: key, value: value, enabled: enabled, child: child);

  @override
  _CustomPopupMenuItemState<T> createState() => _CustomPopupMenuItemState<T>();
}

class _CustomPopupMenuItemState<T> extends PopupMenuItemState<T, CustomPopupMenuItem<T>> {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: super.build(context),
      color: widget.color,
    );
  }
}