Anydrawer

anydrawer 包允许您在 Flutter 应用程序中轻松地从屏幕的任何水平侧显示可自定义的抽屉。与只能从脚手架本身显示的默认脚手架抽屉不同，该包提供了从应用程序 UI 的各个部分显示抽屉的灵活性。该包包含一个 showDrawer 函数，可促进显示抽屉的过程，您还可以使用 DrawerConfig 类自定义抽屉的外观和行为。

安装

要在 Flutter 项目中使用 anydrawer 包，请遵循以下步骤：

  1. 将依赖项添加到您的 pubspec.yaml 文件中。

    dependencies:
  anydrawer: ^1.0.1 # Replace with the latest version

  2. 运行 flutter pub get 来获取该包。

用法

  1. 导入所需的包。

    import 'package:anydrawer/anydrawer.dart';

  2. 使用 showDrawer 函数显示自定义抽屉。

    showDrawer(
  context,
  builder: (context) {
    return const Center(
      child: Text('Left Drawer'),
    );
  },
  config: const DrawerConfig(
    side: DrawerSide.left,
    closeOnClickOutside: true,
  ),
  onOpen: () {
    // Optional callback when the drawer is opened
  },
  onClose: () {
    // Optional callback when the drawer is closed
  },
  controller: drawerController, // Optional controller to programmatically close the drawer
);

屏幕截图

[]

[]

参数

showDrawer 函数接受以下参数：

  • context：调用函数的 widget 的构建上下文。
  • builder：一个构建器函数，返回将在抽屉内显示的 widget 树。
  • config：一个 DrawerConfig 对象，允许您自定义抽屉的行为和外观。
  • onOpen：一个可选的回调函数，在抽屉打开时调用。
  • onClose：一个可选的回调函数，在抽屉关闭时调用。
  • controller：一个 AnyDrawerController 对象，可用于以编程方式关闭抽屉。

注意：controller 在不再需要时应进行处置。可以通过调用控制器的 dispose 方法来完成。抽屉关闭时不会自动处置。

DrawerConfig 具有以下属性：

  • widthPercentage：将抽屉的宽度设置为屏幕宽度的百分比。
  • maxDragExtent：设置抽屉可以拖动的最大范围。
  • side：指定抽屉应该出现的侧边（DrawerSide.left 或 DrawerSide.right）。
  • closeOnClickOutside：确定点击抽屉外部时是否应关闭抽屉。
  • closeOnEscapeKey：确定按下 Escape 键时是否应关闭抽屉。
  • dragEnabled：允许用户拖动抽屉来打开和关闭它。
  • backdropOpacity：设置抽屉后面出现的背景的不透明度。
  • borderRadius：调整抽屉的圆角。

此信息提供了 showDrawer 函数和 DrawerConfig 对象的可自定义属性的概述，使您可以轻松地在 Flutter 应用程序中创建和控制抽屉。

动画和交互

该包包括用于打开和关闭抽屉的流畅动画和交互式手势。

  • 拖动抽屉以打开或关闭它（可以使用 dragEnabled 禁用）。
  • 抽屉会从指定的侧边平滑地滑入和滑出，并带有可自定义的动画。

贡献

欢迎 Pull requests。对于重大更改，请先打开一个 issue 来讨论您想进行的更改。

待办事项

  • 修复了在移动设备上按返回键时抽屉未关闭的问题。

许可证

本项目根据 MIT 许可证 授权。

GitHub

查看 Github