时间戳

首页 > 解决方案 > 如果有很多要滑动的项目，滑块会挂起

flutter - 如果有很多要滑动的项目，滑块会挂起

问题描述

我有大约 10000 个项目的水平列表，并且滚动我使用的是颤振滑块，但它根本不平滑。我认为在换向阀上设置状态不是正确的方法。

                                            Slider(
                                              key: ValueKey('slider'),
                                              activeColor: Colors.blue,
                                              inactiveColor: Colors.white,
                                              min: 0.0,
                                              max: scrollController.hasClients
                                                  ? scrollController
                                                      .position.maxScrollExtent
                                                  : 10000.0,
                                              value: value,
                                              onChanged: (double value) {
                                                scrollController.position
                                                    .jumpTo(value);
                                                if (mounted)
                                                  setState(
                                                      () => this.value = value);
                                              },
                                              onChangeStart: (double value) {},
                                              onChangeEnd: (double value) {
                                              },
                                            )```

标签： flutterdartflutter-widget

解决方案

以下是一些使其更快的提示：

  • 而不是使用min: 0.0andmax: 10000.0您可以保留默认值从 to 工作0.0，1.0然后乘以 value * 10000.0，这样Slider就不必计算 from 0.0to10000.0但 from 0.0to 的值的位置1.0。
  • 如果setState()只更新Slider 而不是整个小部件树，那就太好了。为此，您可以将 Slidera放入StatefulWidget，或者您可以将 a 包裹Slider起来 StatefulBuilder。
  • 在模式下运行应用程序release将比在 debug模式下更快。

这是一个简单的示例，使用StatefulBuilder：

StatefulBuilder(
  builder: (context, setState) {
    return Slider(
      value: value,
      onChanged: (value) {
        _scrollController.position.jumpTo(value * 10000);
        setState(() {
          this.value = value;
        });
      },
    );
  },
)

推荐阅读