[Sugestão] Código do Desafio - Aula 03 - Atividade 11 - Desafio: Callbacks do carrossel

Como sugestão para o desafio da aula 3, para utilizar os callbacks do carrossel, implementei os indicadores do carrossel, "as bolinhas", para sinalizar quantos itens o carrossel possui e em qual item está o foco, possibilitando a interação e mudança.
Para a implementação, foi tomado como base o exemplo disponível na página do próprio pacote do Carousel Slider, com os ajustes necessários para o projeto atual, utilizando o onPageChanged.

https://pub.dev/packages/carousel_slider/example

Implementação do mapa de imagens com a descrição, do índice de posição do carrossel e do controller.

class _DashboardState extends State<Dashboard> {
  final Map<String, String> _mapImagesWithDescription = {
    "carousel-001.png": "Registre seus livros",
    "carousel-002.png": "Faça anotações",
    "carousel-003.png": "Visualize seu progresso"
  };

  int _currentCarouselIndex = 0;

  final CarouselSliderController _controller = CarouselSliderController();
  ........................................
  ........................................
  ........................................
  ........................................

Implementação do carrossel, com o onPageChanged nas opções e os indicadores logo abaixo dele, clicáveis.

CarouselSlider(
                      items: _mapImagesWithDescription.keys.map(
                        (element) {
                          return CarouselItem(
                              imagePath: element,
                              text: _mapImagesWithDescription[element]!);
                        },
                      ).toList(),
                      options: CarouselOptions(
                        autoPlay: true,
                        height: 500,
                        aspectRatio: 1,
                        viewportFraction: 1,
                        initialPage: _currentCarouselIndex,
                        enableInfiniteScroll: true,
                        autoPlayInterval: Duration(seconds: 5),
                        autoPlayAnimationDuration: Duration(milliseconds: 1000),
                        autoPlayCurve: Curves.easeInBack,
                        scrollDirection: Axis.vertical,
                        reverse: false,
                        onPageChanged: (index, reason) {
                          setState(() {
                            _currentCarouselIndex = index;
                          });
                        },
                      ),
                      carouselController: _controller,
                    ),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: _mapImagesWithDescription.keys
                          .toList()
                          .asMap()
                          .entries
                          .map((entry) {
                        return GestureDetector(
                          onTap: () => _controller.animateToPage(entry.key),
                          child: Container(
                            width: 12.0,
                            height: 12.0,
                            margin: EdgeInsets.symmetric(
                                vertical: 8.0, horizontal: 4.0),
                            decoration: BoxDecoration(
                                shape: BoxShape.circle,
                                color: (Theme.of(context).brightness ==
                                            Brightness.dark
                                        ? Colors.white
                                        : Colors.black)
                                    .withValues(
                                        alpha:
                                            _currentCarouselIndex == entry.key
                                                ? 0.9
                                                : 0.4)),
                          ),
                        );
                      }).toList(),
                    ),

Segue resultado abaixo: