flutter - Flutter DropDownButton Popup 200px 下 ボタン

Question

ListView 内でカスタム スタイルの DropDownButton を使用しています。私の問題は、PopupMenu が Button の下の約 200 ～ 300 ピクセルで開くため、下の Button が開いたように見えることです。

ドロップダウンをカスタム スタイルでラップしましたが、既にそれを削除しようとしましたが、何もしませんでした。また、通常のドロップダウン ボタンだけを使用しようとしましたが、同じ効果がありました。対応するビルド:

    @override
Widget build(BuildContext context) {
    homeModel = Provider.of<HomeModel>(context);
    model = Provider.of<TransferModel>(context);
    navigator = Navigator.of(context);
    var items = model.items.entries.toList();
    return Container(
      color: Colors.white,
      child: ListView.builder(
        physics: BouncingScrollPhysics(),
        itemCount: model.items.entries.length,
        itemBuilder: (BuildContext context, int index) {
              return Padding(
                padding: const EdgeInsets.only(left: 30, right: 30, top: 10),
                child: CustomDropDown(
                  errorText: "",
                  hint: items[index].value["label"],
                  items: items[index]
                      .value["items"]
                      .asMap()
                      .map((int i, str) => MapEntry(
                          i,
                          DropdownMenuItem(
                            value: i,
                            child: Text(str is Map
                                ? str["displayName"].toString()
                                : str.toString()),
                          )))
                      .values
                      .toList()
                      .cast<DropdownMenuItem<int>>(),
                  value: items[index].value["selected"],
                  onChanged: (position) =>
                      model.selectItem(items[index].key, position),
                ),
              );
        },
      ),
    );

  }

カスタムドロップダウン:

class CustomDropDown extends StatelessWidget {
  final int value;
  final String hint;
  final String errorText;
  final List<DropdownMenuItem> items;
  final Function onChanged;

  const CustomDropDown(
      {Key key,
      this.value,
      this.hint,
      this.items,
      this.onChanged,
      this.errorText})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Container(
          decoration: BoxDecoration(
              color: Colors.grey[100], borderRadius: BorderRadius.circular(30)),
          child: Padding(
            padding:
                const EdgeInsets.only(left: 30, right: 30, top: 10, bottom: 5),
            child: DropdownButton<int>(
              value: value,
              hint: Text(
                hint,
                style: TextStyle(fontSize: 20),
                overflow: TextOverflow.ellipsis,
              ),
              style: Theme.of(context).textTheme.title,
              items: items,
              onChanged: (item) {
                onChanged(item);
              },
              isExpanded: true,
              underline: Container(),
              icon: Icon(Icons.keyboard_arrow_down),
            ),
          ),
        ),
        if (errorText != null) 
          Padding(
            padding: EdgeInsets.only(left: 30, top: 10),
            child: Text(errorText, style: TextStyle(fontSize: 12, color: Colors.red[800]),),
          )

      ],
    );
  }
}

編集:ポップアップが常に画面の中央に開くことに気付きました。しかし、それがなぜなのかはまだわかりません。

編集 2: @João Soares のおかげで、問題を絞り込みました。メニューを開閉するための AnimatedContainer を使用して、ウィジェットを ListView で囲みます。このコンテナーのパディングが原因のようですが、そのコンテナーが必要なので、これを修正する方法がわかりません: (子は ListView ウィジェットです)

  class ContentSheet extends StatelessWidget {
  final Widget child;
  final bool isMenuVisible;

  const ContentSheet({Key key, this.child, this.isMenuVisible}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.only(top: 50),
      child: AnimatedContainer(
        duration: Duration(milliseconds: 450),
        curve: Curves.elasticOut,
        padding: EdgeInsets.only(top: isMenuVisible ? 400 : 100),
        child: ClipRRect(
          borderRadius: BorderRadius.only(
              topLeft: Radius.circular(20), topRight: Radius.circular(20)),
          child: Container(
            decoration: BoxDecoration(
              borderRadius: BorderRadius.only(
                  topLeft: Radius.circular(20), topRight: Radius.circular(20)),
              color: Colors.white,
            ),
            child: child
          ),
        ),
      ),
    );
  }
}