playable_toolbar_flutter

Playable toolbar package is a beautiful animated menu(toolbar) which you can customize as much as you want.

Installation

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

dependencies:
  playable_toolbar_flutter: ^latest_version

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

import 'package:playable_toolbar_flutter/playable_toolbar_flutter.dart';

Screenshots

Example

There are a number of properties that you can modify. Customize them as you want:

• List of items 📝See example below.
• Height & Width 👉🏻 toolbarHeight & toolbarWidth
• Items Gutter 👉🏻 itemsGutter
• Items Offset 👉🏻 itemsOffset
• Background color 👉🏻 toolbarBackgroundColor
• Shadow under the toolbar 👉🏻 toolbarShadow
• Toolbar Radius 👉🏻 toolbarBackgroundRadius
• Horizontal padding 👉🏻 toolbarHorizontalPadding
• Animation duration (will be added in future updates)
• Animation curve (will be added in future updates)

List Items

✔ You can create list items like below.

1. First import list_item_model like this:

import 'package:playable_toolbar_flutter/list_item_model.dart';

2. Then create your items like this:

ListItemModel( onTap: () => print("Edit is tapped."), title: 'Edit', color: Colors.pinkAccent, icon: Icons.edit, ),

3. Then create list of your items and pass it to playable_menu_flutter widget:

List<ListItemModel> someToolbarItems = [
  ListItemModel(
    onTap: () => print("Edit is tapped."),
    title: 'Edit',
    color: Colors.pinkAccent,
    icon: Icons.edit,
  ),
  ListItemModel(
    onTap: () => print("Delete is tapped."),
    title: 'Delete',
    color: Colors.lightBlueAccent,
    icon: Icons.delete,
  ),
  ListItemModel(
    onTap: () => print("Comment is tapped."),
    title: 'Comment',
    color: Colors.cyan,
    icon: Icons.comment,
  ),
];

main.dart

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'playable_toolbar_flutter test App',
      home: Scaffold(
        body: PlayableToolbarWidget(
          toolbarItems: someToolbarItems,
        ),
      ),
    );
  }
}

Support

You can support me by following me on and GitHub

And also don't forget to star this package on GitHub