CODEWITHSUNDEEP
flutter
O.Chounry
O.Chounry

Reputation: 322

Is there anyway to make DropdownMenuItem width bigger that its parent DropdownButton?

The app is using flutter.

I have tried giving width to each DropDownItem children, but it din't work.

items: state.allCountryCodeModel.countryCodes
              .map<DropdownMenuItem<CountryCodeModel>>(
                  (CountryCodeModel value) {
            return DropdownMenuItem<CountryCodeModel>(
              value: value,
              child: Container(
                width: MediaQuery.of(context).size.width * 100,
             // ^^^^^^^^^ <------- Here ------------------
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                    Text(
                      "(${value.code})",
                    ),
                    Text(
                      value.name,
                    
                    ),
                  ],
                ),
              ),
            );
          }).toList()),

enter image description here

enter image description here

How can I achieve this?

Upvotes: 0

Views: 630

Answers (1)

Navaneeth P
Navaneeth P

Reputation: 1561

A PopupMenuButton can be a better widget for this situation as it lets you set a child widget and show a list of PopupMenuItems on tap.

List<Map<String, String>> list = [
  {'code': '+91', 'country': 'India'},
  {'code': '+1', 'country': 'USA'},
];

Map<String, String> _selectedMap;

PopupMenuButton(
  child: Text((_selectedMap ?? list.first)['code']),
  onSelected: (value) => setState(() => _selectedMap = value),
  itemBuilder: (context) {
    return list.map((e) {
      return PopupMenuItem(
        child: Text('(${e['code']}) ${e['country']}'),
        value: e,
      );
    }).toList();
  },
),

Upvotes: 1

Related Questions