How to set padding for items in dropdown button when clicked in Flutter application

Question

I'm trying to set margin/padding top for the list of items that come in dropdown button when clicked. How to set padding for dropdown button.

After clicking dropdown button I get the items on top of the view like this,

I need to get the items below the dropdown button. I tried giving padding inside a container but only the dropdown button seems to be moving and not the items in it. Is there a solution for this?

Code for reference,

ButtonTheme(
                        alignedDropdown: true,
                        padding: EdgeInsets.only(left: 0.0, right: 0.0, top: 100, bottom: 0.0),
                        child:
                    DropdownButton(
                      menuMaxHeight: 300.0,
                    hint: _dropDownValue == null
                        ? Text("---SELECT---", style: TextStyle(color: Colors.black))
                        :
                    Text(
                    _dropDownValue,
                    style: TextStyle(color: Colors.blue, fontSize: 20),
                  ),
                  isExpanded: true,
                  iconSize: 30.0,
                      icon: Icon(Icons.arrow_drop_down_circle),
                      iconDisabledColor: Colors.red,
                      iconEnabledColor: Colors.green,
                      style: TextStyle(color: Colors.black),
                  dropdownColor: Colors.white,
                  items: answer.map(
                        (val) {
                          return DropdownMenuItem<String>(
                        value: val,
                        child: Text(val),
                      );
                    },
                  ).toList(),
                  onChanged: (val) {
                    setState(
                          () {
                        _dropDownValue = val;
                      },
                    );
                  },
                ),
                      ),

Answer 1

Try below code hope its helpful to you . you must used dropdown_below from here

Create your list

    List numberList = [
    {'no': 1, 'number': '1'},
    {'no': 2, 'number': '2'},
    {'no': 3, 'number': '3'},
    {'no': 4, 'number': '4'},
    {'no': 5, 'number': '5'},
    {'no': 6, 'number': '6'},
    {'no': 7, 'number': '7'},
    {'no': 8, 'number': '8'},
    {'no': 9, 'number': '9'},
  ];

One varibale and list our value

List<DropdownMenuItem<Object?>> _dropdownTestItems = [];
var selectedNumber;

Create initState() and dispose() method:

  @override
  void initState() {
    _dropdownTestItems = buildDropdownTestItems(numberList);
    super.initState();
  }

  @override
  void dispose() {
    super.dispose();
  }

Add your selected number value in dropdown

    List<DropdownMenuItem<Object?>> buildDropdownTestItems(List numberList) {
    List<DropdownMenuItem<Object?>> items = [];
    for (var i in numberList) {
      items.add(
        DropdownMenuItem(
          value: i,
          child: Text(
            i['number'],
            style: TextStyle(color: Colors.black),
          ),
        ),
      );
    }
    return items;
  }

Your Widget:

 Padding(
            padding: const EdgeInsets.all(8.0),
            child: DropdownBelow(
              itemWidth: 100,
              itemTextstyle: TextStyle(
                  fontSize: 14,
                  fontWeight: FontWeight.w400,
                  color: Colors.black),
              boxTextstyle: TextStyle(
                  fontSize: 14,
                  fontWeight: FontWeight.w400,
                  color: Colors.white54),
              boxPadding: EdgeInsets.fromLTRB(13, 12, 13, 12),
              boxWidth: 100,
              boxHeight: 45,
              boxDecoration: BoxDecoration(
                color: Colors.transparent,
                border: Border.all(
                  width: 1,
                  color: Colors.black,
                ),
              ),
              icon: Icon(
                Icons.arrow_downward,
                color: Colors.black,
              ),
              hint: Text(
                'Select',
                style: TextStyle(
                  color: Colors.black,
                ),
              ),
              value: selectedNumber,
              items: _dropdownTestItems,
              onChanged: (selectedTest) {
                setState(() {
                  selectedNumber = selectedTest;
                });
              },
            ),
          ),

Your result screen->