interactiveviewer_gallery

Picture preview & Video Preview & Picture/video mixed preview container UI

  1. Supports two-finger scaling
  2. Double click zoom
  3. Support left and right to switch pictures
  4. Support pulldown gesture back, with zoom, move, transparency changes
  5. Supports automatic pause when the video loses focus

preview

qiniu/youtube

apk download

The installation

Because the library is implemented on the basis of InteractiveViewer, the flutter version is no less than 1.20.0

interactiveviewer_gallery: ${last_version}
Copy the code

How to use

  1. The picture component in the picture page wraps Hero(a jump to undertake animation)
Hero(
    tag: source.url,
    child: ${gridview item}
)
Copy the code
  1. Click on the picture to jump to the picture preview page
Navigator.of(context).push(
    HeroDialogRoute<void>(
      builder: (BuildContext context) => InteractiveviewerGallery<DemoSourceEntity>(
          sources: sourceList,
          initIndex: sourceList.indexOf(source),
          // Define your own item
          itemBuilder: itemBuilder,
          onPageChanged: (int pageIndex) {
            print("nell-pageIndex:$pageIndex"); },),),);Copy the code
  1. Define your own item (since everyone’s UI design is different, you need to implement your own item, the library is just a UI container). See the implementation in the preview video: Example /lib/main.dart
Widget itemBuilder(BuildContext context, int index, bool isFocus) {
  DemoSourceEntity sourceEntity = sourceList[index];
  if (sourceEntity.type == 'video') {
    return DemoVideoItem(
      sourceEntity,
      isFocus: isFocus,
    );
  } else {
    returnDemoImageItem(sourceEntity); }}Copy the code

other

Pr and discussion are welcome