Skip to content

This package was created to implement a Custom Drawer that could be opened with a simple swipe.

License

Notifications You must be signed in to change notification settings

yelmuratoff/slidable_drawer

Repository files navigation

This package was created to implement a Custom Drawer that could be opened with a simple swipe. 🚀

Included SlidableDrawerController for animated open/close drawer 😊
Show some ❤️ and star the repo to support the project!

Pub License: MIT Repository views Pub

Pub likes Pub popularity Pub points


📌 Features

  • ✅ Simple open/close drawer with swipe to right
  • ✅ Open/close drawer using SlidableDrawerController

📌 Getting Started

Follow these steps to use this package

Add dependency

dependencies:
  slidable_drawer: ^1.0.6

Add import package

import 'package:slidable_drawer/slidable_drawer.dart';

Easy to use

Simple example of use SlidableDrawer
Put this code in your project at an screen and learn how it works 😊

Slidable package's example

 

Widget part:

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

void main() {
  runApp(MaterialApp(
    theme: ThemeData.dark(),
    home: const MyApp(),
  ));
}

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

  // Create and return the state associated with MyApp.
  @override
  State<MyApp> createState() => _MyAppState();
}

// The state of the MyApp widget.
class _MyAppState extends State<MyApp> {
  final SlidableDrawerController _slidableDrawer = SlidableDrawerController();

  // initState is called when this object is inserted into the tree.
  @override
  void initState() {
    super.initState();
  }

  // This method builds the widget that this state represents.
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SlidableDrawer(
        drawerBody: _SlidableDraweBody(
          controller: _slidableDrawer,
        ),
        innerDrawerController: _slidableDrawer,
        child: SizedBox(
          height: MediaQuery.of(context).size.height,
          child: Center(
              child: TextButton(
            style: ButtonStyle(
              backgroundColor: MaterialStateProperty.all(Colors.blue),
            ),
            onPressed: () {
              _slidableDrawer.animateToOpen();
            },
            child: const Text(
              'Open Drawer',
              style: TextStyle(color: Colors.white),
            ),
          )),
        ),
      ),
    );
  }
}

class _SlidableDraweBody extends StatelessWidget {
  final SlidableDrawerController controller;

  const _SlidableDraweBody({required this.controller});

  // This method builds the widget that this stateless widget represents.
  @override
  Widget build(BuildContext context) {
    return Container(
      color: const Color.fromARGB(255, 66, 66, 66), // can be any color
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          TextButton(
            onPressed: () {
              controller.animateToClose();
            },
            child: const Text('Close'),
          ),
        ],
      ),
    );
  }
}

Thanks to all contributors of this package


About

This package was created to implement a Custom Drawer that could be opened with a simple swipe.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages