Skip to content

youssefali424/animated_image_list

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

27 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

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:

Name Description Required Default value
images A list of images url to display in the list by default it accepts urls if custom image needed use provider paramter required -
provider Function which maps an url or image string to an image provider - -
itemExtent not selected item size required to calculate animations required 150
maxExtent selected item size required to calculate animations required 400
scrollDirection List scroll direction horizontal or vertical - Axis.vertical
builder Builder 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 - -
placeHolder Optional function which returns default placeholder for lightbox and error widget if image fails to load - kTransparentImage

About

Flutter Animated parallax image list

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages