☰

Flutter - DropdownButton から選択した項目を揃えるにはどうすればいいですか? 質問する

tag-icon • tag-icon drop-down-menu flutter alignment
Flutter - DropdownButton から選択した項目を揃えるにはどうすればいいですか? 質問する

DropdownButton から選択した項目を中央に揃えることができません。

DropdownMenuItemの下でchild: Center()を試してみましたが、それらの項目を整列させることはできましたが、項目の1つを選択すると、選択した項目はすぐに左揃えになりました。また、整列させたいと思います。選択されたアイテムセンターへ。

それを達成する方法を誰か知っていますか?

前もって感謝します。

選択した項目を中央揃えできません

_dropdown値:

final List<String> _dropdownValues = [
  "One",
  "Two12345",
  "Three123456789",
  "Four",
  ];

  String _selectedValue;

ウィジェットビルドの下:

body: Center(

        child: Row(

          mainAxisAlignment: MainAxisAlignment.center,

          children: <Widget>[
            Container( 
              child: Text('Name:',),
            ),

            Container(

              child: Center(
                child: DropdownButton(
                  hint: Text('Select ...'),
                  items: _dropdownValues.map((value) => DropdownMenuItem(
                    child: Center( child: Text(value), ),
                    value: value,
                  )).toList(),

                  onChanged: (String value) {
                    setState(() {
                      this._selectedValue = value;
                    });
                  },
                  isExpanded: false,
                  value: _selectedValue,
                ),
              ),
            ),
          ],
        ),
      ),

ベストアンサー1

固定幅を設定することに問題がない場合は、DropdownMenuItem Text子要素を で囲むことができますSizedBox。次に、次のようにtextAlignプロパティを に設定します。TextAlign.center

DropdownButton(
  // ...
  items: _dropdownValues.map((value) => DropdownMenuItem(
    child: SizedBox(
      width: 100.0, // for example
      child: Text(value, textAlign: TextAlign.center),
    ),
    value: value,
  )).toList(),
  // ...
),

おすすめ記事