Creare un carousel in Flutter con carousel_slider

carousel_slider è una libreria per Flutter che ci consente di creare uno slider in maniera molto semplice.

Tra l'altro è compatibile con tutte le piattaforme.

Per installarla:

flutter pub add carousel_slider

Qui sotto un esempio easy:

import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter test',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter test'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CarouselSlider(
        options: CarouselOptions(
          height: 500.0,
          enableInfiniteScroll: false,
          onPageChanged: (index, reason) {
            print(index);
          },
        ),
        items: [1, 2, 3, 4, 5].map((i) {
          return Builder(
            builder: (BuildContext context) {
              return Container(
                width: MediaQuery.of(context).size.width,
                margin: const EdgeInsets.symmetric(horizontal: 5.0),
                decoration: const BoxDecoration(color: Colors.amber),
                child: Text(
                  'text $i',
                ),
              );
            },
          );
        }).toList(),
      ),
    );
  }
}

Qui abbiamo messo solo testo, ma ovviamente potete mettere anche immagini, usare widget custom, ecc.

Enjoy!