📸 Easy to use yet very customizable zoomable image widget for Flutter, Photo View provides a gesture sensitive zoomable widget. Photo View is largely used to show interacive images and other stuff such as SVG.
License: MIT License
Title
Since gesture support has been accepted to flutter, we may now have to think about how could we adapt Photo View to support this.
It would be nice if the widget would feel like a ListView. Bonus points if it also adapts to the feel of the current OS.
Relevant flutter issues:
flutter/flutter#23457
flutter/flutter#20175
If you don't specify the gaplessPlayback parameter in PhotoViewInline, the following exception is thrown. I believe the fix would be that you need to specify a default value for the PhotoViewInline constructor.
flutter: ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
flutter: The following assertion was thrown building Container(bg: BoxDecoration(color: Color(0xff000000))):
flutter: Failed assertion: boolean expression must not be null
flutter:
flutter: Either the assertion indicates an error in the framework itself, or we should provide substantially
flutter: more information in this error message to help you determine and fix the underlying cause.
flutter: In either case, please report this assertion by filing a bug on GitHub:
flutter: https://github.com/flutter/flutter/issues/new
flutter:
flutter: When the exception was thrown, this was the stack:
flutter: #0 _ImageState._updateSourceStream (package:flutter/src/widgets/image.dart:610:17)
flutter: #1 _ImageState._resolveImage (package:flutter/src/widgets/image.dart:591:5)
flutter: #2 _ImageState.didChangeDependencies (package:flutter/src/widgets/image.dart:561:5)
flutter: #3 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3803:12)
flutter: #4 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3653:5)
flutter: #5 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2937:14)
flutter: #6 Element.updateChild (package:flutter/src/widgets/framework.dart:2740:12)
flutter: #7 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4796:14)
flutter: #8 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2937:14)
flutter: #9 Element.updateChild (package:flutter/src/widgets/framework.dart:2740:12)
flutter: #10 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4796:14)
flutter: #11 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2937:14)
flutter: #12 Element.updateChild (package:flutter/src/widgets/framework.dart:2740:12)
flutter: #13 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4796:14)
flutter: #14 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2937:14)
flutter: #15 Element.updateChild (package:flutter/src/widgets/framework.dart:2740:12)
flutter: #16 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4796:14)
flutter: #17 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2937:14)
flutter: #18 Element.updateChild (package:flutter/src/widgets/framework.dart:2740:12)
flutter: #19 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3689:16)
flutter: #20 Element.rebuild (package:flutter/src/widgets/framework.dart:3531:5)
flutter: #21 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3658:5)
flutter: #22 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3653:5)
flutter: #23 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2937:14)
flutter: #24 Element.updateChild (package:flutter/src/widgets/framework.dart:2740:12)
flutter: #25 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4796:14)
flutter: #26 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2937:14)
flutter: #27 Element.updateChild (package:flutter/src/widgets/framework.dart:2740:12)
flutter: #28 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4796:14)
flutter: #29 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2937:14)
flutter: #30 Element.updateChild (package:flutter/src/widgets/framework.dart:2740:12)
flutter: #31 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3689:16)
flutter: #32 Element.rebuild (package:flutter/src/widgets/framework.dart:3531:5)
flutter: #33 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3658:5)
flutter: #34 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3805:11)
flutter: #35 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3653:5)
flutter: #36 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2937:14)
flutter: #37 Element.updateChild (package:flutter/src/widgets/framework.dart:2740:12)
flutter: #38 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3689:16)
flutter: #39 Element.rebuild (package:flutter/src/widgets/framework.dart:3531:5)
flutter: #40 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3658:5)
flutter: #41 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3653:5)
flutter: #42 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2937:14)
flutter: #43 Element.updateChild (package:flutter/src/widgets/framework.dart:2740:12)
flutter: #44 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3689:16)
flutter: #45 Element.rebuild (package:flutter/src/widgets/framework.dart:3531:5)
flutter: #46 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3658:5)
flutter: #47 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3805:11)
flutter: #48 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3653:5)
flutter: #49 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2937:14)
flutter: #50 Element.updateChild (package:flutter/src/widgets/framework.dart:2740:12)
flutter: #51 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3689:16)
flutter: #52 Element.rebuild (package:flutter/src/widgets/framework.dart:3531:5)
flutter: #53 StatefulElement.update (package:flutter/src/widgets/framework.dart:3835:5)
flutter: #54 Element.updateChild (package:flutter/src/widgets/framework.dart:2729:15)
flutter: #55 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3689:16)
flutter: #56 Element.rebuild (package:flutter/src/widgets/framework.dart:3531:5)
flutter: #57 BuildOwner.buildScope (package:flutter/src/widgets/framework.dart:2273:33)
flutter: #58 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding&WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:670:20)
flutter: #59 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:208:5)
flutter: #60 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:990:15)
flutter: #61 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:930:9)
flutter: #62 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:842:5)
flutter: #63 _invoke (dart:ui/hooks.dart:139:13)
flutter: #64 _drawFrame (dart:ui/hooks.dart:128:3)
flutter doctor
[✓] Flutter (Channel master, v0.9.7-pre.61, on Mac OS X 10.13.6 17G65, locale en-US)
• Flutter version 0.9.7-pre.61 at /Users/KG/Developer/Flutter/flutter
• Framework revision 2d81adf74c (2 days ago), 2018-10-05 22:29:37 -0700
• Engine revision 572fa5646a
• Dart version 2.1.0-dev.6.0.flutter-c6254163dc
[✓] Android toolchain - develop for Android devices (Android SDK 27.0.3)
• Android SDK at /Users/KG/Library/Android/sdk
• Android NDK location not configured (optional; useful for native profiling support)
• Platform android-28, build-tools 27.0.3
• ANDROID_HOME = /Users/KG/Library/Android/sdk
• Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1024-b01)
• All Android licenses accepted.
[✓] iOS toolchain - develop for iOS devices (Xcode 10.0)
• Xcode at /Applications/Xcode.app/Contents/Developer
• Xcode 10.0, Build version 10A255
• ios-deploy 1.9.2
• CocoaPods version 1.5.3
[✓] Android Studio (version 3.1)
• Android Studio at /Applications/Android Studio.app/Contents
• Flutter plugin version 28.0.1
• Dart plugin version 173.4700
• Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1024-b01)
[✓] IntelliJ IDEA Community Edition (version 2017.2.7)
• IntelliJ at /Applications/IntelliJ IDEA CE.app
• Flutter plugin version 21.2.2
• Dart plugin version 172.4343.25
[!] VS Code (version 1.21.1)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension not installed; install from
https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter
Provide a boolean option to avoid clamping the panning of the image in the borders of the container.
I need to somehow get an information about the position where a user tapped relative to the image. In other words I need to know the click location with regard to the scaled and translated image, not the widget itself.
When I wrap the PhotoViewInline with GestureDetector, I'm able to get the position of the tap with regard to the widget. Now, I need to offset that tap position to get the x, y of the image where the touch occoured.
First I want to thank you for this widget, it will be very useful if you can add:
First, thank you very much for this widget. It's very helpful. I have some questions here.
(1) I put it in a Container as shown in the example, but padding left and right does not work such as padding: EdgeInsets.only(left: 10.0, right: 10.0),. Is that possible to support padding? If it's not, it's OK.
(2) I just want to zoom in a photo, but NOT zoom out. How can I restrict the zoom out action? I tried to set minScale: 0.0, which is the default value, it does not do anything. I think minScale: 0.0, should restrict the zoom out action, otherwise what is the point of minScale?
Thanks a lot.
Edited:
Actually, padding left and right is kinda meaningless. You can simply ignore my first question.
So I am using the PhotoViewInline widget wrapped in a Card widget and displaying multiple Cards in a ListView.
So it worked fine until I tried to navigate to another context and Flutter started throwing this error:
There are multiple heroes that share the same tag within a subtree. Within each subtree for which heroes are to be animated (typically a PageRoute subtree), each Hero must have a unique non-null tag. In this case, multiple heroes had the following tag: nohero Here is the subtree for one of the offending heroes: # Hero(tag: nohero, state: _HeroState#db290)
I traced the Widget Tree until I found that PhotoViewInline didn't have a unique heroTag
, and thus when it calls its build method which has a PhotoView it will have a "nohero" heroTag.
I was able to fix this by adding a heroTag Object in the constructor of PhotoViewInline and passing that in the build method to the PhotoView heroTag like so:
class PhotoViewInline extends StatefulWidget{
final ImageProvider imageProvider;
final Widget loadingChild;
final Color backgroundColor;
final dynamic minScale;
final dynamic maxScale;
final Object heroTag; //ADDED THIS
const PhotoViewInline({
Key key,
@required this.imageProvider,
this.loadingChild,
this.backgroundColor = const Color.fromRGBO(0, 0, 0, 1.0),
this.minScale,
this.maxScale,
this.heroTag, //ADDED THIS
}) : super(key: key);
@override
State<StatefulWidget> createState() => new _PhotoViewInlineState();
}
class _PhotoViewInlineState extends State<PhotoViewInline> with AfterLayoutMixin<PhotoViewInline>{
Size _size;
@override
void afterFirstLayout(BuildContext context) {
setState(() {
_size = context.size;
});
}
@override
Widget build(BuildContext context) {
return new PhotoView(
heroTag: widget.heroTag, //ADDED THIS
imageProvider: widget.imageProvider,
loadingChild: widget.loadingChild,
backgroundColor: widget.backgroundColor,
minScale: widget.minScale,
maxScale: widget.maxScale,
size: _size,
);
}Should I create a Pull Request with the fix?
When PhotoView is resized, the base size keeps the initial value.
How to add Dynamic data in loop for PhotoViewGalleryPageOptions
Thanks for your wonderful plugin!
Can you guys, add a padding parameter to PhotoViewGallery or some where else?
I need to add some padding between photos in gallery.
Thank you for the awesome framework. I can use your app for the asset images and network images perfectly. However, in my app, I still need to zoom in and zoom out the image which is picked by user by the image_picker framework. I can access the Image from that framework , but I cant make it work for the imageProvider. Can you help me about this issue?
Thank you.
I saw the following exceptions thrown in the console:
I/flutter ( 2935): ══╡ EXCEPTION CAUGHT BY IMAGE RESOURCE SERVICE ╞════════════════════════════════════════════════════
I/flutter ( 2935): The following StateError was thrown by an image listener:
I/flutter ( 2935): Bad state: Future already completed
I/flutter ( 2935):
I/flutter ( 2935): When the exception was thrown, this was the stack:
I/flutter ( 2935): #1 _PhotoViewState._getImage.<anonymous closure> (package:photo_view/photo_view.dart:42:17)
I/flutter ( 2935): #2 ImageStreamCompleter.setImage (package:flutter/src/painting/image_stream.dart:278:17)
I/flutter ( 2935): #3 MultiFrameImageStreamCompleter._emitFrame (package:flutter/src/painting/image_stream.dart:519:5)
I/flutter ( 2935): #4 MultiFrameImageStreamCompleter._decodeNextFrameAndSchedule (package:flutter/src/painting/image_stream.dart:512:7)
I/flutter ( 2935): <asynchronous suspension>
I/flutter ( 2935): #5 MultiFrameImageStreamCompleter.addListener (package:flutter/src/painting/image_stream.dart:528:7)
I/flutter ( 2935): #6 ImageStream.addListener (package:flutter/src/painting/image_stream.dart:158:25)
I/flutter ( 2935): #7 _PhotoViewState._getImage (package:photo_view/photo_view.dart:44:12)
I/flutter ( 2935): #8 _PhotoViewState.build (package:photo_view/photo_view.dart:69:17)
I/flutter ( 2935): #9 StatefulElement.build (package:flutter/src/widgets/framework.dart:3743:27)
I/flutter ( 2935): #10 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3655:15)
I/flutter ( 2935): #11 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #12 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #13 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3782:11)
I/flutter ( 2935): #14 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #15 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #16 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #17 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #18 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #19 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #20 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #21 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #22 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #23 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #24 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #25 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #26 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #27 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #28 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #29 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #30 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #31 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #32 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #33 ParentDataElement.mount (package:flutter/src/widgets/framework.dart:3968:11)
I/flutter ( 2935): #34 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #35 MultiChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4772:32)
I/flutter ( 2935): #36 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #37 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #38 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #39 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #40 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #41 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3782:11)
I/flutter ( 2935): #42 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #43 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #44 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #45 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #46 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #47 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #48 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #49 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #50 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #51 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #52 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #53 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #54 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3782:11)
I/flutter ( 2935): #55 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #56 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #57 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #58 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4667:14)
I/flutter ( 2935): #59 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #60 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #61 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #62 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #63 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #64 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #65 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #66 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #67 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4667:14)
I/flutter ( 2935): #68 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #69 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #70 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #71 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #72 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #73 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3782:11)
I/flutter ( 2935): #74 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #75 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #76 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #77 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #78 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #79 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #80 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3782:11)
I/flutter ( 2935): #81 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #82 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #83 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #84 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #85 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #86 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #87 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #88 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #89 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #90 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #91 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #92 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #93 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #94 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #95 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #96 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #97 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #98 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #99 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3782:11)
I/flutter ( 2935): #100 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #101 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #102 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #103 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #104 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #105 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #106 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #107 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #108 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #109 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4667:14)
I/flutter ( 2935): #110 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #111 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #112 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #113 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #114 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #115 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #116 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #117 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #118 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4667:14)
I/flutter ( 2935): #119 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #120 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #121 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4667:14)
I/flutter ( 2935): #122 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #123 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #124 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4667:14)
I/flutter ( 2935): #125 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #126 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #127 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4667:14)
I/flutter ( 2935): #128 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #129 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #130 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #131 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #132 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #133 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3782:11)
I/flutter ( 2935): #134 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #135 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #136 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #137 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #138 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #139 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #140 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #141 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #142 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #143 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #144 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #145 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #146 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3782:11)
I/flutter ( 2935): #147 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #148 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #149 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #150 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4667:14)
I/flutter ( 2935): #151 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #152 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #153 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #154 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #155 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #156 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #157 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #158 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #159 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4667:14)
I/flutter ( 2935): #160 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #161 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #162 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #163 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #164 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #165 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3782:11)
I/flutter ( 2935): #166 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #167 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #168 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #169 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #170 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #171 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #172 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #173 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #174 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #175 SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:4667:14)
I/flutter ( 2935): #176 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #177 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #178 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #179 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #180 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #181 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #182 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #183 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #184 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #185 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #186 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #187 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3782:11)
I/flutter ( 2935): #188 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #189 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #190 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #191 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #192 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #193 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:3635:5)
I/flutter ( 2935): #194 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:3782:11)
I/flutter ( 2935): #195 ComponentElement.mount (package:flutter/src/widgets/framework.dart:3630:5)
I/flutter ( 2935): #196 Element.inflateWidget (package:flutter/src/widgets/framework.dart:2920:14)
I/flutter ( 2935): #197 Element.updateChild (package:flutter/src/widgets/framework.dart:2723:12)
I/flutter ( 2935): #198 RenderObjectElement.updateChildren (package:flutter/src/widgets/framework.dart:4450:32)
I/flutter ( 2935): #199 MultiChildRenderObjectElement.update (package:flutter/src/widgets/framework.dart:4782:17)
I/flutter ( 2935): #200 Element.updateChild (package:flutter/src/widgets/framework.dart:2712:15)
I/flutter ( 2935): #201 _TheatreElement.update (package:flutter/src/widgets/overlay.dart:507:16)
I/flutter ( 2935): #202 Element.updateChild (package:flutter/src/widgets/framework.dart:2712:15)
I/flutter ( 2935): #203 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #204 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #205 StatefulElement.update (package:flutter/src/widgets/framework.dart:3812:5)
I/flutter ( 2935): #206 Element.updateChild (package:flutter/src/widgets/framework.dart:2712:15)
I/flutter ( 2935): #207 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #208 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #209 ProxyElement.update (package:flutter/src/widgets/framework.dart:3922:5)
I/flutter ( 2935): #210 Element.updateChild (package:flutter/src/widgets/framework.dart:2712:15)
I/flutter ( 2935): #211 SingleChildRenderObjectElement.update (package:flutter/src/widgets/framework.dart:4674:14)
I/flutter ( 2935): #212 Element.updateChild (package:flutter/src/widgets/framework.dart:2712:15)
I/flutter ( 2935): #213 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #214 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #215 StatefulElement.update (package:flutter/src/widgets/framework.dart:3812:5)
I/flutter ( 2935): #216 Element.updateChild (package:flutter/src/widgets/framework.dart:2712:15)
I/flutter ( 2935): #217 SingleChildRenderObjectElement.update (package:flutter/src/widgets/framework.dart:4674:14)
I/flutter ( 2935): #218 Element.updateChild (package:flutter/src/widgets/framework.dart:2712:15)
I/flutter ( 2935): #219 SingleChildRenderObjectElement.update (package:flutter/src/widgets/framework.dart:4674:14)
I/flutter ( 2935): #220 Element.updateChild (package:flutter/src/widgets/framework.dart:2712:15)
I/flutter ( 2935): #221 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3666:16)
I/flutter ( 2935): #222 Element.rebuild (package:flutter/src/widgets/framework.dart:3508:5)
I/flutter ( 2935): #223 BuildOwner.buildScope (package:flutter/src/widgets/framework.dart:2255:33)
I/flutter ( 2935): #224 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&RendererBinding&WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:626:20)
I/flutter ( 2935): #225 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:208:5)
I/flutter ( 2935): #226 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:990:15)
I/flutter ( 2935): #227 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:930:9)
I/flutter ( 2935): #228 _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:842:5)
I/flutter ( 2935): #229 _invoke (dart:ui/hooks.dart:128:13)
I/flutter ( 2935): #230 _drawFrame (dart:ui/hooks.dart:117:3)
I/flutter ( 2935): (elided one frame from package dart:async)
I/flutter ( 2935): ════════════════════════════════════════════════════════════════════════════════════════════════════
Right now we have 10 options on our constructor. For each one we change, we have to update option in PhotoViewInline as well. It is becoming hard to maintain, so I think we should change from PhotoViewInline() to PhotoView.inline() since the inline has the same visual outcome as Photoview
Is it possible already? If not, will it?
Dart 2 is out there and people are already using it.
Try to make it backward compatible.
setState() called after dispose() is being thrown when I'm trying to add an item to a List<PhotoViewGalleryPageOptions>
My Setup:
return PhotoViewGallery(
pageOptions: List<PhotoViewGalleryPageOptions>
);And I'm doing setState() on every page change - onPageChanged()
It is time to think about a gallery component, where swiping for the side edges of the screen changes to next/prev images
I have the below code to show a zoomable image and another widget below it.
When I zoom the image to a larger scale, the image overlaps the second widget below the container.
return Column(
children: <Widget>[
Expanded(
child: Container(
height: 300.0,
margin: const EdgeInsets.symmetric(vertical: 20.0),
child: PhotoViewInline(
imageProvider: CachedNetworkImageProvider(
post.imageUrl,
),
),
),
),
getFeedWidget(),
],
);
The second widget is visible over the zoomable image. Ideally, user should see only the zoomable image.
photo_view is very nice library.
It helps me to show my app users photos easily.
I found an issue about importing src/photo_view_scale_state.dart.
I need to handle my app state by using PhotoViewScaleState and I'm using scaleStateChangedCallback to do that.
I need import 'package:photo_view/src/photo_view_scale_state.dart'; to use PhotoViewScaleState in my project code, but if do so, I get warning from Android Studio like this.
I can build my app though.
Could you fix this?
Log of flutter doctor is here.
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel dev, v0.11.9, on Mac OS X 10.13.6 17G65, locale ja-JP)
[✓] Android toolchain - develop for Android devices (Android SDK 28.0.3)
[✓] iOS toolchain - develop for iOS devices (Xcode 10.1)
[✓] Android Studio (version 3.2)
[✓] IntelliJ IDEA Community Edition (version 2018.1.2)
[!] VS Code (version 1.27.2)
[✓] Connected device (1 available)
Hey,
Could you update the plugin so that you can set the flag transitionOnUserGestures as Hero was updated (#23320). I guess it is just updating your _buildHero() in photo_view_image_wrapper.dart.
Using RepaintBoundary with GlobalKey to take screenshot for PhotoView and output png file.
The output png file is only black.
Could you pls post an example with RepaintBoundary?
Currently when zooming too far into a part of the image, it would scale back nicely to the maxScale but also center the image.
Currently using this plugin: https://pub.dartlang.org/packages/flutter_svg
I'm currently using the widget with the following settings:
initialScale: 1.0,
minScale: 1.0,
maxScale: 3.0
I was expecting when i'm zooming out to the min scale, the zoom state should be either originalSize or initial. But it returns the state zooming
Add a param to specify the initial scale
setState() called after dispose(): _PhotoViewState(lifecycle state: defunct, not mounted)
it's because of the setState call in _getImage() in photo_view.dart. likely just needs a check for mounted.
This plugin is a very cool plugin! But I updated flutter version, the following build error has occurred.
compiler message: file:///root/.pub-cache/hosted/pub.dartlang.org/photo_view-0.0.6/lib/photo_view_scale_boundaries.dart:14:37: Error: Can't access 'this' in a field initializer to read 'computeMaxScale'.
compiler message: assert(computeMinScale() <= computeMaxScale());
compiler message: ^^^^^^^^^^^^^^^
compiler message: file:///root/.pub-cache/hosted/pub.dartlang.org/photo_view-0.0.6/lib/photo_view_scale_boundaries.dart:14:16: Error: Can't access 'this' in a field initializer to read 'computeMinScale'.
compiler message: assert(computeMinScale() <= computeMaxScale());
compiler message: ^^^^^^^^^^^^^^^
Compiler terminated unexpectedly.
% flutter doctor (git)-[feature/setting-theme-color]
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel dev, v0.6.2, on Mac OS X 10.13.6 17G2208, locale en-JP)
[✓] Android toolchain - develop for Android devices (Android SDK 28.0.1)
[✓] iOS toolchain - develop for iOS devices (Xcode 9.4.1)
[✓] Android Studio
✗ Flutter plugin not installed; this adds Flutter specific functionality.
✗ Dart plugin not installed; this adds Dart specific functionality.
[✓] Android Studio (version 3.1)
[✓] VS Code (version 1.26.0)
[✓] Connected devices (3 available)
• No issues found!
thanks.
Given the following scenario:
imageUrl.Future that returns the bodyBytes of the http.Response of imageUrl within FutureBuilder.FutureBuilder, use such bodyBytes to create a MemoryProvider and with that, create a PhotoView.When using MemoryProvider, the image selected "flickers" if the widget tree is re-rendered.
Here's a snippet to illustrate the scenario:
FutureBuilder(
future: _loadImage(),
builder: (context, snapshot) {
if (snapshot.hasData) {
var imageBytes = snapshot.data;
return PhotoView(
loadingChild: Center(child: CircularProgressIndicator()),
imageProvider: MemoryImage(imageBytes)
);
}
return CircularProgressIndicator();
}
);
Using a simple Image widget, one can avoid this behavior if the parameter gaplessPlayback is set to true. E.g.: Image.memory(bytes, gaplessPlayback: true)
Would you consider adding a factory constructor method that accepts an Image?
Currently it zooms to the center of the image/child widget. We have a rather big diagram as the child widget and it would be nice to quickly zoom to specific parts at a pre-defined zoom level. The part could be the exact location tapped or even better would be if it could snap to a grid.
I don't know if this is where feature requests go, but I will put it here. I just think this would make it work a little better.
I find out that the gallery mode is something like twitter-mode: you can't change image if its scale is bigger than 1.0 or _locked = scaleState != PhotoViewScaleState.contained.
So, is there any way to make _locked = false, while swipe reaches the image's edge(left or right), no matter whats scale the image has. And also swipe up or swipe down to close when reaches the image's edge(top or bottom).
What I'm saying is something like this(WeChat app):
But not use the _lock when contained happens:
// this is from the source
void scaleStateChangedCallback(PhotoViewScaleState scaleState) {
setState(() {
_locked = scaleState != PhotoViewScaleState.contained;
});
}
// may be
void scaleStateChangedCallback(PhotoViewScaleState scaleState) {
setState(() {
_locked = notReachTheImageEdge();
});
}
List<Map> imageList = [
{
'provider': const NetworkImage(
"https://img.zcool.cn/community/012c1559b2441ea801211d258355d3.jpg@1280w_1l_2o_100sh.jpg"),
'tag': 'tag1',
'fillScale': PhotoViewComputedScale.covered
},
{
'provider': const NetworkImage(
"http://img.pptjia.com/image/20180117/767f4b74a8d7b453b149430ee364c9ce.jpg"),
'tag': 'tag2',
'fillScale': PhotoViewComputedScale.contained
},
{
'provider': const NetworkImage(
"http://www.hiphotos.baidu.com/image/pic/item/8644ebf81a4c510f3666841a6b59252dd42aa514.jpg"),
'tag': 'tag3',
'fillScale': PhotoViewComputedScale.contained
},
{
'provider':
const NetworkImage("http://www.17qq.com/img_qqtouxiang/30526384.jpeg"),
'tag': 'tag4',
'fillScale': PhotoViewComputedScale.contained
}
];
List<PhotoViewGalleryPageOptions> _takePageOptions(
List<Map> imageProviderList) {
return imageProviderList.map(
(map) {
return PhotoViewGalleryPageOptions(
imageProvider: map['provider'],
minScale: map['fillScale'],
maxScale: PhotoViewComputedScale.covered * 1.1,
initialScale: map['fillScale'],
heroTag: map['tag'],
);
},
).toList();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
constraints: BoxConstraints.expand(
height: MediaQuery.of(context).size.height,
),
child: Stack(
alignment: Alignment.bottomRight,
children: <Widget>[
PhotoViewGallery(
pageOptions: _takePageOptions(widget.imageList),
// pageOptions: <PhotoViewGalleryPageOptions>[
// PhotoViewGalleryPageOptions(
// imageProvider: widget.imageProvider,
// heroTag: "tag1",
// ),
// PhotoViewGalleryPageOptions(
// imageProvider: widget.imageProvider2,
// heroTag: "tag2",
// maxScale: PhotoViewComputedScale.contained * 0.3),
// PhotoViewGalleryPageOptions(
// imageProvider: widget.imageProvider3,
// minScale: PhotoViewComputedScale.contained * 0.8,
// maxScale: PhotoViewComputedScale.covered * 1.1,
// heroTag: "tag3",
// ),
// ],
loadingChild: widget.loadingChild,
backgroundDecoration: widget.backgroundDecoration,
pageController: widget.pageController,
onPageChanged: onPageChanged,
),
Container(
padding: const EdgeInsets.all(20.0),
child: Text(
"Image ${currentIndex + 1}",
style: const TextStyle(
color: Colors.white, fontSize: 17.0, decoration: null),
),
)
],
)),
);
}Photo view gallery always starts from first index. Is there a way to use the gallery widget but start at say 5th image ? An example would be device gallery where we select an image and are able to swipe left right from there .. I tried looking at the code but I'm still wrapping my head around it so thought I'd check first :) Thanks !!
Expose a method that will make photo view go back the initial state
I expected this:
setState(() {
List<Size> size = [Size(960, 540), Size(541, 960)];
Image image = new Image(image: AssetImage("assets/image$count.jpg"));
photoview = PhotoView.customChild(
child: image,
childSize: size[count],
minScale: PhotoViewComputedScale.covered
);
});
to behave like this:
photoview = PhotoView(
imageProvider: AssetImage("assets/image$count.jpg")
);
(please ignore the hack of using the hardcoded sizes. I'm using CustomPaint widgets, I just wanted to give you an example with more standard children)
When switching from one image to the other, the extents of the pan/zoom are not updated, which means that I can drag the image outside of what's expected to be allowed by minScale.
It turns out that the logic in PhotoView.initState() is not called again when the child is updated, and therefore _childsize is not updated either.
I tried a very dirty hack by adding
_childSize = widget.childSize;
in PhotoView._buildCustomChild and that somewhat fixed the issue, but the pan/zoom still has to be reset to the center and I haven't found out how to do that yet.
Anyway, I thought giving you the information above might help you enough to fix this properly. Gotta say this is a fantastic widget!
There are some cases where the user needs to acknowledge or even control the scale of the image inside Photo View.
We could do that by providing two methods: hasScaleChanged that will be called after a scale animation comes to end, and scaleTo making photo view scale to a double value or a computedScale
When photoview is a child of hero, behaviour is very strange: it blinks before loading an image
A lint process can be run during the build to check code style.
Even if I set minScale/maxScale values, I can still zoom outside of those limits. The widget will then automatically change the zoom progressively to return to an acceptable value.
Would it make sense to provide an option to make those zoom limits more strict, and block zooming in/out if the user goes too far? A minScale set to "covered", combined with a hard limit, would effectively prevent the user from seeing the background at all. I think there's definitely some value in that use case.
Panning does what I mean: it stops as soon as the user hits the border of the child. It does not allow the user to go further, and move back to an acceptable position.
Suppose have 3 images, when zoom out the first image, smaller than the screen size.
Then I can't slide to the new image.
I tried to set each image's minScale, it's double. And each image's size are different. I can't use BoxFit.fill.
How to do that.
I discovered that when the height of the PhotoView isn't set to full-screen, then after zooming in, the top & bottom parts of the image aren't visible to the user.
I think it's because in _PhotoViewImageWrapperState, Fx _clampPosition(Offset), we're using the screen's width & height instead of the UI Component's width & height.
final screenHeight = MediaQuery.of(context).size.height needs to be final screenHeight = context.size.height (and likewise for width).
Hopefully that all makes sense.
Great job on this, btw. Works great.
Using PhotoView with heroTag option makes the image disappear.
This is a great widget, thanks for creating and uploading it!
I have a suggestion: In many apps, you can close PhotoView equivalents by pulling them up or down with one finger (example: https://www.youtube.com/watch?v=kzIcnYfznxI).
Maybe we could supply a function that is executed when the picture is pulled up/down and then "dropped"?
Once again, super useful widget!
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
Django
The Web framework for perfectionists with deadlines.
Laravel
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft
Open source projects and samples from Microsoft.
Google
Google ❤️ Open Source for everyone.
Alibaba
Alibaba Open Source for everyone
D3
Data-Driven Documents codes.
Tencent
China tencent open source team.