使用smooth_page_indicator时AnimatedSmoothIndicator无响应求助

核心原因：状态未触发UI重建 #

你在onPageChanged回调里仅更新了_activeIndex变量，但没有调用setState((){})通知Flutter框架重建UI，导致指示器无法感知索引变化。

关键修改步骤 #

把onPageChanged部分修改为：

onPageChanged: (index, reason){
  setState(() {
    _activeIndex = index;
  });
}

额外优化：避免指示器被遮挡 #

当前用Stack嵌套的指示器可能被轮播图内容遮挡，建议添加定位属性将其固定在合适位置，比如底部：

Positioned(
  bottom: 30, // 可根据需求调整距离底部的间距
  left: 0,
  right: 0,
  child: Center(
    child: buildIndicator(),
  ),
)

完整修改后的代码 #

class ExploreCollections extends StatefulWidget {
  const ExploreCollections({Key? key}) : super(key: key);

  @override
  State<ExploreCollections> createState() => _ExploreCollectionsState();
}

class _ExploreCollectionsState extends State<ExploreCollections> {
  int _activeIndex = 0;
  final List<Widget> _images = [
    Stack(
      children: [
        Image.asset('assets/images/image 10.png'),
        Padding(
          padding: const EdgeInsets.only(left: 55.0, top: 230),
          child: Text(
            'Luxury \n   Fashion \n &Accessories'.toUpperCase(),
            style: TextStyle(
                fontFamily: 'Bodoni',
                fontSize: 40,
                fontWeight: FontWeight.w500,
                color: Colors.grey.shade700
            ),
          ),
        ),
        Padding(
          padding: const EdgeInsets.only(top: 250.0),
          child: Center(
            child:SvgPicture.asset('assets/iconImages/Button.svg') ,
          ),
        ),
      ],
    ),
    Stack(
      children: [
        Image.asset('assets/images/leeloo.jpeg'),
      ],
    ),
    Stack(
      children: [
        Image.asset('assets/images/ayaka.jpeg'),
      ],
    ),
  ];
  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Stack(
        children: [
          CarouselSlider.builder(
            options: CarouselOptions(
              viewportFraction: 1,
              aspectRatio: 1.8,
              height: MediaQuery.of(context).size.height,
              autoPlay: false,
              initialPage: 0,
              enableInfiniteScroll: false,
              enlargeCenterPage: true,
              onPageChanged: (index, reason){
                setState(() {
                  _activeIndex = index;
                });
              }
            ),
            itemCount: _images.length,
            itemBuilder: (BuildContext context, int index, int realIndex) {
              return _images[index];
            },
          ),
          Positioned(
            bottom: 30,
            left: 0,
            right: 0,
            child: Center(
              child: buildIndicator(),
            ),
          ),
        ],
      ),
    );
  }
  Widget buildIndicator(){
    return AnimatedSmoothIndicator(
        activeIndex: _activeIndex,
        count: _images.length
    );
  }
}

其他验证点 #

• 确认smooth_page_indicator包已正确安装并导入
• 检查_images.length与指示器的count值是否一致（当前代码已匹配）

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