side_bar_custom 1.0.2 
side_bar_custom: ^1.0.2 copied to clipboard
This package allows you to have a simple, fast and practical custom SideBar, in fact you will be able to customize almost everything. Seeing is believing.
DESCRIPTION #
This package allows you to have a new simple and fast "SideBar" component, with many possibilities to customize it.
HOW TO INSTALL #
dependencies:
flutter:
sdk: flutter
side_bar_custom: ^1.0.1
HOW TO USE #
SideBar(
children: [
Center(
child: Text("Dashboard"),
),
Center(
child: Text("Add User"),
),
],
items: [
SideBarItem(
text: "Dashboard",
icon: Icons.home,
tooltipText: "Dashboard page",
),
SideBarItem(
text: "Add User",
icon: Icons.add,
),
],
),
SCREENSHOT #
UTILS #
SideBarConfig #
| Props | Description | Required | Default Value |
|---|---|---|---|
| backgroundColor | This color is used to change the background color of the SideBar. | ✅ | Color(0xff303F9F) |
| bottomIconColor | This color is used to change the color of bottom icon of the SideBar. | ✅ | Color(0xff448AFF) |
| dividerColor | This color is used to change the color of divider of SideBar. | ✅ | Color(0xff448AFF) |
| selectedBoxColor | This color is used to change the background of the single selected item. | ✅ | Color(0xff3F51B5) |
| selectedIconColor | This color is used to change the color of icon of the single selected item. | ✅ | Color(0xffC5CAE9) |
| unselectedBoxColor | This color is used to change the background of the single unselected item. | ✅ | Color(0xff303F9F) |
| unselectedIconColor | This color is used to change the color of icon of the single selected item. | ✅ | Color(0xff448AFF) |
| enableDivider | This value is used to enable the SideBar divider. | ✅ | true |
| enableFloating | This value is used to enable the SideBar to become floating. | ✅ | false |
| enablePageView | This value is used to enable the animation to the children of SideBar. | ✅ | true |
| enableResizeBody | This value is used to enable the resize of the SideBar body, if set to false the children in the body will have a fixed size. | ✅ | true |
| collapseWidth | This value determines the width of the SideBar when it is collapsed. | ✅ | 60.0 |
| dividerIndent | This value is used to determine the spacing of the divider in the left and right edges. | ✅ | 10.0 |
| dividerThickness | This value is used to determine the thickness of the Divider inside the SideBar. | ✅ | 0.6 |
| fontSize | This optional value is used to set the size of the SideBarItem font. | ❌ | |
| maxWidth | This value determines the width of the SideBar when it is not collapsed. | ✅ | 260.0 |
| tooltipDecoration | This value is used to set a style for Tooltips when they are enabled. | ❌ | |
| tooltipTextStyle | This value is used to set a style for Text inside Tooltips when they are enabled. | ❌ | |
| selectedTextStyle | This value is used to set a style for Text inside SideBarItem when it is selected. | ✅ | TextStyle( |
| unselectedTextStyle | This value is used to set a style for Text inside SideBarItem when it is unselected. | ✅ | TextStyle( |
| borderRadius | This value is used when [enableFloating] is set to true and is used to set a radius at the edges of the SideBar. | ✅ | BorderRadius.all(Radius.circular(6)) |
| sideBarCurve | This value is used to indicate an animation curve for all SideBar animations. | ✅ | Curves.ease |
| sideBarAnimationDuration | This value is used to indicate a duration for all SideBar animations. | ✅ | Duration(milliseconds: 300) |
| floatingPadding | This value is used to determine the space surrounding the SideBar and is usable when [enableFloating] is set to true. | ✅ | EdgeInsets.all(8) |
SideBarItem #
| Props | Description | Required |
|---|---|---|
| text | This value used for set text of SideBarItem. | ✅ |
| tooltipText | This value used for set tooltip text of SideBarItem, if setted the tooltip show up. | ❌ |
| icon | This value used for set icon of SideBarItem. | ✅ |
NEXT FEATURE #
Write me in the GitHub issues the new features you need and, if they are approved of course, I will implement them as soon as I can.
Metadata
14
likes
150
points
11
downloads
Publisher
unverified uploader
Weekly Downloads
Metadata
This package allows you to have a simple, fast and practical custom SideBar, in fact you will be able to customize almost everything. Seeing is believing.
Repository (GitHub)
View/report issues
Documentation
License
BSD-3-Clause (license)
