Untitled

import 'dart:async';

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:gap/gap.dart';
import 'package:garibook/app/api/app_urls.dart';
import 'package:garibook/app/utilities/context.dart';
import 'package:garibook/app/utilities/theme_styles.dart';

class ImageSliderDialog extends StatefulWidget {
  final List<String> imageUrls;

  const ImageSliderDialog({Key? key, required this.imageUrls}) : super(key: key);

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

class _ImageSliderDialogState extends State<ImageSliderDialog> {
  late PageController _pageController;
  int _currentPage = 0;
  double? _imageHeight; // Store dynamic height

  @override
  void initState() {
    super.initState();
    _pageController = PageController(initialPage: _currentPage);
    _fetchImageSize(widget.imageUrls[0]); // Load first image size initially
  }

  Future<void> _fetchImageSize(String imageUrl) async {
    final image = Image.network(AppUrls.Image_Url + imageUrl);
    final completer = Completer<void>();

    image.image.resolve(const ImageConfiguration()).addListener(
      ImageStreamListener((ImageInfo info, bool _) {
        setState(() {
          double screenWidth = context.width * 0.80;
          double aspectRatio = info.image.width / info.image.height;
          _imageHeight = screenWidth / aspectRatio; // Calculate height dynamically
        });
        completer.complete();
      }),
    );

    return completer.future;
  }

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

  @override
  Widget build(BuildContext context) {
    return Dialog(
      backgroundColor: Colors.transparent,
      insetPadding: EdgeInsets.zero,
      child: SizedBox(
        width: context.width * 0.80,
        child: Stack(
          children: [
            Container(
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(10),
              ),
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  Align(
                    alignment: Alignment.topRight,
                    child: InkWell(
                      onTap: () => Navigator.of(context).pop(),
                      child: SizedBox(
                        height: 20,
                        width: 20,
                        child: CircleAvatar(
                          backgroundColor: Colors.white,
                          child: Icon(Icons.close, color: Colors.red, size: 12),
                        ),
                      ),
                    ),
                  ),
                  const Gap(10),
                  if (_imageHeight != null) // Show only when height is calculated
                    SizedBox(
                      height: _imageHeight,
                      child: ClipRRect(
                        borderRadius: BorderRadius.circular(10),
                        child: PageView.builder(
                          controller: _pageController,
                          itemCount: widget.imageUrls.length,
                          onPageChanged: (index) {
                            setState(() {
                              _currentPage = index;
                            });
                            _fetchImageSize(widget.imageUrls[index]);
                          },
                          itemBuilder: (context, index) {
                            return CachedNetworkImage(
                              imageUrl: AppUrls.Image_Url + widget.imageUrls[index],
                              imageBuilder: (context, imageProvider) => Container(
                                decoration: BoxDecoration(
                                  image: DecorationImage(
                                    image: imageProvider,
                                    fit: BoxFit.fill,
                                  ),
                                ),
                              ),
                              placeholder: (context, url) =>
                                  const CupertinoActivityIndicator(),
                              errorWidget: (context, url, error) => const Icon(
                                Icons.error,
                                color: ThemeStyles.whiteColor,
                              ),
                            );
                          },
                        ),
                      ),
                    ),
                  const SizedBox(height: 6),
                  // Indicator row with left and right arrows
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      InkWell(
                        splashColor: Colors.transparent,
                        highlightColor: Colors.transparent,
                        child: SizedBox(
                          height: 20,
                          width: 20,
                          child: Icon(
                            Icons.arrow_back_ios,
                            size: 14,
                            color: Colors.white.withOpacity(0.5),
                          ),
                        ),
                        onTap: () {
                          if (_currentPage > 0) {
                            _pageController.previousPage(
                              duration: const Duration(milliseconds: 300),
                              curve: Curves.easeInOut,
                            );
                          }
                        },
                      ),
                      Row(
                        children: List.generate(widget.imageUrls.length, (index) {
                          return Padding(
                            padding: const EdgeInsets.symmetric(horizontal: 5.0),
                            child: Container(
                              width: 10,
                              height: 10,
                              decoration: BoxDecoration(
                                border: Border.all(
                                  width: 1,
                                  color: _currentPage == index
                                      ? Colors.transparent
                                      : Colors.white.withOpacity(0.5),
                                ),
                                shape: BoxShape.circle,
                                color: _currentPage == index
                                    ? Colors.white.withOpacity(0.5)
                                    : Colors.transparent,
                              ),
                            ),
                          );
                        }),
                      ),
                      InkWell(
                        splashColor: Colors.transparent,
                        highlightColor: Colors.transparent,
                        child: SizedBox(
                          height: 20,
                          width: 20,
                          child: Icon(
                            Icons.arrow_forward_ios,
                            size: 14,
                            color: Colors.white.withOpacity(0.5),
                          ),
                        ),
                        onTap: () {
                          if (_currentPage < widget.imageUrls.length - 1) {
                            _pageController.nextPage(
                              duration: const Duration(milliseconds: 300),
                              curve: Curves.easeInOut,
                            );
                          }
                        },
                      ),
                    ],
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}

// Example usage
void showImageSliderDialog(BuildContext context, {List<String>? imageUrls}) {
  showDialog(
    barrierColor: Colors.black.withOpacity(0.6),
    context: context,
    builder: (context) {
      return ImageSliderDialog(
        imageUrls: imageUrls ?? [],
      );
    },
  );
}