Animated Image List for Flutter

Pub

Flutter Animated image list with parallax effect and image lightbox .

gif

Getting Started

Add the package to your pubspec.yaml:

animated_image_list: ^0.5.0

In your dart file, import the library:

import 'package:animated_image_list/AnimatedImageList.dart';

Instead of using a ListView create a AnimatedImageList Widget:

 AnimatedImageList(
               images: arr.map((e) => e.urls.small).toList(),
               builder: (context, index, progress) {
                 return Positioned.directional(
                     textDirection: TextDirection.ltr,
                     bottom: 15,
                     start: 25,
                     child: Opacity(
                       opacity: progress > 1 ? (2 - progress) : progress,
                       child: Text(
                         arr[index].user.username ?? 'Anonymous',
                         style: TextStyle(
                             color: Colors.white,
                             fontSize: 25,
                             fontWeight: FontWeight.w500),
                       ),
                     ));
               },
               scrollDirection: Axis.vertical,
               itemExtent: 100,
               maxExtent: 400,
             ),

Parameters:

NameDescriptionRequiredDefault value
imagesA list of images url to display in the list by default it accepts urls if custom image needed use provider paramterrequired-
providerFunction which maps an url or image string to an image provider--
itemExtentnot selected item size required to calculate animationsrequired150
maxExtentselected item size required to calculate animationsrequired400
scrollDirectionList scroll direction horizontal or vertical-Axis.vertical
builderBuilder function that returns a widget to display over the image / progress from 0...1 item selection progress from 1...2 item leaving view could be usefull if you want to animate something like text opacity above / index current item index--
placeHolderOptional function which returns default placeholder for lightbox and error widget if image fails to load-kTransparentImage

Libraries

animated_image_list
CustomScrollPhysics
interpolate
PhotoViewerArbnb_page
PhotoViewerArbnb_screen
SnappingListView
transparent_image
TransparentRoute