import 'package:flutter/material.dart';

const Color foregroundColor = Color(0xff00ff00);
const Color backgroundColor = Color(0xff00ffff);
const double elevation = 4.0;
const double scrolledUnderElevation = 6.0;
const Color shadowColor = Color(0xff1212ff);
const ShapeBorder shape = RoundedRectangleBorder(
  borderRadius: BorderRadius.all(Radius.circular(14.0)),
);
const IconThemeData iconTheme = IconThemeData(color: Color(0xffff0000));
const IconThemeData actionsIconTheme = IconThemeData(color: Color(0xff0000ff));
const bool centerTitle = false;
const double titleSpacing = 10.0;
const TextStyle titleTextStyle = TextStyle(
  fontSize: 22.9,
  fontStyle: FontStyle.italic,
  color: Colors.blue,
);

AppBarTheme appBarTheme = const AppBarTheme(
  foregroundColor: foregroundColor,
  backgroundColor: backgroundColor,
  elevation: elevation,
  scrolledUnderElevation: scrolledUnderElevation,
  shadowColor: shadowColor,
  shape: shape,
  iconTheme: iconTheme,
  actionsIconTheme: actionsIconTheme,
  centerTitle: centerTitle,
  titleSpacing: titleSpacing,
  titleTextStyle: titleTextStyle,
);

void main() => runApp(const SliverAppBarExample());

class SliverAppBarExample extends StatefulWidget {
  const SliverAppBarExample({super.key});

  @override
  State<SliverAppBarExample> createState() => _SliverAppBarExampleState();
}

class _SliverAppBarExampleState extends State<SliverAppBarExample> {
  // Parameters
  TextStyle titleTextStyle = const TextStyle(
    color: Colors.deepPurple,
    fontSize: 22,
    fontStyle: FontStyle.italic,
  );

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        appBarTheme: appBarTheme,
        useMaterial3: true,
      ),
      home: Scaffold(
        body: CustomScrollView(
          slivers: <Widget>[
            SliverAppBar(
              leading:
                  IconButton(onPressed: () {}, icon: const Icon(Icons.menu)),
              title: const Text('Sliver App Bar'),
              titleTextStyle: titleTextStyle,
              centerTitle: true,
              pinned: true,
              actions: <Widget>[
                IconButton(icon: const Icon(Icons.favorite), onPressed: () {}),
                IconButton(icon: const Icon(Icons.favorite), onPressed: () {}),
              ],
            ),
            SliverAppBar.medium(
              leading:
                  IconButton(onPressed: () {}, icon: const Icon(Icons.menu)),
              title: const Text('Medium App Bar'),
              titleTextStyle: titleTextStyle,
              centerTitle: true,
              actions: <Widget>[
                IconButton(icon: const Icon(Icons.favorite), onPressed: () {}),
                IconButton(icon: const Icon(Icons.favorite), onPressed: () {}),
              ],
            ),
            SliverAppBar.large(
              leading:
                  IconButton(onPressed: () {}, icon: const Icon(Icons.menu)),
              title: const Text('Large App Bar'),
              titleTextStyle: titleTextStyle,
              centerTitle: true,
              actions: <Widget>[
                IconButton(icon: const Icon(Icons.favorite), onPressed: () {}),
                IconButton(icon: const Icon(Icons.favorite), onPressed: () {}),
              ],
            ),
            const SliverFillRemaining(
              child: Center(
                child: Text(
                  'Scroll down to collapse the app bar',
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}