Usage of CarouselSlider in Flutter

What is CarouselSlider?

CarouselSlideris a widget that you can scroll image etc.

How to use CarouselSlider?

First of all, we need to add carousel_slider: ^2.3.1 inpubspec.yaml dependencies.

Create a CarouselSlider widget :

CarouselSlider(
  items: _colors.map((i){
    return Builder(builder: (BuildContext context){
      return Container(
        width: MediaQuery.of(context).size.width,
        margin: EdgeInsets.symmetric(horizontal: 15),
        decoration: BoxDecoration(color: i,
        borderRadius: BorderRadius.circular(25)),
      );
    });
  }).toList(),
)

Add an options :

options: CarouselOptions(
  height: 400,
  enableInfiniteScroll: true,
  enlargeCenterPage: true,
  autoPlay: false,
  scrollDirection: Axis.horizontal,
),

enlargeCenterPage: false,

scrollDirection: Axis.vertical,

viewportFraction: 0.4,

enableInfiniteScroll: false,

The code of the visual in the first gif like below :

import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/material.dart';
void main() {
  runApp(MyApp());
}
class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: CarouselSlider(
            items: _colors.map((i){
              return Builder(builder: (BuildContext context){
                return Container(
                  width: MediaQuery.of(context).size.width,
                  margin: EdgeInsets.symmetric(horizontal: 15),
                  decoration: BoxDecoration(color: i,
                  borderRadius: BorderRadius.circular(25)),
                );
              });
            }).toList(),
            options: CarouselOptions(
              height: 400,
              enableInfiniteScroll: true,
              enlargeCenterPage: true,
              scrollDirection: Axis.horizontal,
            ),
          ),
        ),
      ),
    );
  }
final List _colors =[
    Colors.yellow,
    Colors.lightBlue,
    Colors.red,
    Colors.green,
  ];
}