flutter_star 1.0.2 icon indicating copy to clipboard operation
flutter_star: ^1.0.2 copied to clipboard

You can create a star easily and decide how many angle or color of the star, even the fat and progress of the star.

零 使用

dependencies:
  flutter_star: $lastVersion

一、描述

目标: 使用canvas手工打造,一个完美的星星评分组件。

---->[StarScore 星星显示组件]----
[1] 比如显示4.2: 会有5颗星, 前四颗填满,后一刻填充20%
StarScore 为 Stateless组件,仅负责显示的需求

---->[CustomRating 星星评分组件]----
[2] 可指定最大值,也就是显示多少个星星
[3] 点击时会改变状态,进行评分,支持半星评分
[4] 支持评分回调

---->[Star组件]----
[5]. 可定义星星的显示进度情况 0% ~ 100 % 无死角
[6]. 可定义星星的角数
[7]. 可定义星星的颜色、大小

二 、StarScore

分数展示组件

名称类型功能备注默认
scoredouble分数-0
starStar第四点星星属性配置Star()
tailWidget尾部的组件-null
StarScore(
  score: 4.8,
  star: Star(
      fillColor: Colors.tealAccent,
      emptyColor: Colors.grey.withAlpha(88)),
  tail: Column(
    children: <Widget>[
      Text("综合评分"),
      Text("4.8"),
    ],
  ),
),


三 、CustomRating

评分组件

名称类型功能备注默认
maxint最大星星数-5
scoredouble分数-0
starStar第四点星星属性配置Star()
onRatingFluction(double)点击回调@requirednull
1.最简使用

CustomRating(onRating: (s) {
   print(s);
 }),

2.可高度定制

CustomRating(
     max: 6,
     score: 3.0,
     star: Star(
         num: 12,
         fillColor: Colors.orangeAccent,
         fat: 0.6,
         emptyColor: Colors.grey.withAlpha(88)),
    onRating: (s) {
       print(s);
     }),

四 、Star

星星组件 : 高度可定制的配置类

名称类型功能备注默认
progressdouble填充的进度[0,1]0.0
numint星星的角数大于35
fatdouble星星的胖瘦(0,1]0.5
emptyColorColor星星的色-Colors.grey
fillColorColor星星的填充色-Colors.yellow
sizedouble星星的大小-20
1. 进度填充:progress


2. 星星的角数:num


3. 星星的胖瘦:fat


4. 星星的颜色:fillColor和emptyColor


11
likes
100
pub points
86%
popularity

Publisher

verified publisher icontoly1994.com

You can create a star easily and decide how many angle or color of the star, even the fat and progress of the star.

Homepage

Documentation

API reference

License

Icon for licenses.MIT (LICENSE)

Dependencies

flutter

More

Packages that depend on flutter_star