apptomate_custom_bottom_sheet 0.0.1

A highly customizable and reusable bottom sheet implementation for Flutter applications, providing consistent behavior with flexible styling options.

example/lib/main.dart

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

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

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

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const CustomBottomSheetWidget(),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("Enhanced Bottom Sheet")),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            ElevatedButton(
              onPressed: () => _showStandardBottomSheet(context),
              child: const Text("Standard Bottom Sheet"),
            ),
            const SizedBox(height: 16),
            ElevatedButton(
              onPressed: () => _showScrollableBottomSheet(context),
              child: const Text("Scrollable Bottom Sheet"),
            ),
            const SizedBox(height: 16),
            ElevatedButton(
              onPressed: () => _showFullScreenBottomSheet(context),
              child: const Text("Full-screen Bottom Sheet"),
            ),
          ],
        ),
      ),
    );
  }

  void _showStandardBottomSheet(BuildContext context) {
    CustomBottomSheet.show(
      context,
      borderRadius: 24.0,
      backgroundColor: Colors.blueGrey[50],
      height: 300,
      showDragHandle: true,
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          const Text(
            "Standard Bottom Sheet",
            style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
          ),
          const SizedBox(height: 16),
          const Text(
            "This is a reusable bottom sheet with customizable properties.",
            textAlign: TextAlign.center,
          ),
          const SizedBox(height: 24),
          ElevatedButton(
            onPressed: () => Navigator.pop(context),
            child: const Text("Close"),
          ),
        ],
      ),
    );
  }

  void _showScrollableBottomSheet(BuildContext context) {
    CustomBottomSheet.show(
      context,
      isScrollControlled: true,
      showDragHandle: true,
      height: 600,
      dragHandleColor: Colors.blue,
      child: SingleChildScrollView(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            const Text(
              "Scrollable Content",
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 16),
            ...List.generate(
              20,
                  (index) => ListTile(
                title: Text("Item ${index + 1}"),
                leading: const Icon(Icons.favorite),
                onTap: () {},
              ),
            ),
            const SizedBox(height: 16),
            ElevatedButton(
              onPressed: () => Navigator.pop(context),
              child: const Text("Close"),
            ),
          ],
        ),
      ),
    );
  }

  void _showFullScreenBottomSheet(BuildContext context) {
    CustomBottomSheet.show(
      context,
      isScrollControlled: true,
      height: MediaQuery.of(context).size.height * 0.9,
      backgroundColor: Theme.of(context).scaffoldBackgroundColor,
      showDragHandle: true,
      child: Column(
        children: [
          const Text(
            "Full-screen Bottom Sheet",
            style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
          ),
          const SizedBox(height: 16),
          Expanded(
            child: ListView.builder(
              itemCount: 50,
              itemBuilder: (context, index) {
                return Card(
                  child: ListTile(
                    title: Text("Full-screen Item ${index + 1}"),
                    subtitle: Text("Detailed information about item ${index + 1}"),
                  ),
                );
              },
            ),
          ),
          Padding(
            padding: const EdgeInsets.all(16.0),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: [
                ElevatedButton(
                  onPressed: () => Navigator.pop(context),
                  child: const Text("Cancel"),
                ),
                ElevatedButton(
                  onPressed: () => Navigator.pop(context),
                  style: ElevatedButton.styleFrom(
                    backgroundColor: Colors.blue,
                  ),
                  child: const Text("Confirm"),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}