Flutter DropDownButton Popup 200px ниже кнопки

Question

Я использую DropDownButton с пользовательским стилем внутри ListView. Моя проблема в том, что PopupMenu открывается примерно на 200-300 пикселей под кнопкой, поэтому она выглядит как открывшаяся кнопка внизу:

Я завернул раскрывающийся список в пользовательском стиле, но Я уже пытался удалить это, и это ничего не сделало. Я также пытался использовать обычную кнопку Dropdown, но это имело тот же эффект. соответствующая сборка:

    @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),
                ),
              );
        },
      ),
    );

  }

CustomDropDown:

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]),),
          )

      ],
    );
  }
}

edit: я только что заметил, что всплывающее окно всегда открывается в центре экрана. Но я до сих пор не знаю, почему это так.

edit 2: благодаря @ João Soares я теперь сузил проблему: я окружаю виджет ListView с AnimatedContainer для открытия и закрытия меню. Заполнение этого контейнера кажется виновником, но я понятия не имею, как я могу это исправить, так как мне нужен этот контейнер: (дочерний элемент - виджет 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
          ),
        ),
      ),
    );
  }
}

Answer 1

Я пробовал ваш виджет CustomDropDown с приведенным ниже кодом, и он работает, как и ожидалось, без раскрывающегося списка, отображаемого ниже. Что-то еще в вашем коде может влиять на его позицию.

class DropdownIssue extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _DropdownIssueState();
  }
}

class _DropdownIssueState extends State<DropdownIssue> {
  int currentValue = 0;

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Container(
        color: Colors.grey,
        child: Container(
          alignment: Alignment.center,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              CustomDropDown(
                hint: 'hint',
                errorText: '',
                value: currentValue,
                items: [
                  DropdownMenuItem(
                    value: 0,
                    child: Text('test 0'),
                  ),
                  DropdownMenuItem(
                    value: 1,
                    child: Text('test 1'),
                  ),
                  DropdownMenuItem(
                    value: 2,
                    child: Text('test 2'),
                  ),
                ].cast<DropdownMenuItem<int>>(),
                onChanged: (value) {
                  setState(() {
                    currentValue = value;
                  });
                  print('changed to $value');
                }
              ),
            ],
          ),
        )
      ),
    );
  }
}