import 'package:flutter/material.dart';

enum SampleItem { itemOne, itemTwo, itemThree }

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        useMaterial3: true,
        scrollbarTheme: const ScrollbarThemeData(
          thumbColor: MaterialStatePropertyAll<Color?>(Colors.red),
        ),
        textButtonTheme: TextButtonThemeData(
          style: ButtonStyle(
            textStyle: MaterialStatePropertyAll<TextStyle?>(
                TextStyle(color: Colors.white)),
            backgroundColor: MaterialStatePropertyAll<Color?>(Colors.red),
          ),
        ),
      ),
      home: const SubCategoryScreenView(addtionallTag: "sdfsdf"),
    );
  }
}

class SubCategoryScreenView extends StatefulWidget {
  final String addtionallTag;
  const SubCategoryScreenView({
    Key? key,
    required this.addtionallTag,
  }) : super(key: key);

  @override
  _SubCategoryScreenViewState createState() => _SubCategoryScreenViewState();
}

class _SubCategoryScreenViewState extends State<SubCategoryScreenView>
    with TickerProviderStateMixin {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: Text("Test"),
      ),
      body: CustomScrollView(
        slivers: <Widget>[
          SliverAppBar(
            pinned: false,
            snap: false,
            leading: const SizedBox(),
            floating: false,
            expandedHeight: MediaQuery.of(context).size.width / 1.7,
            collapsedHeight: 0,
            toolbarHeight: 0,
            titleSpacing: 0,
            leadingWidth: 0,
            flexibleSpace: FlexibleSpaceBar(
              // title: Text(widget.category.localedName),
              background: AspectRatio(
                aspectRatio: 1.7,
                child: Hero(
                  tag: "${widget.addtionallTag}",
                  child: Image.network(
                    "https://picsum.photos/1200/1300",
                    fit: BoxFit.contain,
                  ),
                ),
              ),
            ),
          ),
           
          const SliverToBoxAdapter(child: SizedBox(height: 12)),
          SliverToBoxAdapter(
              child: GridView.builder(
                  gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                    crossAxisCount: 3,
                  ),
                  shrinkWrap: true,
                  physics: const NeverScrollableScrollPhysics(),
                  itemCount: 300,
                  itemBuilder: (BuildContext context, int index) {
                    return Card(
                      color: Colors.amber,
                      child: Center(child: Text('$index')),
                    );
                  })),
          const SliverToBoxAdapter(child: SizedBox(height: 12)),
        ],
      ),
    );
  }
}