Flutter DropDownButton 不顯示一次選擇

Question

我有以下代碼

class InteriorDropdownButton extends StatefulWidget {
  const InteriorDropdownButton({Key? key}) : super(key: key);

  @override
  _InteriorDropdownButtonState createState() => _InteriorDropdownButtonState();
}

class _InteriorDropdownButtonState extends State<InteriorDropdownButton> {
  final interiorTypeList = [
    'Cuero',
    'Foamizada',
    'Vinilo',
    'Tela',
    'Microfibra'
  ];

  String? selectedInterior;

  DropdownButton<String> androidDropdown() {
    List<DropdownMenuItem<String>> dropdownItems = [];
    for (String interiorType in interiorTypeList) {
      var newItem = DropdownMenuItem(
        child: Text(
          interiorType,
          style: const TextStyle(
            fontWeight: FontWeight.w400,
            color: Colors.black,
            fontSize: 20,
          ),
        ),
        value: interiorType,
      );
      dropdownItems.add(newItem);
    }

    return DropdownButton<String>(
        items: dropdownItems,
        icon: const Icon(Icons.expand_more_outlined),
        iconSize: MediaQuery.of(context).size.height * 0.04,
        isExpanded: true,
        hint: const Text('Tapiceria'),
        style: TextStyle(
          fontWeight: FontWeight.w400,
          color: Colors.black,
          fontSize: MediaQuery.of(context).size.height * .025,
        ),
        onChanged: (value) {
          setState(() {
            selectedInterior = value;
          });
          print('Hola ${selectedInterior}');
          print('Hello ${value}');
        });
  }

  CupertinoPicker iOSPicker() {
    List<Text> pickerItems = [];
    for (String interiorType in interiorTypeList) {
      pickerItems.add(Text(interiorType));
    }

    return CupertinoPicker(
      diameterRatio: 1,
      itemExtent: 32.0,
      onSelectedItemChanged: (selectedIndex) {
        setState(() {
          selectedInterior = interiorTypeList[selectedIndex];
        });
      },
      children: pickerItems,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Platform.isIOS ? iOSPicker() : androidDropdown();
  }
}

androidDropdown() 無法正常工作，一旦我選擇了一個項目，它就不會停留在按鈕中，而是顯示提示字符串。

在控制台中打印結果是：

print('Hola ${selectedInterior}'); = 你好 null，打印（'你好 ${value}'）； 你好庫羅（selectedItem）

有人可以幫我嗎？

Answer 1

DropdownButton需要有權訪問所選項目，在本例中為selectedInterior變量。

為此，您可以將其作為value屬性傳遞給DropdownButton小部件，如下所示：

value: selectedInterior,

將您的androidDropdown方法更新為：

DropdownButton<String> androidDropdown() {
    // Other code 

    return DropdownButton<String>(
        items: dropdownItems,
        icon: const Icon(Icons.expand_more_outlined),
        iconSize: MediaQuery.of(context).size.height * 0.04,
        value: selectedInterior, //Add this
        isExpanded: true,
        hint: const Text('Tapiceria'),
        style: TextStyle(
          fontWeight: FontWeight.w400,
          color: Colors.black,
          fontSize: MediaQuery.of(context).size.height * .025,
        ),
        onChanged: (value) {
          setState(() {
            selectedInterior = value;
          });
          print('Hola ${selectedInterior}');
          print('Hello ${value}');
        });
 }