CachedNetworkImage не работает в слайдере карусели ⇐ Android

[Anonymous]

Я работаю над приложением Flutter, в котором использую пакет CachedNetworkImage для загрузки изображений внутри CarouselSlider. Однако я заметил, что всякий раз, когда карусель переходит к следующему изображению, изображение перезагружается, хотя я использую CachedNetworkImage. Я ожидаю, что изображения будут кэшироваться и не будут перезагружаться без необходимости.
import 'package:cached_network_image/cached_network_image.dart';
import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:sample_poc/constants/appColors.dart';
import 'package:sample_poc/view_model/homeScreenViewModel/home_screen_view_model.dart';

class CachedImageCarousel extends StatefulWidget {
const CachedImageCarousel({super.key});

@override
State createState() => _CachedImageCarouselState();
}

class _CachedImageCarouselState extends State {
final ValueNotifier _currentIndex = ValueNotifier(0);

@override
Widget build(BuildContext context) {
final Size size = MediaQuery.of(context).size;
final viewModel = Provider.of(context, listen: false);
final carouselImageData = viewModel.carouselImages?.data;

// Handle null or empty data
if (carouselImageData == null || carouselImageData.isEmpty) {
return SizedBox(
height: size.height * 0.30,
child: Center(
child: Text(
"No Data Found",
style: TextStyle(fontSize: 18.0, color: AppColors.black),
),
),
);
}

final hasMultipleImages = carouselImageData.length > 1;

return Stack(
alignment: Alignment.bottomCenter,
children: [
// Carousel Slider
CarouselSlider(
options: CarouselOptions(
height: size.height * 0.35,
enlargeCenterPage: true,
viewportFraction: 1.0,
onPageChanged: (index, reason) {
_currentIndex.value = index;
},
),
items: carouselImageData.map((item) {
debugPrint("Build called>>>>>");
return RenderCacheImage(
image: item.banner!,
);
}).toList(),
),

// Dot Indicators
Positioned(
bottom: 10.0,
child: ValueListenableBuilder(
valueListenable: _currentIndex,
builder: (context, currentIndex, _) {
return Row(
mainAxisAlignment: MainAxisAlignment.center,
children: List.generate(carouselImageData.length, (index) {
return AnimatedContainer(
duration: const Duration(milliseconds: 300),
margin: const EdgeInsets.symmetric(horizontal: 4.0),
height: 8.0,
width: currentIndex == index ? 12.0 : 8.0,
decoration: BoxDecoration(
color: currentIndex == index
? AppColors.primaryColor
: Colors.grey,
borderRadius: BorderRadius.circular(8.0),
),
);
}),
);
},
),
),
],
);
}

@override
void dispose() {
_currentIndex.dispose();
super.dispose();
}
}

class RenderCacheImage extends StatefulWidget {
String? image;

RenderCacheImage({super.key, this.image});

@override
State createState() => _RenderCacheImageState();
}

class _RenderCacheImageState extends State {
@override
Widget build(BuildContext context) {
return CachedNetworkImage(
imageUrl: widget.image!,
imageBuilder: (context, image) {
return Image(image: image);
},
fit: BoxFit.cover,
filterQuality: FilterQuality.high,
progressIndicatorBuilder: (context, url, progress) => Container(
color: AppColors.white,
child: Center(
child: CircularProgressIndicator(
color: AppColors.primaryColor,
value: progress.progress,
),
),
),
errorWidget: (context, url, error) => const Center(
child: Icon(Icons.error, color: Colors.red),
),
);
}
}


Подробнее здесь: https://stackoverflow.com/questions/793 ... sel-slider