Description:

flip carousel

A simple infinite horizontal carousel with flip animation which can be used for both image and widgets

📱 Usage #
Import package in your file
import 'package:flip_carousel/flip_carousel.dart';
copied to clipboard
Use FlipCarousel widget
FlipCarousel(items:cardItems);
copied to clipboard
Give a list of data and set the properties as you wish

List<dynamic> cardItems = [
'https://i.ibb.co/QYdQHBw/batman2.jpg',
'https://i.ibb.co/vwhykYp/spider1.jpg',
'https://i.ibb.co/H4VrQS4/spider2.jpg',
Container(color: Colors.amber, child: const FlutterLogo()),
];



FlipCarousel(
items: cardItems,
transitionDuration: const Duration(milliseconds: 400),
isAssetImage: false,
border: Border.all(width: 5, color: const Color(0xFFFFFFFF)),
width: 250,
height: 400,
fit: BoxFit.cover,
perspectiveFactor: 0.002,
layersGap: 30,

onChange: (int pageIndex) {
print(pageIndex);
},
onTap: () {
print("tap");
},
),
copied to clipboard
Customization #

You can add both widgets and ImageUrls as input.
make sure that you have set the the [ isAssetImage ] value base on your source.

Here is the rest of properties that can be modyfied

/// List of image/widgets to be shown in the carousel; Accepts two types of link.
/// For example: `https://...jpg` for online images and `assets/...` for local images.
final List<dynamic> items;

/// Specifies the type of image addresses in [imagesLink].
/// Must be `false` if [imagesLink] contains online images.
/// Must be `true` if [imagesLink] contains local images.
final bool assetImage;

/// Set as the image slider [width].
/// Defaults to 300.
final double width;

/// Set as the image slider [height].
/// Defaults to 450.
final double height;

/// Returns the page index after animation is done .
final Function(int pageIndex)? onChange;

/// Runs the given code onPress .
final Function()? onTap;

/// Set as the main frames [backgroundColor].
final Color? backgroundColor;

/// Determines the value of the [fit] property of the images
/// Defaults to BoxFit.cover.
final BoxFit fit;

/// Determines the space between two [H3DCard].
/// Defaults to 30.
final double layersGap;

/// Determines the perspective transformation of the [H3DCard] when being animated.
/// Defaults to 0.0015.
final double perspectiveFactor;

/// Determines the space between two [H3DCard].
/// Defaults to 30.

final BoxBorder? border;

/// Determines the [borderRadius] of the [H3DCard].
/// Defaults to 30.

final BorderRadius borderRadius;

/// Determines the clip behaviour of the child widget.
/// Defaults to [Clip.hardEdge].

final Clip childClip;

/// Determines [Duration] of transition animation.
/// Defaults to 500 milliseconds.
final Duration transitionDuration;

/// Determines [Visibility] of the transition arrows.
/// Defaults to True.

final bool arrowControllersVisibility;

/// Determines [Color] of the transition arrows.
/// Defaults to [Colors.white].
final Color arrowControllersColor;

/// Determines [tag] of the selected [H3DCard].
final String heroTag;

```#
copied to clipboard

License

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Share

• Share on Facebook
• Share on Twitter