Spring Bottom Sheet 🌟
Hey Awesome Developer! ☕️
If this package makes your bottom sheets bounce with joy and saves you hours of animation headaches, consider buying me a coffee! After all, great code runs on caffeine!
⭐️ "Good code is like good coffee - it keeps you running smoothly!" ⭐️
Your support helps me stay awake to create more awesome Flutter packages! 😄
A lightweight Flutter package that provides a beautiful spring-animated bottom sheet with automatic height adjustment and smooth animations.
Features
- 🎯 Natural spring animation effect
- 📏 Auto-adjusting height based on content
- 🎨 Smart height measurement system
- 🚀 Optimized performance with value notifiers
- 🪄 Simple to implement
- 🎉 Zero external dependencies
Demo
Installation
Add this to your package's pubspec.yaml
file:
dependencies:
spring_bottom_sheet: ^latest_version
Usage
First, import the package:
import 'package:spring_bottom_sheet/spring_bottom_sheet.dart';
Basic Usage
showModalBottomSheet(
context: context,
builder: (context) => SpringBottomSheet(
child: Container(
color: Colors.white,
height: 150,
child: Center(
child: Text('Bottom Sheet Content'),
),
),
),
isScrollControlled: true,
);
Complete Example
import 'package:flutter/material.dart';
import 'package:spring_bottom_sheet/spring_bottom_sheet.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Spring BottomSheet Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
const MyHomePage({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.black,
body: Center(
child: ElevatedButton(
child: const Text('Show Spring BottomSheet'),
onPressed: () {
showModalBottomSheet(
context: context,
builder: (context) => SpringBottomSheet(
child: Container(
color: Colors.white,
height: 150,
child: const Center(
child: Text(
'This is your child!',
style: TextStyle(fontSize: 24),
),
),
),
),
isScrollControlled: true,
);
},
),
),
);
}
}
How It Works
The SpringBottomSheet
uses several advanced Flutter features to provide smooth animations:
- Height Measurement: Uses a
GlobalKey
andRenderBox
to accurately measure content height - Value Notifier: Efficiently tracks and updates height changes
- Spring Animation: Implements custom spring physics with the following parameters:
SpringDescription( mass: 1, // Controls the weight feeling stiffness: 500, // Controls the spring force damping: 25, // Controls bounce reduction )
Properties
Property | Type | Required | Description |
---|---|---|---|
child |
Widget |
Yes | The content to be displayed inside the bottom sheet |
Key Features Explained
-
Automatic Height Measurement
- Uses
GlobalKey
to measure actual content height - Adjusts animation based on measured height
- No manual height calculations needed
- Uses
-
Optimized Performance
- Uses
ValueNotifier
for efficient updates - Implements
SingleTickerProviderStateMixin
for animation - Minimal rebuild strategy with
AnimatedBuilder
- Uses
-
Smart Animation System
- Post-frame callback ensures accurate measurements
- Spring physics for natural feel
- Cleanup handling in dispose method
Contributing
Contributions are welcome! If you find a bug or want to add a feature, please:
- Open an issue
- Create a pull request
License
MIT License
Copyright (c) 2024 TRONG NHAN NGUYEN LE
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
Libraries
- spring_bottom_sheet
- A Flutter package that provides a bottom sheet with spring animation effect