颤动 CupertinoPicker FixedExtentScrollController 更改 initialItem

问题描述

 Expanded(
            flex: 10,child: Container(
                child: Cupertinopicker(
              itemExtent: 50,onselecteditemchanged: (int i) {},scrollController: FixedExtentScrollController(
                initialItem: isIndex,),useMagnifier: true,children: appwidget,))),

我有这个代码，children 是每个更改的列表小部件。 当我更改列表小部件的“appwidget”时，我可以设置初始项索引吗？

我无法调用 FixedExtentScrollController。我不知道。

解决方法

首先，您需要创建一个 FixedExtentScrollController，它允许您方便地处理项目索引，而不是按照标准 ScrollController 的要求处理原始像素滚动偏移（来源来自 {{ 3}}):

FixedExtentScrollController? _scrollWheelController;
final String? value;
final String values = ['male','female','other'];
@override
  void initState() {
    super.initState();
    _scrollWheelController = FixedExtentScrollController(
      /// Jump to the item index of the selected value in CupertinoPicker
      initialItem: value == null ? 0 : values.indexOf(value!),);
  }

然后将其连接到 CupertinoPicker 以便您可以以编程方式控制滚动视图：

CupertinoPicker.builder(scrollController: _scrollWheelController);

如果您想在 ModalBottomSheet 弹出后立即跳转到所选值的项目索引，以下代码将帮助您实现：

showModalBottomSheet<String>(
  context: context,builder: (_) {
    /// If the build() method to render the
    /// [ListWheelScrollView] is complete,jump to the
    /// item index of the selected value in the controlled
    /// scroll view
    WidgetsBinding.instance!.addPostFrameCallback(
      /// [ScrollController] now refers to a
      /// [ListWheelScrollView] that is already mounted on the screen
      (_) => _scrollWheelController?.jumpToItem(
        value == null ? 0 : values.indexOf(value!),),);

    return SizedBox(
      height: 200,child: Column(
        crossAxisAlignment: CrossAxisAlignment.end,children: [
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 16),child: TextButton(
              onPressed: () => Navigator.pop(context),child: Text('Done'),const Divider(thickness: 1),Expanded(
            child: CupertinoPicker.builder(
              /// if [itemExtent] is too low,the content for each
              /// item will be squished together
              itemExtent: 32,scrollController: _scrollWheelController,onSelectedItemChanged: (index) => setState(() => values[index]),childCount: values.length,itemBuilder: (_,index) => Center(
                child: Text(
                  valueAsString(values[index]),style: TextStyle(
                    color: Theme.of(context).accentColor,],);
  },);

WidgetsBinding.instance!.addPostFrameCallback() 将确保在当前帧中渲染的所有小部件的所有 build() 方法都已完成。如果 _scrollWheelController 指代尚未完全构建的 ListWheelScrollView，则 jumpToItem() 将不起作用。

阅读 Flutter doc 以了解有关如何在 Widget 构建完成时运行方法的更多信息