Flutter 如何将评级从字符串更改为星级？

问题描述

所以我正在使用 themoviedb.org API 制作一个电影应用程序，我设法调用了评分，但我得到的是一个 idk，它被称为可能是一个数字，我想更改这个数字或将此数字转换为一颗星,5 如果我可以的话（有 8,8 评级仅供参考）并知道如何

代码如下：

Chip(
     backgroundColor: Style.Colors.secondColor,label: Text(
     'rating: ' + movies[index].rating.toString(),style: TextStyle(fontFamily: 'Raleway'),),

这里是完整的代码，以防您需要它：

import 'package:Flutter/material.dart';

import 'package:movie_app_3/bloc/get_movies_bloc.dart';
import 'package:movie_app_3/model/movie.dart';
import 'package:movie_app_3/model/movie_response.dart';
import 'package:movie_app_3/screens/movie_detail_screen/movie_detail_screen.dart';
import 'package:movie_app_3/style/theme.dart' as Style;

class TopMovies extends StatefulWidget {
  @override
  _TopMoviesstate createState() => _TopMoviesstate();
}

class _TopMoviesstate extends State<TopMovies> {
  void initState() {
    super.initState();
    moviesBloc..getMovies();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,children: <Widget>[
        Padding(
          padding: const EdgeInsets.only(top: 8.0),child: Divider(
            color: Style.Colors.thirdColor,indent: MediaQuery.of(context).size.width * 0.45,endindent: MediaQuery.of(context).size.width * 0.45,thickness: 5,Padding(
          padding: const EdgeInsets.only(left: 20.0,top: 10.0),child: Text(
            "Top Movies",style: TextStyle(
                color: Colors.black,fontWeight: FontWeight.w500,fontFamily: 'Poppins',fontSize: 17.0),Divider(
          color: Colors.black,indent: 22,endindent: MediaQuery.of(context).size.width * 0.8,thickness: 1,SizedBox(
          height: 5.0,StreamBuilder<MovieResponse>(
          stream: moviesBloc.subject.stream,builder: (context,AsyncSnapshot<MovieResponse> snapshot) {
            if (snapshot.hasData) {
              if (snapshot.data.error != null &&
                  snapshot.data.error.length > 0) {
                return _buildErrorWidget(snapshot.data.error);
              }
              return _buildHomeWidget(snapshot.data);
            } else if (snapshot.hasError) {
              return _buildErrorWidget(snapshot.error);
            } else {
              return _buildLoadingWidget();
            }
          },)
      ],);
  }

  Widget _buildLoadingWidget() {
    return Center(
        child: Column(
      mainAxisAlignment: MainAxisAlignment.center,children: [
        SizedBox(
          height: 25.0,width: 25.0,child: CircularProgressIndicator(
            valueColor: new AlwaysstoppedAnimation<Color>(Colors.white),strokeWidth: 4.0,));
  }

  Widget _buildErrorWidget(String error) {
    return Center(
        child: Column(
      mainAxisAlignment: MainAxisAlignment.center,children: [
        Text("Error occured: $error"),],));
  }

  Widget _buildHomeWidget(MovieResponse data) {
    List<Movie> movies = data.movies;
    if (movies.length == 0) {
      return Container(
        width: MediaQuery.of(context).size.width,child: Column(
          mainAxisAlignment: MainAxisAlignment.center,crossAxisAlignment: CrossAxisAlignment.center,children: <Widget>[
            Column(
              children: <Widget>[
                Text(
                  "No More Movies",style: TextStyle(color: Colors.black45),)
              ],)
          ],);
    } else
      return Container(
        height: MediaQuery.of(context).size.height * 0.695,padding: EdgeInsets.only(left: 10.0),child: ListView.builder(
          scrollDirection: Axis.vertical,itemCount: movies.length,itemBuilder: (context,index) {
            return Padding(
              padding: EdgeInsets.only(top: 10.0,bottom: 10.0,right: 15.0),child: GestureDetector(
                onTap: () {
                  Navigator.push(
                    context,MaterialPageRoute(
                      builder: (context) =>
                          MovieDetailScreen(movie: movies[index]),);
                },child: Card(
                  shape: RoundedRectangleBorder(
                    side: BorderSide(color: Colors.black,width: 1),borderRadius: BorderRadius.all(Radius.circular(20.0)),child: Row(
                    crossAxisAlignment: CrossAxisAlignment.start,children: [
                      Hero(
                        tag: movies[index].id,child: Container(
                            width: 120.0,height: 190.0,decoration: new Boxdecoration(
                              borderRadius: BorderRadius.only(
                                topLeft: Radius.circular(20),bottomLeft: Radius.circular(20),bottomright: Radius.circular(40),shape: BoxShape.rectangle,image: new decorationImage(
                                  fit: BoxFit.cover,image: NetworkImage(
                                      "https://image.tmdb.org/t/p/w200/" +
                                          movies[index].poster)),)),SizedBox(
                        width: 40,Container(
                        width: MediaQuery.of(context).size.width * 0.45,child: Column(
                          children: [
                            SizedBox(
                              height: 20,Text(
                              movies[index].title,maxLines: 3,style: TextStyle(
                                  height: 1.4,color: Style.Colors.subtitleColor,fontWeight: FontWeight.bold,fontSize: 15.0),SizedBox(
                              height: 10,Chip(
                              backgroundColor: Style.Colors.secondColor,label: Text(
                                'rating: ' + movies[index].rating.toString(),Text(
                              movies[index].overview,overflow: TextOverflow.fade,textAlign: TextAlign.justify,fontFamily: 'Raleway',fontSize: 11.0),SizedBox(
                              height: 20,)
                    ],);
          },);
  }
}

解决方法

为什么不使用 https://pub.dev/packages/flutter_rating_bar

突出特点

• 设置最低和最高评级
• 任何小部件都可以用作评分栏/指标项
• 可以在每个位置的相同评分栏中使用不同的小部件
• 支持垂直布局
• 在互动中发光
• 支持 RTL 模式