Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/alex-melnyk/flutter_advanced_segment
https://pub.dev/packages/flutter_advanced_segment
https://github.com/alex-melnyk/flutter_advanced_segment
flutter segment
Last synced: 10 days ago
JSON representation
https://pub.dev/packages/flutter_advanced_segment
- Host: GitHub
- URL: https://github.com/alex-melnyk/flutter_advanced_segment
- Owner: alex-melnyk
- License: bsd-3-clause
- Created: 2020-11-27T13:19:15.000Z (almost 4 years ago)
- Default Branch: master
- Last Pushed: 2023-04-24T09:39:30.000Z (over 1 year ago)
- Last Synced: 2024-06-21T16:58:39.656Z (5 months ago)
- Topics: flutter, segment
- Language: Dart
- Homepage: https://pub.dev/packages/flutter_advanced_segment
- Size: 2.49 MB
- Stars: 24
- Watchers: 2
- Forks: 10
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# flutter_advanced_segment
An advanced segment widget, that can be fully customized with bunch of properties, just try it and enjoy!![APP_ICON](./APP_ICON.png)
| | |
|---|---|
| ![Flutter Advanced Segment](./PREVIEW_01.png) | ![Flutter Advanced Segment](./PREVIEW_02.png) |## Examples
### Regular Segment
```dart
// Create a controller
final _controller = AdvancedSegmentController('all');
//...
AdvancedSegment(
controller: _controller, // AdvancedSegmentController
segments: { // Map
'all': 'All',
'starred': 'Starred',
},
),
//...
```### Customized Segment
```dart
// Create a controller
final _controller = AdvancedSegmentController('all');
//...
AdvancedSegment(
controller: _controller, // AdvancedSegmentController
segments: { // Map
'all': 'All',
'primary': 'Primary',
'secondary': 'Secondary',
'tertiary': 'Tertiary',
},
activeStyle: TextStyle( // TextStyle
color: Colors.white,
fontWeight: FontWeight.w600,
),
inactiveStyle: TextStyle( // TextStyle
color: Colors.white54,
),
backgroundColor: Colors.black26, // Color
sliderColor: Colors.white, // Color
sliderOffset: 2.0, // Double
borderRadius: const BorderRadius.all(Radius.circular(8.0)), // BorderRadius
itemPadding: const EdgeInsets.symmetric( // EdgeInsets
horizontal: 15,
vertical: 10,
),
animationDuration: Duration(milliseconds: 250), // Duration
sliderShadow: const [
BoxShadow(
color: Colors.black26,
blurRadius: 8.0,
),
],
),
//...
```## AdvancedSegment Parameters
|Parameter|Description|Type|Default|
|:--------|:----------|:---|:------|
|`controller`|Manage AdvancedSegment state|*AdvancedSegmentController*||
|`segments`|Map of presented segments|*Map*|required|
|`activeStyle`||*TextStyle*|fontWeight: FontWeight.w600|
|`inactiveStyle`||*TextStyle*||
|`backgroundColor`||*Color*|Colors.black26|
|`sliderColor`||*Color*|Colors.white|
|`sliderOffset`||*double*|2.0|
|`borderRadius`||*BorderRadius*|Radius.circular(8.0)|
|`itemPadding`||*EdgeInsets*|EdgeInsets.symmetric(h: 15, v: 10)|
|`animationDuration`||*Duration*|Duration(milliseconds: 250)|
|`sliderShadow`||*BoxShadow*|Shadow|# Demo
![Flutter Advanced Segment Demo](./DEMO.gif)