搜索插件、代码仓与 APP 分类

插件详情v0.0.4

drawer_swipe

用于显示多层抽屉的抽屉滑动包

近 30 天下载
48
喜欢数
76
Pub 分数
40

安装插件

flutter pub add drawer_swipe

插件介绍

基于插件公开信息、社区数据与项目使用情况整理的选型参考。

drawer_swipe 包允许在 Flutter 应用中创建多层抽屉,提供基于滑动手势的层间导航交互。专为直观的用户体验设计,支持流畅的过渡效果和可自定义的布局。适用于需要层级导航或分层内容展示的应用,通过手势驱动访问提升可用性。该包轻量且可无缝集成到现有的 Flutter 项目中。

适合场景

  • 多层导航界面
  • 基于手势的抽屉交互
  • 复杂的App导航结构
  • 可自定义的滑动面板
  • 通过滑动增强用户体验
  • 内容组织与分层视图

主要特点

  • 支持多层抽屉
  • 滑动打开手势支持
  • 可自定义的动画和样式
  • 轻量且易于集成
  • 灵活的图层管理
  • 响应式设计兼容性

适合对象

  • 开发复杂导航系统的开发者
  • 需要分层UI组件的应用程序
  • 强调基于手势导航的项目
  • Flutter 初学者探索抽屉模式
  • 设计师专注于交互式用户流程
  • 移动优先的应用程序开发

使用建议

  • 有限的平台特定自定义
  • 无内置的从右到左布局支持
  • 需要手动处理图层状态
  • 可能需要额外的样式以保持一致性
  • 未针对大量图层进行优化
  • 依赖外部依赖项以实现高级功能

原始 README

以下为关联源码仓库的 README 原文快照,最新内容请访问源码仓库。

DrawerSwipe

Say Thanks!

A Swipe Drawer Library for Easy and Quick Usage.

The source code is 100% Dart, and everything resides in the /lib folder.

Show some :heart: and star the repo to support the project

Open Source Love License

GIF
GIF

💻 Installation

In the dependencies: section of your pubspec.yaml, add the following line:

drawer_swipe: <latest_version>

❔ Usage

Import this class
import 'package:drawer_swipe/drawer_swipe.dart';
Use SwipeDrawer
  @override
  Widget build(BuildContext context) {
  return Scaffold(  
    // add this line so you can add your appBar in Body  
    extendBodyBehindAppBar: true,  
    body: SwipeDrawer(  
      radius: 20,  
    key: drawerKey,  
    bodyBackgroundPeekSize: 30,  
    backgroundColor: Colors.red,  
    // pass drawer widget  
    drawer: buildDrawer(),  
    // pass body widget  
    child: buildBody(),  
    ),  
  );
  }

🎨 Customization and Attributes

SwipeDrawer attributes
Attribute Name Example Value Description
child BodyWidget() Screen Body Widget
drawer DrawerWidget() Drawer Body Widget
radius 20.0 body radius value the default value is 0.0
bodyBackgroundPeekSize 30.0 the distance between the main body and the faded one the default value is 50.0
backgroundColor Colors.red background color the default value is Colors.black
bodySize 70.0 body width when opening the drawer the default value is 80.0
curve Curves.easeOut animation curve default value is Curves.easeIn

Contributors ✨

Thanks goes to these wonderful people (emoji key):


Ahmed Eslayed

💻

📃 License

Copyright (c) 2012 Pharous

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Getting Started

For help getting started with Flutter, view our online documentation.

For help on editing package code, view the documentation.

所属分类

源码仓库

使用此插件的项目

暂无相关数据。