bouncing_draggable_dialog

Description:

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 #

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

dependencies:
bouncing_draggable_dialog: ^1.0.2
copied to clipboard

Import the package and use it in your Flutter App.

import 'package:bouncing_draggable_dialog/bouncing_draggable_dialog.dart';
copied to clipboard

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')));
}),
);
}
}

copied to clipboard


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!
copied to clipboard