huixiang_app/lib/community/photo_view_gallery_screen.dart

import 'dart:io';
import 'package:flutter/material.dart';
import 'package:huixiang/utils/ImgCachePath.dart';
import 'package:network_to_file_image/network_to_file_image.dart';
import 'package:photo_view/photo_view.dart';
import 'package:photo_view/photo_view_gallery.dart';
import 'package:path/path.dart' as p;

class PhotoViewGalleryScreen extends StatefulWidget {
  List? images=[];
  int index=0;
  String? heroTag;
  PageController? controller;

  PhotoViewGalleryScreen({Key? key, this.images, this.index = 0, this.controller, this.heroTag}) : super(key: key){
    controller = PageController(initialPage: index);
  }

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

class _PhotoViewGalleryScreenState extends State<PhotoViewGalleryScreen> {
  int currentIndex=0;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    currentIndex=widget.index;
  }
  File fileFromDocsDir(String filename) {
    String pathName = p.join(ImgCachePath.instance.path, filename);
    return File(pathName);
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: <Widget>[
          Positioned(
            top: 0,
            left: 0,
            bottom: 0,
            right: 0,
            child: GestureDetector(
              onTap: (){
                Navigator.of(context).pop();
              },
              child: Container(
                  color: Colors.black,
                  child: PhotoViewGallery.builder(
                    scrollPhysics: const BouncingScrollPhysics(),
                    builder: (BuildContext context, int index) {
                      return PhotoViewGalleryPageOptions(
                        imageProvider: NetworkToFileImage(
                          url: widget.images![index],
                          file: fileFromDocsDir(widget.images![index].toString()
                              .replaceAll("https://pos.upload.gznl.top/", "").replaceAll("/", "")),
                          debug: true,
                        ),
                        //图片的缩放级别
                        maxScale: PhotoViewComputedScale.contained *2.5,
                        minScale: PhotoViewComputedScale.contained *1,
                      );
                    },
                    itemCount: widget.images?.length ?? 0,
                    loadingBuilder: (context, progress) => Center(
                      child: Container(
                        width: 20.0,
                        height: 20.0,
                        child: CircularProgressIndicator(
                          value: progress == null || (progress.expectedTotalBytes == null && progress.expectedTotalBytes! > 0)
                              ? null
                              : progress.cumulativeBytesLoaded / progress.expectedTotalBytes!,
                        ),
                      ),
                    ),
                    backgroundDecoration: null,
                    pageController: widget.controller,
                    enableRotation: false,
                    onPageChanged: (index){
                      setState(() {
                        currentIndex=index;
                      });
                    },
                  )
              ),
            ),
          ),
          Positioned(//图片index显示
            top: MediaQuery.of(context).padding.top+15,
            width: MediaQuery.of(context).size.width,
            child: Center(
              child: Text(
                  "${currentIndex+1}/${widget.images?.length ?? 0}",
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 16,
                  ),
              ),
            ),
          ),
          Positioned(//右上角关闭按钮
            right: 10,
            top: MediaQuery.of(context).padding.top,
            child: IconButton(
              icon: Icon(Icons.close,size: 30,color: Colors.white,),
              onPressed: (){
                Navigator.of(context).pop();
              },
            ),
          ),
        ],
      ),
    );
  }
}