gpt4 book ai didi

Flutter:CupertinoPicker BottomSheet onClose 监听器?

转载 作者:行者123 更新时间:2023-12-02 16:51:26 33 4
gpt4 key购买 nike

我正在 Flutter Gallery 中查找与 CupertinoPicker 相关的代码。

以下是相关代码摘录:

        child: new GestureDetector(
// Blocks taps from propagating to the modal sheet and popping.
// onTap: () { },
child: new SafeArea(
child: new CupertinoPicker(
scrollController: scrollController,
itemExtent: _kPickerItemHeight,
backgroundColor: CupertinoColors.white,
onSelectedItemChanged: (int index) {
setState(() {
print(_selectedItemIndex);
_selectedItemIndex = index;
});
},
children: new List<Widget>.generate(coolColorNames.length, (int index) {
return new Center(child:
new Text(coolColorNames[index]),
);
}),
),
),
),

现在,我需要在 CupertinoPicker 关闭时回调/监听器,换句话说,当用户做出选择并且他的选择是最终选择时,我需要知道他的最终选择是什么。

这里的用例是我想在 Bottom Sheet 单关闭时根据他的最终选择进行 api 回调。

目前,我只能在用户旋转选取器时获取值,因为只有 onSelectedItemChanged 的​​回调。请参阅下面的 gif。

enter image description here

我看到 BottomSheet 小部件有一个 onClosing 回调:https://docs.flutter.io/flutter/material/BottomSheet-class.html

但是我很困惑如何获取它的实例来使用,因为 Flutter Gallery 示例正在使用以下代码调用 Bottom Sheet ,并且没有方法从代码中获取 Bottom Sheet :

      new GestureDetector(
onTap: () async {
await showModalBottomSheet<void>(
context: context,
builder: (BuildContext context) {
return _buildBottomPicker();
},
);
},
child: _buildMenu(),
),

有谁知道我如何获得回调监听器?

编辑 - 基于 Remi 的解决方案,我在 onTap 回调中添加了 Navigator.of(context).pop(value) 代码。但是,CupertinoPicker 不是持久性的,因此如果用户触摸选取器外部,选取器将自行关闭并返回 null 值:

  Widget _buildBottomPicker() {
final FixedExtentScrollController scrollController =
new FixedExtentScrollController(initialItem: _selectedItemIndex);

return new Container(
height: _kPickerSheetHeight,
color: CupertinoColors.white,
child: new DefaultTextStyle(
style: const TextStyle(
color: CupertinoColors.black,
fontSize: 22.0,
),
child: new GestureDetector(
// Blocks taps from propagating to the modal sheet and popping.
onTap: () { Navigator.of(context).pop(_selectedItemIndex);},
child: new SafeArea(
child: new CupertinoPicker(
scrollController: scrollController,
itemExtent: _kPickerItemHeight,
backgroundColor: CupertinoColors.white,
onSelectedItemChanged: (int index) {
setState(() {
// print(_selectedItemIndex);
// Navigator.of(context).pop(index);
_selectedItemIndex = index;
});
},
children: new List<Widget>.generate(coolColorNames.length, (int index) {
return new Center(child:
new Text(coolColorNames[index]),
);
}),
),
),
),
),
);
}

最佳答案

实际上比你想象的要简单得多。

showDialog 及其对应项(包括 showModalBottomSheet)返回包含结果的 Future。因此您可以执行以下操作:

final selectedId = await showModalBottomSheet<int>(...);

唯一的要求是,当弹出模态/对话框/路由/其他内容时,您需要执行 Navigator.of(context).pop(value) 来发送该值。

关于Flutter:CupertinoPicker BottomSheet onClose 监听器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49874771/

33 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com