如何做随机数的星星？ （评分）

Question

做一排星星作为评分是微不足道的，但我不确定做一个随机数的正确的颤动方式是什么？

换句话说，我说评级最多有5颗星，我该怎么做，只有一颗或两颗星？我可以有一个switch语句，并返回带有一颗或两颗星的相应行小部件，但这些似乎是一种丑陋的方式。

是否有适当的颤动/飞镖方式来做这种事情？

（我的问题当然不仅仅是关于这一点，我想找到做这种事情的正确的颤振方法）

Answer 1

回答这个问题：How to create rating star bar properly?

与此同时，我举了一个Star rating小部件的例子，可以使用任意数量的星号（默认情况下为5）。

typedef void RatingChangeCallback(double rating);

class StarRating extends StatelessWidget {
  final int starCount;
  final double rating;
  final RatingChangeCallback onRatingChanged;
  final Color color;

  StarRating({this.starCount = 5, this.rating = .0, this.onRatingChanged, this.color});

  Widget buildStar(BuildContext context, int index) {
    Icon icon;
    if (index >= rating) {
      icon = new Icon(
        Icons.star_border,
        color: Theme.of(context).buttonColor,
      );
    }
    else if (index > rating - 1 && index < rating) {
      icon = new Icon(
        Icons.star_half,
        color: color ?? Theme.of(context).primaryColor,
      );
    } else {
      icon = new Icon(
        Icons.star,
        color: color ?? Theme.of(context).primaryColor,
      );
    }
    return new InkResponse(
      onTap: onRatingChanged == null ? null : () => onRatingChanged(index + 1.0),
      child: icon,
    );
  }

  @override
  Widget build(BuildContext context) {
    return new Row(children: new List.generate(starCount, (index) => buildStar(context, index)));
  }
}

然后您可以使用

来使用它

class Test extends StatefulWidget {
    @override
    _TestState createState() => new _TestState();
  }

  class _TestState extends State<Test> {
    double rating = 3.5;

    @override
    Widget build(BuildContext context) {
      return new StarRating(
        rating: rating,
        onRatingChanged: (rating) => setState(() => this.rating = rating),
        starCount: 2
      );
    }
  }