如何为Flutter的ListWheelScrollView组件设置初始选中值

解决方案 #

要为ListWheelScrollView设置初始选中值，需要配套使用FixedExtentScrollController控制器，通过控制器的initialItem参数指定初始选中的项索引即可。你的场景中生成的数字从0开始，数值和列表下标完全对应，直接传入你定义的initialNumber即可。

注意事项 #

• 控制器属于ChangeNotifier类型，使用完毕后需要调用dispose方法释放，避免内存泄漏，因此建议在StatefulWidget中使用
• initialItem的取值不能超过子项的最大下标，你当前的子项是0~59共60个，所以初始值不要超过59即可

修改后代码示例 #

class TimePickerItem extends StatefulWidget {
  const TimePickerItem({super.key});

  @override
  State<TimePickerItem> createState() => _TimePickerItemState();
}

class _TimePickerItemState extends State<TimePickerItem> {
  late FixedExtentScrollController _scrollController;
  // 你定义的初始选中值
  final int initialNumber = 11;
  final double itemExtent = 20;

  List<Widget> createNumbers(context, maxNum) {
    List<Widget> widgets = [];
    for (int i = 0; i <= maxNum; i++) {
      widgets.add(
        Text(
          i.toString(), 
          style: Theme.of(context).textTheme.headline6,
        ),
      );
    }
    return widgets;
  }

  @override
  void initState() {
    super.initState();
    // 初始化控制器，指定初始选中项下标
    _scrollController = FixedExtentScrollController(initialItem: initialNumber);
  }

  @override
  void dispose() {
    // 销毁控制器，释放资源
    _scrollController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return ListWheelScrollView(
      // 绑定控制器
      controller: _scrollController,
      itemExtent: itemExtent,
      physics: const FixedExtentScrollPhysics(),
      children: createNumbers(context, 59),
    );
  }
}

如果需要后续主动修改选中项，也可以调用控制器的animateToItem或者jumpToItem方法实现滚动切换。

内容的提问来源于stack exchange，提问作者user15036682