A simple ratingbar for flutter which also include a rating bar indicator
Flutter Rating Bar
A simple yet fully customizable ratingbar for flutter which also include a rating bar indicator, supporting any fraction of rating.
Usage
1. Depend
Add this to you package's pubspec.yaml
file:
dependencies:
flutter_rating_bar: ^1.1.0
2. Install
Run command:
$ flutter packages get
3. Import
Import in Dart code:
import 'package:flutter_rating_bar/flutter_rating_bar';
4. Using Flutter Rating Bar
FlutterRatingBar(
initialRating: 3,
fillColor: Colors.amber,
borderColor: Colors.amber.withAlpha(50),
allowHalfRating: true,
onRatingUpdate: (rating) {
print(rating);
},
),
5. Using Flutter Rating Bar Indicator
FlutterRatingBarIndicator(
rating: 2.75,
itemCount: 5,
itemSize: 50.0,
emptyColor: Colors.amber.withAlpha(50),
),
In order to make the indicator scrollable, just use 'physics' property as in the example.
Customize Rating Bar
FlutterRatingBarIndicator(
rating: _userRating,
pathClipper: DiamondClipper(),
itemCount: 5,
itemSize: 50.0,
emptyColor: Colors.amber.withAlpha(50),
),
class DiamondClipper extends CustomClipper<Path> {...}
Customize Rating Bar Indicator
FlutterRatingBar(
initialRating: 2.87,
allowHalfRating: true,
itemPadding: EdgeInsets.symmetric(horizontal: 4.0),
fullRatingWidget: _image("assets/heart.png") ,
halfRatingWidget: _image("assets/heart_half.png"),
noRatingWidget: _image("assets/heart_border.png"),
onRatingUpdate: (rating) {
print(rating);
},
),
Widget _image(String asset) {
return Image.asset(
asset,
height: 30.0,
width: 30.0,
color: Colors.amber,
);
}
Heart Icons are Available Here.