Flutter - 自动滚动到 CaroidrlSlider

Posted 2023-04-01

【中文标题】Flutter - 自动滚动到 CaroidrlSlider

【英文标题】：Flutter - Autoscroll to a CaroidrlSlider

【发布时间】：2021-10-28 10:56:34

【问题描述】：

我正在尝试启用自动滚动到卡片。它应该垂直滚动。我希望自动滚动工作而无需任何用户操作。 并在 5 秒内自动滚动。

这是我想要滚动的代码的一部分：

 Container(
          width: 3000,
          child: Padding(
            padding: const EdgeInsets.all(10.0),
            child: CarouselSlider(
              options: CarouselOptions(height: 150.0),
              items: [1, 2, 3, 4, 5].map((i) 
                return Builder(
                  builder: (BuildContext context) 
                    return Container(
                      width: MediaQuery.of(context).size.width,
                      margin: EdgeInsets.symmetric(horizontal: 5.0),
                      decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(30),
                          color: greenHex),
                      child: Row(
                        children: [
                          Padding(
                            padding: const EdgeInsets.only(
                                top: 0, right: 10, left: 0, bottom: 8),
                            
                          ),
                        ],
                      ),
                    );
                  ,
                );
              ).toList(),
            ),
          ),
        ),

谁能帮帮我？

【参考方案1】：

您需要在 Carousel Slider Options 中启用 autoPlay 并设置 autoPlayInterval。

例子：

        CarouselSlider.builder(
          options: CarouselOptions(
            .
            .
            .
            autoPlay: true,
            autoPlayInterval: const Duration(seconds: 4),
            enableInfiniteScroll: true,
          ),
        ),

【讨论】：

我如何设置卡片的宽度？

也许 viewportFraction、aspectRatio 和 height 选项适合您。 'aspectRatio: 1, height: 500, viewportFraction: 0.8,'

【参考方案2】：

试试下面的代码希望它对你有帮助。请参阅文档here 尝试将自动播放设置为 true

options: CarouselOptions(
      autoPlay: true,
    ),