bottom_sheet_expandable_bar 0.1.1
bottom_sheet_expandable_bar: ^0.1.1 copied to clipboard

A package to show and bottom bar with the capability to expand and show a bottom sheet

Bottom Sheet Expandable Bar #

This package create a bottom navigation bar with the capability to show a bottom sheet.

Instalation #

Include bottom_sheet_expandable_bar in your pubspec.yaml file:

dependencies:
  flutter:
    sdk: flutter
  bottom_sheet_expandable_bar: version

Usage #

To use this package, just import it into your file and enjoy it.

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: (){
      },
    ),
  ],
),

...

IMPORTANT: Add this line to your theme to avoid an unexpected behaviour

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

BottomSheetBarIcon #

This widget allow to generate a dynamic icon

Properties

NameDescriptionRequiredDefault
iconWidget to put as button iconFalse
colorColor to indicate icon colorFalseColors.black
onTapFunction to handle button on tapTrue

BottomBarSheet #

This widget allow to generate a bottom bar with the capability to expanto to a bottom sheet

Properties

NameDescriptionRequiredDefault
childrenList of BottomSheetBarIcon widget to show icons within the barFalse
buttonPositionButtonBottomBarPosition to indicate expandable button position (center, end)FalseButtonBottomBarPosition.center
backgroundBarColorColor to indicate bottom bar background colorFalseColors.white
backgroundColorColor to indicate bottom sheet colorFalseColors.white
showExpandableButtonBoolean value to indicate when to show or hide expandable buttonFalseFalse
innerChildWidget to show into the bottom sheetFalse
bottomRadiusDouble value to indicate the corners radius for the bottom barFalse50.0
bottomBarHeightDouble value to indicate the bottom bar heightFalse60.0
bottomBarWidthDouble value to indicate the bottom bar heightFalseScreen width * 0.9
durationDuration between show or hide the bottom sheetFalse250 milliseconds
bottomSheetHeightDouble value to indicate the bottom sheet heightFalseScreen height * 0.75
iconExpandIcon to show into the expandable buttonFalseIcon(Icons.navigation)
iconColorExpandable button colorFalseColors.green
onCloseFunction to call when bottom sheet is closedFalse(){}
currentIndexInteger value to indicatet which tab is selectedFalse0
curveCurve to use on enter bottom sheet animationFalseCurves.ease

Expandable button at center #

Expandable button at end #

As a simple navigation bar #

6
likes
120
pub points
46%
popularity

Publisher

ajomuch92.site

A package to show and bottom bar with the capability to expand and show a bottom sheet

Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (LICENSE)

Dependencies

flutter

More

Packages that depend on bottom_sheet_expandable_bar