mymuseum-visitapp/lib/Components/SliderImages.dart

import 'dart:convert';
import 'package:mymuseum_visitapp/Components/Carousel/carousel_slider.dart' as cs;
import 'package:flutter/material.dart';
import 'package:manager_api/api.dart';
import 'package:mymuseum_visitapp/Components/ShowImagePopup.dart';
import 'package:mymuseum_visitapp/Models/resourceModel.dart';
import 'package:mymuseum_visitapp/Models/visitContext.dart';
import 'package:mymuseum_visitapp/app_context.dart';
import 'package:mymuseum_visitapp/constants.dart';
import 'package:provider/provider.dart';

class SliderImagesWidget extends StatefulWidget {
  final List<ResourceModel?> resources;
  final List<ContentDTO?> contentsDTO;
  final double height;
  SliderImagesWidget({required this.resources, required this.height, required this.contentsDTO});

  @override
  _SliderImagesWidget createState() => _SliderImagesWidget();
}

class _SliderImagesWidget extends State<SliderImagesWidget> {
  List<ResourceModel?> resourcesInWidget = [];
  late cs.CarouselController? sliderController;
  final ValueNotifier<int> currentIndex = ValueNotifier<int>(1);

  @override
  void initState() {
    sliderController = cs.CarouselController();
    resourcesInWidget = widget.resources;
    super.initState();
  }

  @override
  void dispose() {
    sliderController = null;
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    final appContext = Provider.of<AppContext>(context);
    VisitAppContext visitAppContext = appContext.getContext() as VisitAppContext;
    Size size = MediaQuery.of(context).size;
    return Column(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: [
        Stack(
            children: [
              Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  if(resourcesInWidget.isNotEmpty)
                    cs.CarouselSlider(
                      carouselController: sliderController,
                      options: cs.CarouselOptions(
                        onPageChanged: (int index, cs.CarouselPageChangedReason reason) {
                          //setState(() {
                            //print("SET STATE");
                            currentIndex.value = index + 1;
                          //});
                        },
                        height: widget.height * 0.86,
                        enlargeCenterPage: true,
                        reverse: false,
                      ),
                      items: resourcesInWidget.map<Widget>((i) {
                        return Builder(
                          builder: (BuildContext context) {
                            //print(widget.imagesDTO[currentIndex-1]);
                            return Padding(
                              padding: const EdgeInsets.only(top: 5.0),
                              child: InkWell(
                                onTap: () {
                                  showImagePopup(widget.contentsDTO[currentIndex.value-1]!, i!, appContext, context, size);
                                },
                                child: ClipRRect(
                                  borderRadius: BorderRadius.circular(15.0),
                                  child: visitAppContext.configuration!.isOffline! ?
                                    Image.memory(base64Decode(i!.data!)) :
                                    Image.network(
                                        i!.source!,
                                        loadingBuilder: (BuildContext context, Widget child,
                                            ImageChunkEvent? loadingProgress) {
                                          if (loadingProgress == null) {
                                            return child;
                                          }
                                          return Center(
                                            child: CircularProgressIndicator(
                                              color: kMainColor1,
                                              value: loadingProgress.expectedTotalBytes != null
                                                  ? loadingProgress.cumulativeBytesLoaded /
                                                  loadingProgress.expectedTotalBytes!
                                                  : null,
                                            ),
                                          );
                                        },
                                    ) /*PhotoView(
                                      imageProvider: Image.memory(base64Decode(i!.data!)).image,
                                      minScale: PhotoViewComputedScale.contained * 0.8,
                                      maxScale: PhotoViewComputedScale.contained * 3.0,
                                      backgroundDecoration: BoxDecoration(
                                        color: Colors.transparent,
                                        /*shape: BoxShape.rectangle,
                                        borderRadius: BorderRadius.circular(15.0),*/
                                      ),
                                    )*/,
                                ),
                              ),
                            );
                          },
                        );
                      }).toList(),
                    ),
                ],
              ),
              if(resourcesInWidget.length > 1)
                Positioned(
                  top: widget.height * 0.4,
                  right: 0,
                  child: InkWell(
                    onTap: () {
                      sliderController!.nextPage(duration: const Duration(milliseconds: 500), curve: Curves.fastOutSlowIn);
                    },
                    child: const Icon(
                      Icons.chevron_right,
                      size: 45,
                      color: kMainColor2,
                    ),
                  )
              ),
              if(resourcesInWidget.length > 1)
                Positioned(
                  top: widget.height * 0.4,
                  left: 0,
                  child: InkWell(
                    onTap: () {
                      if (resourcesInWidget.isNotEmpty) {
                        sliderController!.previousPage(duration: const Duration(milliseconds: 500), curve: Curves.fastOutSlowIn);
                      }
                    },
                    child: const Icon(
                      Icons.chevron_left,
                      size: 45,
                      color: kMainColor2,
                    ),
                  )
              ),
              if(resourcesInWidget.isEmpty)
                  const Center(child: Text("Aucune image à afficher", style: TextStyle(fontSize: kNoneInfoOrIncorrect)))
            ]
        ),
        if(resourcesInWidget.isNotEmpty)
          Align(
              alignment: Alignment.bottomCenter,
              child: ValueListenableBuilder<int>(
                valueListenable: currentIndex,
                builder: (context, value, _) {
                  return Text(
                    currentIndex.value.toString()+'/'+resourcesInWidget.length.toString(),
                    style: const TextStyle(fontSize: kArticleContentSize, fontWeight: FontWeight.w500, color: kMainColor2),
                  );
                },
              )
          ),
      ],
    );
  }
}