2

正如你们读到的标题并没有以某种方式更新。它只是在我进行热重载并且我不希望这样做时发生。我期待当用手指向左或向右滑动图像时,点指示器必须跟随。请提前帮助和感谢。这是我的轮播代码和点指示器:

                                         final urlImages1 = [
                                   'https://i.imgur.com/Y3UejT0.jpg',
                                   'https://i.imgur.com/KNFL3qd.jpg',
                                   'https://i.imgur.com/fxAH9HY.jpg',
                                   'https://i.imgur.com/9GkgdKx.jpg',
                                          ];

                                         int currentIndex = 0; 

                                              child: Column(
                                                children: [
                                                  CarouselSlider.builder(
                                                    itemCount:
                                                        urlImages1.length,
                                                    itemBuilder: (context,
                                                        index, realIndex) {
                                                      final urlImage01 =
                                                          urlImages1[index];
                                                      return buildImage(
                                                          urlImage01,
                                                          index);
                                                    },
                                                    options:
                                                        CarouselOptions(
                                                            height: 300,
                                                            enlargeStrategy:
                                                                CenterPageEnlargeStrategy
                                                                    .height,
                                                            enlargeCenterPage:
                                                                true,
                                                            onPageChanged:
                                                                (index,
                                                                    reason) {
                                                              setState(() {
                                                                currentIndex =
                                                                    index;
                                                              });
                                                            }),
                                                  ),
                                                  SizedBox(
                                                    height: 10,
                                                  ),
                                                  dotIndicator(),
                                                ],
                                              ),



  Widget dotIndicator() => AnimatedSmoothIndicator(
    activeIndex: currentIndex,
    count: urlImages1.length,
    effect: JumpingDotEffect(
        dotHeight: 10,
        dotWidth: 10,
        dotColor: Colors.grey,
        activeDotColor: Colors.green),
  );

编辑:简而言之,当我滑动图像时,此图像下的点不会移动。只有热重载。

4

1 回答 1

0

假设您像这样创建了您的小部件。

如果您在此处(在 build 方法中)初始化变量,则每当此小部件中的状态更改(此处为 currentIndex)时,它将再次调用 build 方法。这意味着您的所有变量都将使用您分配给它们的值再次初始化(currentIndex = 0)。

import 'package:flutter/material.dart';

class ExampleWidget extends StatefulWidget {
  @override
  _ExampleWidgetState createState() => _ExampleWidgetState();
}

class _ExampleWidgetState extends State<ExampleWidget> {

  // here is the right place to initialize your variables if you want to preserve their state after a rebuild
  // int currentIndex = 0; 
  // also your urlImages1 list won't change. so, you should also initialize it here
  //     final urlImages1 = [
  //   'https://i.imgur.com/Y3UejT0.jpg',
  //   'https://i.imgur.com/KNFL3qd.jpg',
  //   'https://i.imgur.com/fxAH9HY.jpg',
  //   'https://i.imgur.com/9GkgdKx.jpg',
  // ];

  @override
  Widget build(BuildContext context) {
    // you should remove these two initializations
    final urlImages1 = [
      'https://i.imgur.com/Y3UejT0.jpg',
      'https://i.imgur.com/KNFL3qd.jpg',
      'https://i.imgur.com/fxAH9HY.jpg',
      'https://i.imgur.com/9GkgdKx.jpg',
    ];

    int currentIndex = 0; 

    return Column(
              children: [
                CarouselSlider.builder(
                  itemCount:
                      urlImages1.length,
                  itemBuilder: (context,
                      index, realIndex) {
                    final urlImage01 =
                        urlImages1[index];
                    return buildImage(
                        urlImage01,
                        index);
                  },
                  options:
                      CarouselOptions(
                          height: 300,
                          enlargeStrategy:
                              CenterPageEnlargeStrategy
                                  .height,
                          enlargeCenterPage:
                              true,
                          onPageChanged:
                              (index,
                                  reason) {
                            setState(() {
                              currentIndex =
                                  index;
                            });
                          }),
                ),
                SizedBox(
                  height: 10,
                ),
                dotIndicator(),
              ],
            );
  }
}
Widget dotIndicator() => AnimatedSmoothIndicator(
    activeIndex: currentIndex,
    count: urlImages1.length,
    effect: JumpingDotEffect(
        dotHeight: 10,
        dotWidth: 10,
        dotColor: Colors.grey,
        activeDotColor: Colors.green),
  );;

我希望这很清楚。我创建小部件只是为了向您展示放置它的位置,如果您复制和粘贴它可能无法正常工作。

于 2021-09-22T07:02:59.957 回答