flutter_cached_network_image Showing images in the listview and click on any image and go to any screen. When came back the images start loading again.

I have a simple screen with list of images. When user tap on image and go to any screen and when came back then images start laoding again. Why? Its need to be persistant. Why images are loading again when first time they are dislayed.

Here is my code `import 'package:cached_network_image/cached_network_image.dart'; import 'package:flutter/material.dart';

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

@override State<ImageListScreen> createState() => _ImageListScreenState(); }

class _ImageListScreenState extends State<ImageListScreen> { final List<String> imageUrls = const [ 'https://storage.googleapis.com/pluto-dev-assets/post-pics/7f3351ca-d2c6-47f0-942a-e3da67142028.jpg', 'https://storage.googleapis.com/pluto-dev-assets/post-pics/bc788508-153a-482d-8396-ecc4be6c7015.jpg', 'https://storage.googleapis.com/pluto-dev-assets/post-pics/32667d33-d22d-4c2c-8099-88cecd6bc15c.jpg', 'https://storage.googleapis.com/pluto-dev-assets/post-pics/bf648483-2088-4a19-9656-cdd88b450db5.jpg', 'https://storage.googleapis.com/pluto-dev-assets/post-pics/c9ccfaf0-dc36-421c-a5dd-fe1589f9af41.jpg', 'https://storage.googleapis.com/pluto-dev-assets/post-pics/e62464d7-c196-449c-883b-2b93b59df37b.jpg', 'https://storage.googleapis.com/pluto-dev-assets/post-pics/d6b0b088-bc4e-4d33-a110-5d1ab0fe1f6e.jpg', 'https://storage.googleapis.com/pluto-dev-assets/post-pics/ed6df09c-06a2-472f-a9bc-b49df0db9aa1.jpg', 'https://storage.googleapis.com/pluto-dev-assets/post-pics/189a1ded-d6d4-4225-b0d3-4c1755ad3c27.jpg', 'https://storage.googleapis.com/pluto-dev-assets/post-pics/adf8d694-d3f1-4918-92a9-cb7a2291748a.jpg', 'https://storage.googleapis.com/pluto-dev-assets/post-pics/f45c1a47-291c-41f3-8403-86cf9edd7d5b.jpg', ];

@override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: const Text('Image Gallery')), body: CustomScrollView( cacheExtent: 2000, // Large cache extent to keep more items alive slivers: [ SliverList( delegate: SliverChildBuilderDelegate( (context, index) => ImageListItem( key: ValueKey('image_$index'), // Unique key for each item url: imageUrls[index], index: index, ), childCount: imageUrls.length, ), ), ], ), ); } }

class ImageListItem extends StatefulWidget { final String url; final int index;

const ImageListItem({ super.key, required this.url, required this.index, });

@override State<ImageListItem> createState() => _ImageListItemState(); }

class _ImageListItemState extends State<ImageListItem> with AutomaticKeepAliveClientMixin { @override bool get wantKeepAlive => true; // This preserves the state

@override Widget build(BuildContext context) { super.build(context); // Needed for AutomaticKeepAliveClientMixin

print("Rebuild -----> ${widget.index}");

return Padding(
  padding: const EdgeInsets.all(8.0),
  child: InkWell(
    onTap: () {
      print("url -----> ${widget.url}");
      Navigator.push(
        context,
        MaterialPageRoute(
          builder: (context) => Scaffold(
            appBar: AppBar(title: const Text('Details')),
            body: Center(
                child: CachedNetworkImage(
                  imageUrl: widget.url,
                  cacheKey: widget.url,
                )),
          ),
        ),
      );
    },
    child: CachedNetworkImage(
      imageUrl: widget.url,
      cacheKey: widget.url,
      // Ensures consistent caching
      maxWidthDiskCache: 1000,
      // Cache the full size image
      maxHeightDiskCache: 1000,
      width: double.infinity,
      fit: BoxFit.cover,
      placeholder: (context, url) => Container(
        color: Colors.grey[200],
        height: 200,
        child: const Center(child: CircularProgressIndicator()),
      ),
      errorWidget: (context, url, error) => Container(
        color: Colors.grey[200],
        height: 200,
        child: const Icon(Icons.error),
      ),
    ),
  ),
);

} } `

and Here I'm using cached_network_image: ^3.4.1

Kindly let me know can we fix it, As many developers are facing the same issue. looking forward your swift response.