GitLocker: The Coding Marketplace

Description:

flutter star

一、描述

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

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

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

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

二、StarScore

分数展示组件

名称
类型
功能
备注
默认

score
double
分数
-
0

star
Star
见第四点
星星属性配置
Star()

tail
Widget
尾部的组件
-
null

StarScore(
score: 4.8,
star: Star(
fillColor: Colors.tealAccent,
emptyColor: Colors.grey.withAlpha(88)),
tail: Column(
children: <Widget>[
Text("综合评分"),
Text("4.8"),
],
),
),
copied to clipboard

三、CustomRating

评分组件

名称
类型
功能
备注
默认

max
int
最大星星数
-
5

score
double
分数
-
0

star
Star
见第四点
星星属性配置
Star()

onRating
Fluction(double)
点击回调
@required
null

1.最简使用

CustomRating(onRating: (s) {
print(s);
}),
copied to clipboard

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);
}),
copied to clipboard

四、Star

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

名称
类型
功能
备注
默认

progress
double
填充的进度
[0,1]
0.0

num
int
星星的角数
大于3
5

fat
double
星星的胖瘦
（0,1]
0.5

emptyColor
Color
星星的色
-
Colors.grey

fillColor
Color
星星的填充色
-
Colors.yellow

size
double
星星的大小
-
20

1. 进度填充:progress

2. 星星的角数:num

3. 星星的胖瘦:fat

4. 星星的颜色:fillColor和emptyColor