【flutter查看大图(可缩放、放大后可拖拽、保存到本地)】

查看大图(可双指缩放、拖拽、保存到本地)

dart 复制代码
import 'package:jade/utils/DialogUtils.dart';
import 'package:util/easy_loading_util.dart';
import 'package:util/image_util.dart';
import 'package:util/navigator_util.dart';
import 'package:util/permission_util.dart';
import 'package:util/screen_util.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:multi_image_picker/multi_image_picker.dart';
import 'package:photo_view/photo_view.dart';
import 'package:photo_view/photo_view_gallery.dart';

class PhotoShowAllWidget extends StatefulWidget {
  final List<String> galleryItems;
  final List<Asset> assetItems;
  final int index = 0;
  const PageController controller;

  PhotoShowAllWidget(
      {Key key,
      @required this.galleryItems,
      this.assetItems,
      this.index,
      this.controller})
      : super(key: key) {
    controller = PageController(initialPage: index);
  }

  @override
  State<StatefulWidget> createState() => _PhotoShowAllWidgetState();
}

class _PhotoShowAllWidgetState extends State<PhotoShowAllWidget> {
  int currentIndex = 0;

  @override
  void initState() {
    super.initState();
    currentIndex = widget.index;
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        NavigatorUtil.pop(value: true);
      },
      child: Scaffold(
        backgroundColor: Colors.black,
        body: Column(
          children: [
            Expanded(
                child: Container(
              width: getScreenWidth() / 0.5,
              height: getScreenHeight() / 0.5,
              child: PhotoViewGallery.builder(
                scrollPhysics: const BouncingScrollPhysics(),
                builder: (BuildContext context, int index) {
                  return PhotoViewGalleryPageOptions(
                    // initialScale: PhotoViewComputedScale.contained * 0.8,
                    minScale: PhotoViewComputedScale.contained * 1.0,
                    maxScale: PhotoViewComputedScale.covered * 1.0,
                    imageProvider: widget.galleryItems == null ||
                            widget.galleryItems.length == 0
                        ? AssetThumbImageProvider(widget.assetItems[index],
                            width: widget.assetItems[index].originalWidth,
                            height: widget.assetItems[index].originalHeight)
                        : CachedNetworkImageProvider(
                            widget.galleryItems[index]),
                  );
                },
                itemCount: widget.galleryItems == null ||
                        widget.galleryItems.length == 0
                    ? widget.assetItems.length
                    : widget.galleryItems.length,
                loadingBuilder: (context, event) => Center(
                  child: Container(
                    width: 20.0,
                    height: 20.0,
                    child: CircularProgressIndicator(
                      value: event == null
                          ? 0
                          : event.cumulativeBytesLoaded /
                              event.expectedTotalBytes,
                    ),
                  ),
                ),
                backgroundDecoration: null,
                pageController: widget.controller,

                /// 是否开启旋转
                enableRotation: false,
                onPageChanged: (index) {
                  setState(() {
                    currentIndex = index;
                  });
                },
              ),
            )),
            widget.galleryItems != null
                ? Container(
                    alignment: Alignment.center,
                    child: IconButton(
                      color: Colors.white,
                      onPressed: () async {
                        bool _isAuth = await PermissionUtil.isAuthStorage();
                        if(!_isAuth){
                          WidgetsBinding.instance.addPostFrameCallback((_){
                            DialogUtils().showGeneralDialogFunction(context,'用于保存图片等场景',notClose: true);
                            Future.delayed(Duration(seconds: 5),(){
                              Navigator.of(context).pop();
                            });
                          });
                        }

                        ImageUtil.saveImage(widget.galleryItems[currentIndex])
                            .then((value) {
                          if (value) {
                            esLoadingSuccess('保存成功');
                          } else {
                            esLoadingError('保存失败');
                          }
                        });
                      },
                      icon: Icon(Icons.save_alt),
                    ),
                  )
                : Container()
          ],
        ),
      ),
    );
  }
}

调用

dart 复制代码
  // 查看图片大图
  Future<void> _toViewBigPhoto(BuildContext context, List imagePic, int index) async {
    List<String> galleryItems = []; //图片url集合
    articlePic.forEach((element) {
      galleryItems.add(element.url);
    });
    NavigatorUtil.push(PhotoShowAllWidget(
      galleryItems: galleryItems,
      index: index, //显示图片的下标
    ));
  }
相关推荐
小蜜蜂嗡嗡4 小时前
Android Studio flutter项目运行、打包时间太长
android·flutter·android studio
瓜子三百克8 小时前
十、高级概念
flutter
帅次21 小时前
Objective-C面向对象编程:类、对象、方法详解(保姆级教程)
flutter·macos·ios·objective-c·iphone·swift·safari
小蜜蜂嗡嗡1 天前
flutter flutter_vlc_player播放视频设置循环播放失效、初始化后获取不到视频宽高
flutter
孤鸿玉1 天前
[Flutter小技巧] Row中widget高度自适应的几种方法
flutter
bawomingtian1231 天前
FlutterView 源码解析
flutter
Zender Han1 天前
Flutter 进阶:实现带圆角的 CircularProgressIndicator
flutter
nc_kai1 天前
Flutter 之 每日翻译 PreferredSizeWidget
java·前端·flutter
littlegnal1 天前
Flutter Add-to-app profiling
flutter