zoomable_image.dart 8.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265
  1. import 'dart:async';
  2. import 'dart:io';
  3. import 'package:flutter/material.dart';
  4. import 'package:flutter/widgets.dart';
  5. import 'package:logging/logging.dart';
  6. import 'package:photo_view/photo_view.dart';
  7. import 'package:photos/core/cache/thumbnail_in_memory_cache.dart';
  8. import 'package:photos/core/constants.dart';
  9. import 'package:photos/core/event_bus.dart';
  10. import 'package:photos/db/files_db.dart';
  11. import 'package:photos/events/files_updated_event.dart';
  12. import 'package:photos/events/local_photos_updated_event.dart';
  13. import 'package:photos/models/file.dart';
  14. import 'package:photos/ui/common/loading_widget.dart';
  15. import 'package:photos/utils/file_util.dart';
  16. import 'package:photos/utils/image_util.dart';
  17. import 'package:photos/utils/thumbnail_util.dart';
  18. class ZoomableImage extends StatefulWidget {
  19. final File photo;
  20. final Function(bool)? shouldDisableScroll;
  21. final String? tagPrefix;
  22. final Decoration? backgroundDecoration;
  23. const ZoomableImage(
  24. this.photo, {
  25. Key? key,
  26. this.shouldDisableScroll,
  27. required this.tagPrefix,
  28. this.backgroundDecoration,
  29. }) : super(key: key);
  30. @override
  31. State<ZoomableImage> createState() => _ZoomableImageState();
  32. }
  33. class _ZoomableImageState extends State<ZoomableImage>
  34. with SingleTickerProviderStateMixin {
  35. late Logger _logger;
  36. late File _photo;
  37. ImageProvider? _imageProvider;
  38. bool _loadedSmallThumbnail = false;
  39. bool _loadingLargeThumbnail = false;
  40. bool _loadedLargeThumbnail = false;
  41. bool _loadingFinalImage = false;
  42. bool _loadedFinalImage = false;
  43. ValueChanged<PhotoViewScaleState>? _scaleStateChangedCallback;
  44. bool _isZooming = false;
  45. PhotoViewController _photoViewController = PhotoViewController();
  46. int? _thumbnailWidth;
  47. @override
  48. void initState() {
  49. _photo = widget.photo;
  50. _logger = Logger("ZoomableImage_" + _photo.displayName);
  51. debugPrint('initState for ${_photo.toString()}');
  52. _scaleStateChangedCallback = (value) {
  53. if (widget.shouldDisableScroll != null) {
  54. widget.shouldDisableScroll!(value != PhotoViewScaleState.initial);
  55. }
  56. _isZooming = value != PhotoViewScaleState.initial;
  57. debugPrint("isZooming = $_isZooming, currentState $value");
  58. // _logger.info('is reakky zooming $_isZooming with state $value');
  59. };
  60. super.initState();
  61. }
  62. @override
  63. void dispose() {
  64. _photoViewController.dispose();
  65. super.dispose();
  66. }
  67. @override
  68. Widget build(BuildContext context) {
  69. if (_photo.isRemoteFile) {
  70. _loadNetworkImage();
  71. } else {
  72. _loadLocalImage(context);
  73. }
  74. Widget content;
  75. if (_imageProvider != null) {
  76. content = PhotoViewGestureDetectorScope(
  77. axis: Axis.vertical,
  78. child: PhotoView(
  79. imageProvider: _imageProvider,
  80. controller: _photoViewController,
  81. scaleStateChangedCallback: _scaleStateChangedCallback,
  82. minScale: PhotoViewComputedScale.contained,
  83. gaplessPlayback: true,
  84. heroAttributes: PhotoViewHeroAttributes(
  85. tag: widget.tagPrefix! + _photo.tag,
  86. ),
  87. backgroundDecoration: widget.backgroundDecoration as BoxDecoration?,
  88. ),
  89. );
  90. } else {
  91. content = const EnteLoadingWidget();
  92. }
  93. final GestureDragUpdateCallback? verticalDragCallback = _isZooming
  94. ? null
  95. : (d) => {
  96. if (!_isZooming && d.delta.dy > dragSensitivity)
  97. {Navigator.of(context).pop()}
  98. };
  99. return GestureDetector(
  100. onVerticalDragUpdate: verticalDragCallback,
  101. child: content,
  102. );
  103. }
  104. void _loadNetworkImage() {
  105. if (!_loadedSmallThumbnail && !_loadedFinalImage) {
  106. final cachedThumbnail = ThumbnailInMemoryLruCache.get(_photo);
  107. if (cachedThumbnail != null) {
  108. _imageProvider = Image.memory(cachedThumbnail).image;
  109. _loadedSmallThumbnail = true;
  110. _captureThumbnailDimensions(_imageProvider!);
  111. } else {
  112. getThumbnailFromServer(_photo).then((file) {
  113. final imageProvider = Image.memory(file).image;
  114. if (mounted) {
  115. precacheImage(imageProvider, context).then((value) {
  116. if (mounted) {
  117. setState(() {
  118. _imageProvider = imageProvider;
  119. _loadedSmallThumbnail = true;
  120. _captureThumbnailDimensions(_imageProvider!);
  121. });
  122. }
  123. }).catchError((e) {
  124. _logger.severe("Could not load image " + _photo.toString());
  125. _loadedSmallThumbnail = true;
  126. });
  127. }
  128. });
  129. }
  130. }
  131. if (!_loadedFinalImage && !_loadingFinalImage) {
  132. _loadingFinalImage = true;
  133. getFileFromServer(_photo).then((file) {
  134. _onFinalImageLoaded(
  135. Image.file(
  136. file!,
  137. gaplessPlayback: true,
  138. ).image,
  139. );
  140. });
  141. }
  142. }
  143. void _loadLocalImage(BuildContext context) {
  144. if (!_loadedSmallThumbnail &&
  145. !_loadedLargeThumbnail &&
  146. !_loadedFinalImage) {
  147. final cachedThumbnail =
  148. ThumbnailInMemoryLruCache.get(_photo, thumbnailSmallSize);
  149. if (cachedThumbnail != null) {
  150. _imageProvider = Image.memory(cachedThumbnail).image;
  151. _loadedSmallThumbnail = true;
  152. }
  153. }
  154. if (!_loadingLargeThumbnail &&
  155. !_loadedLargeThumbnail &&
  156. !_loadedFinalImage) {
  157. _loadingLargeThumbnail = true;
  158. getThumbnailFromLocal(_photo, size: thumbnailLargeSize, quality: 100)
  159. .then((cachedThumbnail) {
  160. if (cachedThumbnail != null) {
  161. _onLargeThumbnailLoaded(Image.memory(cachedThumbnail).image, context);
  162. }
  163. });
  164. }
  165. if (!_loadingFinalImage && !_loadedFinalImage) {
  166. _loadingFinalImage = true;
  167. getFile(
  168. _photo,
  169. isOrigin: Platform.isIOS &&
  170. _isGIF(), // since on iOS GIFs playback only when origin-files are loaded
  171. ).then((file) {
  172. if (file != null && file.existsSync()) {
  173. _onFinalImageLoaded(Image.file(file).image);
  174. } else {
  175. _logger.info("File was deleted " + _photo.toString());
  176. if (_photo.uploadedFileID != null) {
  177. _photo.localID = null;
  178. FilesDB.instance.update(_photo);
  179. _loadNetworkImage();
  180. } else {
  181. FilesDB.instance.deleteLocalFile(_photo);
  182. Bus.instance.fire(
  183. LocalPhotosUpdatedEvent(
  184. [_photo],
  185. type: EventType.deletedFromDevice,
  186. source: "zoomPreview",
  187. ),
  188. );
  189. }
  190. }
  191. });
  192. }
  193. }
  194. void _onLargeThumbnailLoaded(
  195. ImageProvider imageProvider,
  196. BuildContext context,
  197. ) {
  198. if (mounted && !_loadedFinalImage) {
  199. precacheImage(imageProvider, context).then((value) {
  200. if (mounted && !_loadedFinalImage) {
  201. setState(() {
  202. _imageProvider = imageProvider;
  203. _loadedLargeThumbnail = true;
  204. });
  205. }
  206. });
  207. }
  208. }
  209. void _onFinalImageLoaded(ImageProvider imageProvider) {
  210. if (mounted) {
  211. precacheImage(imageProvider, context).then((value) async {
  212. if (mounted) {
  213. await _updatePhotoViewController(imageProvider);
  214. setState(() {
  215. _imageProvider = imageProvider;
  216. _loadedFinalImage = true;
  217. _logger.info("Final image loaded");
  218. });
  219. }
  220. });
  221. }
  222. }
  223. Future<void> _captureThumbnailDimensions(ImageProvider imageProvider) async {
  224. final imageInfo = await getImageInfo(imageProvider);
  225. _thumbnailWidth = imageInfo.image.width;
  226. }
  227. Future<void> _updatePhotoViewController(ImageProvider imageProvider) async {
  228. if (_thumbnailWidth == null || _photoViewController.scale == null) {
  229. return;
  230. }
  231. final imageInfo = await getImageInfo(imageProvider);
  232. final scale = _photoViewController.scale! /
  233. (imageInfo.image.width / _thumbnailWidth!);
  234. final currentPosition = _photoViewController.value.position;
  235. final positionScaleFactor = 1 / scale;
  236. final newPosition = currentPosition.scale(
  237. positionScaleFactor,
  238. positionScaleFactor,
  239. );
  240. _photoViewController = PhotoViewController(
  241. initialPosition: newPosition,
  242. initialScale: scale,
  243. );
  244. }
  245. bool _isGIF() => _photo.displayName.toLowerCase().endsWith(".gif");
  246. }