Ad

How To Give Image Url To Another String When Carousel Changes?

- 1 answer

It might be silly question but i want to save image url from carousel to another String pathImage to save it on gallery. when i swipe to next image in carousel i want to update imagePath to that swiped image url in carousel. i am using carousel_pro and gallery_saver packages. This is code:

import 'package:carousel_pro/carousel_pro.dart';
import 'package:flutter/material.dart';
import 'package:pursattm/models/models.dart';
import 'package:pursattm/utils/utils.dart';
import 'package:gallery_saver/gallery_saver.dart';

class DetailsFullImage extends StatefulWidget {
  DetailsFullImage({Key key, this.imagesForCarousel}) : super(key: key);

  final List<Images> imagesForCarousel;
  @override
  _DetailsFullImageState createState() => _DetailsFullImageState();
}

class _DetailsFullImageState extends State<DetailsFullImage> {
  // image download declarations
  String pathImage = '';
  String albumName = 'Media';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: Center(
        child: Container(
          height: SizeConfig.sh / 3,
          child: Carousel(
            // onImageChange: () {},
            images: widget.imagesForCarousel.map((image) {
              pathImage = image.url; // declaring image.url to pathImage
              return CachedNetworkImage(
                imageUrl: image.url,
                fit: BoxFit.fill,
                alignment: Alignment.bottomCenter,
                placeholder: (context, url) => Image.asset(
                  'assets/placeholder.png',
                  fit: BoxFit.fill,
                ),
                errorWidget: (context, url, error) {
                  return Center(
                    child: Icon(
                      Icons.refresh,
                      color: Colors.black12,
                    ),
                  );
                },
              );
            }).toList(),
            animationDuration: const Duration(seconds: 1),
            dotSize: 8.0,
            dotSpacing: 20.0,
            autoplay: false,
            autoplayDuration: const Duration(seconds: 4),
            dotColor: Colors.white,
            dotIncreasedColor: AppColors.GREEN_JUST,
            dotIncreaseSize: 2.2,
            dotPosition: DotPosition.bottomLeft,
            indicatorBgPadding: 15,
            dotBgColor: Colors.transparent,
            borderRadius: false,
            // moveIndicatorFromBottom: 250.0,
            noRadiusForIndicator: true,
          ),
        ),
      ),
      floatingActionButton: Builder(
        builder: (BuildContext context) {
          return FloatingActionButton(
            backgroundColor: Colors.white,
            onPressed: () async {
              GallerySaver.saveImage(pathImage, albumName: albumName)
                  .then((bool success) {
                setState(() {
                  Scaffold.of(context).showSnackBar(
                    SnackBar(
                      content: Text('Sucsess!'),
                      backgroundColor: Colors.green,
                      behavior: SnackBarBehavior.floating,
                    ),
                  );
                });
              }).catchError((e) {
                setState(() {
                  Scaffold.of(context).showSnackBar(
                    SnackBar(
                      content: Text('Error!'),
                      backgroundColor: Colors.red,
                      behavior: SnackBarBehavior.floating,
                    ),
                  );
                });
              });
            },
            child: Icon(
              Icons.file_download,
              color: AppColors.GREEN,
              size: 30,
            ),
          );
        },
      ),
    );
  }
}

Here when i press on floatingActionButton it should save imagePath from carousel on that displayed image from list of images in carousel. With this code imagePath is only taking last image Url from list of images in carousel.

Ad

Answer

You can try use onImageChange properties like this :

    onImageChange: (last, current) {
      setState (() {
       pathImage = widget.imagesForCarousel[current].url;
     });
    }

On image change event, passes previous image index and current image index as arguments. You can use that as advantage

Ad
source: stackoverflow.com
Ad