首页 > 解决方案 > CupertinoPicker 无法从选定值返回文本

问题描述

我希望文本字段在选择时显示“A”/“B”/等,但是它只返回索引“0”/“1”/“2”/...,为什么???

完整的小部件代码如下:

更新:

  int selectedValue;

  Future showPicker() async {
    showModalBottomSheet(
        context: context,
        builder: (BuildContext context) {
          return CupertinoPicker(
            backgroundColor: Colors.white,
            scrollController: FixedExtentScrollController(initialItem: 3),
            onSelectedItemChanged: (value) {
              setState(() {
                if (value != null) {
                  selectedValue = listTextValues[value];
                  regionController.value = TextEditingValue(text: selectedValue.toString());
                }
              });
            },
            itemExtent: 32.0,
            children: const listTextValues = [
              Text('Eastern'),
              Text('South'),
              Text('West'),
              Text('North'),
              Text('Island'),
            ],
          );
        }
        );

  }

下面的代码是可行的,只是想知道如何简化代码,因为我正在使用 2 个列表,一个用于选择器,一个用于映射索引

解决方案:

    int selectedValue;
  final List<String> listTextValues = ['Eastern', 'South', 'West', 'North', 'Island'];

  Future showPicker() async {
    showModalBottomSheet(
        context: context,
        builder: (BuildContext context) {
          return CupertinoPicker(
            backgroundColor: Colors.white,
            scrollController: FixedExtentScrollController(initialItem: 3),
            onSelectedItemChanged: (value) {
              setState(() {
                if (value != null) {
                  selectedValue = value;
                  regionController.value = TextEditingValue(text: listTextValues[selectedValue].toString());
                }
              });
            },
            itemExtent: 32.0,
            children: const [
              Text('Eastern'),
              Text('South'),
              Text('West'),
              Text('North'),
              Text('Island'),
            ],
          );
        }
        );

  }

标签: flutterflutter-cupertinocupertinopicker

解决方案


使用方法onSelectedItemChanged: (value),“值”是选定的索引。
您必须将字母列表存储在小部件的变量中

const listTextValues = [
      Text('A'),
      Text('B'),
      Text('C'),
      Text('D'),
      Text('E'),
    ];

并在 onSelectedItemChanged 实现中获取所选索引处的项目

selectedValue = listTextValues[value];

编辑

最终结果应如下所示

int selectedValue;
final List<Widget> listTextValues = [
              Text('Eastern'),
              Text('South'),
              Text('West'),
              Text('North'),
              Text('Island'),
            ];

  Future showPicker() async {
    showModalBottomSheet(
        context: context,
        builder: (BuildContext context) {
          return CupertinoPicker(
            backgroundColor: Colors.white,
            scrollController: FixedExtentScrollController(initialItem: 3),
            onSelectedItemChanged: (value) {
              setState(() {
                if (value != null) {
                  selectedValue = listTextValues[value];
                  regionController.value = TextEditingValue(text: selectedValue.toString());
                }
              });
            },
            itemExtent: 32.0,
            children: listTextValues,
          );
        }
        );

  }

推荐阅读