interactiveviewer_gallery

Description:

interactiveviewer gallery

interactiveviewer_gallery #

中文文档
A flutter library to show picture and video preview gallery
support

two-finger gesture zoom
double-click to zoom
switch left and right
gesture back: scale, transfer, opacity of background
video auto paused when miss focus

Preview #
video for youtube
video for qiniu
apk download
Setup #
because the library is base on InteractiveViewer so require flutter verion above or equal 1.20.0
interactiveviewer_gallery: ${last_version}
copied to clipboard
How to use #

Wrap Hero in your image gridview item:

Hero(
tag: source.url,
child: ${gridview item}
)
copied to clipboard

gridview item's GestureDetector add jumping to interactiveviewer_gallery:

// DemoSourceEntity is your data model
// itemBuilder is gallery page item
void _openGallery(DemoSourceEntity source) {
Navigator.of(context).push(
HeroDialogRoute<void>(
// DisplayGesture is just debug, please remove it when use
builder: (BuildContext context) => InteractiveviewerGallery<DemoSourceEntity>(
sources: sourceList,
initIndex: sourceList.indexOf(source),
itemBuilder: itemBuilder,
onPageChanged: (int pageIndex) {
print("nell-pageIndex:$pageIndex");
},
),
),
);
}
copied to clipboard

edit itemBuilder: you can reference the example/lib/main.dart then customize

Widget itemBuilder(BuildContext context, int index, bool isFocus) {
DemoSourceEntity sourceEntity = sourceList[index];
if (sourceEntity.type == 'video') {
return DemoVideoItem(
sourceEntity,
isFocus: isFocus,
);
} else {
return DemoImageItem(sourceEntity);
}
}
copied to clipboard
Other #
Comments and pr are welcome