Flutter评分插件phoenix_rating的使用

特性

phoenix_rating 是一个企业级的基础组件，用于在 Flutter 应用中实现评分功能。

开始使用

要开始使用 phoenix_rating 插件，首先需要将其添加到你的 pubspec.yaml 文件中：

dependencies:
  phoenix_rating: ^1.0.0

然后运行 flutter pub get 来安装依赖。

使用方法

示例代码

以下是一个简单的示例，展示了如何在 Flutter 应用中使用 phoenix_rating 插件。

import 'package:flutter/material.dart';
import 'package:phoenix_rating/phoenix_rating.dart'; // 导入 phoenix_rating 包

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: RatingExample(),
    );
  }
}

class RatingExample extends StatefulWidget {
  @override
  _RatingExampleState createState() => _RatingExampleState();
}

class _RatingExampleState extends State<RatingExample> {
  double rating = 0.0; // 初始化评分值

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('评分插件示例'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              '当前评分：$rating',
              style: TextStyle(fontSize: 20),
            ),
            SizedBox(height: 20),
            PhoenixRating( // 使用 PhoenixRating 组件
              initialRating: rating, // 初始评分值
              onRatingChanged: (newRating) { // 评分改变时的回调函数
                setState(() {
                  rating = newRating;
                });
              },
              maxRating: 5, // 最大评分值
              size: 50, // 星星大小
              color: Colors.orange, // 星星颜色
              borderColor: Colors.grey, // 边框颜色
            ),
          ],
        ),
      ),
    );
  }
}

代码解释

1. 导入包：

   import 'package:phoenix_rating/phoenix_rating.dart';
   

   这行代码导入了 phoenix_rating 包，以便在应用中使用 PhoenixRating 组件。

2. 初始化评分值：

   double rating = 0.0;
   

   这里定义了一个变量 rating 来存储当前的评分值。

3. PhoenixRating 组件：

   PhoenixRating(
     initialRating: rating,
     onRatingChanged: (newRating) {
       setState(() {
         rating = newRating;
       });
     },
     maxRating: 5,
     size: 50,
     color: Colors.orange,
     borderColor: Colors.grey,
   )