Flutter评分对话框插件 slide_rating_dialog 的使用

slide_rating_dialog 是一个用于收集用户反馈和评分的 Flutter 插件。它提供了美观且可定制的滑动评分对话框，支持 iOS 和 Android 平台。

功能特性

• 滑动评分：用户可以通过滑动手指选择评分。
• 可定制设计：可以自定义对话框的颜色、图标和文本等外观属性。
• 回调函数：通过回调函数接收并处理用户的评分。
• 响应迅速：设计了平滑流畅的动画效果，确保用户交互体验良好。

安装步骤

1. 在 pubspec.yaml 文件中添加依赖：

   dependencies:
     slide_rating_dialog: <latest version>
   

2. 运行以下命令获取包：

   flutter pub get
   

3. 在 Dart 代码中导入包：

   import 'package:slide_rating_dialog/slide_rating_dialog.dart';
   

使用示例

下面是一个完整的示例 Demo，展示了如何在 Flutter 应用中使用 slide_rating_dialog 插件。

示例代码

import 'package:flutter/material.dart';
import 'package:slide_rating_dialog/slide_rating_dialog.dart';

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

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Slide Rating Dialog',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Slide Rating Dialog'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        centerTitle: true,
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            GestureDetector(
              onTap: () {
                showDialog(
                  context: context,
                  barrierDismissible: true,
                  builder: (BuildContext cont) => SlideRatingDialog(
                    onRatingChanged: (rating) {
                      print('User rating: $rating');
                    },
                    buttonOnTap: () {
                      // 执行业务逻辑
                      Navigator.pop(context);
                    },
                    buttonTitle: "Rate Us",
                  ),
                );
              },
              child: Container(
                width: MediaQuery.of(context).size.width * 0.7,
                height: 48.0,
                decoration: BoxDecoration(
                  color: Colors.deepPurpleAccent,
                  borderRadius: BorderRadius.circular(12.0),
                ),
                alignment: Alignment.center,
                child: const Text(
                  "Show Dialog",
                  style: TextStyle(
                    fontSize: 18.0,
                    color: Colors.white,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}