底部可展开的抽屉栏

这个包创建了一个底部导航栏，可以显示一个底部工作表。

Bottom-Sheet-Expandable-Bar

安装

在您的 pubspec.yaml 文件中包含 bottom_sheet_expandable_bar

dependencies:
  flutter:
    sdk: flutter
  bottom_sheet_expandable_bar: version

用法

要使用此软件包，只需将其导入您的文件即可开始使用。

import 'package:bottom_sheet_expandable_bar/bottom_sheet_bar_icon.dart';
import 'package:bottom_sheet_expandable_bar/bottom_sheet_expandable_bar.dart';

...

bottomSheet: BottomBarSheet(
  children: [
    BottomSheetBarIcon(
      icon: Icon(Icons.home),
      color: Colors.redAccent, 
      onTap: (){
      },
    ),
    BottomSheetBarIcon(
      icon: Icon(Icons.person),
      color: Colors.blueAccent, 
      onTap: (){
      },
    ),
    BottomSheetBarIcon(
      icon: Icon(Icons.edit),
      color: Colors.blue[800], 
      onTap: (){
      },
    ),
    BottomSheetBarIcon(
      icon: Icon(Icons.star),
      color: Colors.orangeAccent, 
      onTap: (){
      },
    ),
  ],
),

...

重要提示：将此行添加到您的主题中，以避免意外行为

theme: ThemeData(
  /// Add this line
  bottomSheetTheme: BottomSheetThemeData(backgroundColor: Colors.transparent),
),

BottomSheetBarIcon

此小部件允许生成动态图标

属性

名称 描述 必需 默认值
icon 用作按钮图标的小部件 假
color 用于指示图标颜色的颜色 假 Colors.black
onTap 处理按钮点击事件的函数 真

BottomBarSheet

此小部件允许生成一个具有可展开为底部抽屉功能的底部栏

属性

名称 描述 必需 默认值
children 用于在栏内显示图标的 BottomSheetBarIcon 小部件列表 假
buttonPosition ButtonBottomBarPosition，用于指示可展开按钮的位置（居中，靠右） 假 ButtonBottomBarPosition.center
backgroundBarColor 用于指示底部栏背景颜色的颜色 假 Colors.white
backgroundColor 用于指示底部抽屉颜色的颜色 假 Colors.white
showExpandableButton 布尔值，用于指示何时显示或隐藏可展开按钮 假 假
innerChild 显示在底部抽屉中的小部件 假
bottomRadius Double 值，用于指示底部栏的圆角半径 假 50.0
bottomBarHeight Double 值，用于指示底部栏的高度 假 60.0
bottomBarWidth Double 值，用于指示底部栏的高度 假 屏幕宽度 * 0.9
duration 显示或隐藏底部抽屉之间的时间 假 250 毫秒
bottomSheetHeight Double 值，用于指示底部抽屉的高度 假 屏幕高度 * 0.75
iconExpand 显示在可展开按钮中的图标 假 Icon(Icons.navigation)
iconColor 可展开按钮的颜色 假 Colors.green
onClose 底部抽屉关闭时调用的函数 假 (){}
currentIndex Integer 值，用于指示哪个标签被选中 假 0
curve 进入底部抽屉动画使用的曲线 假 Curves.ease

可展开按钮居中

Screenshot_1--1-

可展开按钮靠右

Screenshot_2--1-

作为简单的导航栏

Screenshot_3

GitHub

https://github.com/ajomuch92/flutter-bottom-sheet-expandable-bar