import 'dart:math';

import 'package:flutter/material.dart';

import 'package:easy_sticky_header/easy_sticky_header.dart';

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

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

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

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

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  final _stickyController = StickyHeaderController();
  final _scrollController = ScrollController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: StickyHeader(
        controller: _stickyController,
        child: ListView.builder(
          itemCount: 100,
          controller: _scrollController,
          itemBuilder: (context, index) {
            // Custom header widget.
            // If you set 20 here instead of 3 than content will not full scroll down
            if (index % 3 == 0) {
              return StickyContainerWidget(
                index: index,
                child: Container(
                  color: Color.fromRGBO(
                      Random().nextInt(256), Random().nextInt(256), Random().nextInt(256), 1),
                  padding: const EdgeInsets.only(left: 16.0),
                  alignment: Alignment.centerLeft,
                  width: double.infinity,
                  height: 50,
                  child: Text(
                    'Header #$index',
                    style: const TextStyle(
                      color: Colors.white,
                      fontSize: 16,
                    ),
                  ),
                ),
              );
            }
            // Custom item widget.
            return Container(
              width: double.infinity,
              height: 80,
              color: Colors.grey,
              child: Text(
                'item #$index',
                style: const TextStyle(
                  color: Colors.white,
                  fontSize: 16,
                ),
              ),
            );
          },
        ),
      ),
      floatingActionButton: FloatingActionButton(
        backgroundColor: Colors.black,
        onPressed: () {
          debugPrint(
              '_stickyController.getMaxScrollExtent: ${_stickyController.getMaxScrollExtent}');
          debugPrint(
              '_scrollController.position.maxScrollExtent: ${_scrollController.position.maxScrollExtent}');
          _scrollController.animateTo(
            _scrollController.position.maxScrollExtent,
            duration: const Duration(milliseconds: 100),
            curve: Curves.linear,
          );
        },
        child: const Icon(
          Icons.download_for_offline_sharp,
          color: Colors.white,
        ),
      ),
    );
  }
}