Last updated:
0 purchases
flutter multi carousel
Flutter_Carosel #
A simple Carousel Widget with multiple configuration option.
...
dependencies:
...
flutter_multi_carousel: ^1.0.0
...
copied to clipboard
And install it using flutter packages get on your project folder. After that, just import the module and use it:
import 'package:flutter/material.dart';
import 'package:flutter_multi_carousel/carousel.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Carousel Demo',
home: CarouselExample(),
);
}
}
class CarouselExample extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Carousel(
height: 350.0,
width: 350,
initialPage: 3,
allowWrap: false,
type: Types.slideSwiper,
onCarouselTap: (i) {
print("onTap $i");
},
indicatorType: IndicatorTypes.bar,
arrowColor: Colors.black,
axis: Axis.horizontal,
showArrow: true,
children: List.generate(
7,
(i) => Center(
child:
Container(color: Colors.red.withOpacity((i + 1) / 7)),
))),
),
);
}
}
copied to clipboard
For detailed demonstration refer this GitHub link #
https://github.com/jaiswalshubham84/Flutter-Carousel
Getting Startedslide #
Properties
Type
Default Value
Description
height
Double
null
Defines height of carousel.This field is required
width
Double
null
Defines width of carousel. This field is required
axis
Axis
Axis.horizontal
Defines axis of carousel.
type
Types
"simple"
Defines type of carousel. for ex: Types.simple, Types.slideSwiper, Types.xRotating, Types.yRotating, Types.zRotating, Types.multiRotating
onCarouselTap
Function
null
A callback function
arrowColor
Color
Colors.white
Define the color of arrow
arrowColor
Color
Colors.white
Define the color of arrow
showIndicator
Bool
true
Choice to show indicator in carousel
indicatorType
IndicatorTypes
bar
Defines the type of indicator. For ex: IndicatorTypes.bar, IndicatorTypes.dot, IndicatorTypes.bubble
initialPage
int
0
Start your carousel with custom initial page number
activeIndicatorColor
Color
Colors.white
Defines the color of active indicator
unActiveIndicatorColor
Color
Colors.black
Defines the color of unactive indicator
indicatorBackgroundColor
Color
Color(0xff121212)
Defines the background color of indicator
indicatorBackgroundOpacity
Double
0.5
Defines the opacity of indicator background
allowWrap
bool
true
Defines if the carousel should wrap once you reach the end or if your at the begining and go left if it should take you to the end
Credits #
Developed by Shubham Jaiswal [email protected]
Contributing #
Feel free to Contribute!
For help getting started with Flutter, view our online
documentation.
For personal and professional use. You cannot resell or redistribute these repositories in their original state.
There are no reviews.