bouncing_draggable_dialog 1.0.2

Flutter package to implement an animated Bouncing Draggable Dialog.

Animated Bouncing Draggable Dialog

Bouncing Draggable Dialog package lets you add an animated bouncing draggable dialog to your Flutter app.

Features

The BouncingDraggableDialog widget is built to be a unique dialog that can be used in your Flutter app, replacing the default Flutter dialog. By using the content, height and widthproperties, you can provide the content to be displayed as well as the size of the dialog.

The package will handle the animation by itself.

---

Getting started

1. Add the latest version of package to your pubspec.yaml (and run dart pub get):

dependencies:
  bouncing_draggable_dialog: ^1.0.2

2. Import the package and use it in your Flutter App.

import 'package:bouncing_draggable_dialog/bouncing_draggable_dialog.dart';

---

Usage

There are a number of properties that you can modify:

• content (your dialog content)
• height (height of the dialog)
• width (width of the dialog)

Example Usage ( complete with all params ):

class HomePageScreen extends StatefulWidget { const HomePageScreen({Key? key}) : super(key: key); @override State<HomePageScreen> createState() => _HomePageScreenState(); } class _HomePageScreenState extends State<HomePageScreen> { Widget content() { return Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Text( 'Breaking News!', style: TextStyle( color: Colors.black, fontWeight: FontWeight.w700, fontSize: 20, ), ), SizedBox( height: 8.0, ), Divider( color: Colors.black, ), Padding( padding: const EdgeInsets.all(8.0), child: Text( 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.', style: TextStyle( color: Colors.black, fontWeight: FontWeight.normal, fontSize: 12, ), textAlign: TextAlign.center, ), ), Padding( padding: const EdgeInsets.only(right: 24.0, top: 8.0, bottom: 8.0), child: Container( alignment: Alignment.bottomRight, child: GestureDetector( onTap: () { Navigator.pop(context); }, child: Text( 'Close', style: TextStyle( color: Colors.black, fontWeight: FontWeight.bold, fontSize: 14, ), ), ), ), ), ], ), ); } @override Widget build(BuildContext context) { return Scaffold( body: Builder(builder: (context) { return Center( child: GestureDetector( onTap: () { showDialog( context: context, builder: (BuildContext context) { return BouncingDraggableDialog( width: 400, height: 200, content: content(), ); }); }, child: Text('Open dialog'))); }), ); } }

Here's what it looks like: https://user-images.githubusercontent.com/68671238/184511080-e57d0539-05e4-4eb7-bc30-b2ebf6d53966.mp4

---

Next Goals

We are working on some improvements including:

• ❌ Make the widget more customizable.

Issues & Feedback

Please file an issue! to send feedback or report a bug. Thank you!