如何在颤振评分栏中保存用户评分?

问题描述

我正在尝试保存用户评分以在用户返回页面显示它。但我正在挣扎,无法弄清楚如何做到这一点。评级有效,但正如我所说,储蓄无效。 所以发生的事情是它总是空的。我真正想要的是,如果用户返回该页面,他会看到他的评分,如果他再次评分并且评分与上次评分不同,我让他评分,如果没有,则不评分,如果他按清除,评分将删除什么也工作正常。

也许任何人都可以提供帮助。

lass ratingpage extends StatefulWidget {
  final int maximumrating;
  final Function(int) onratingSelected;

  ratingpage(this.onratingSelected,[this.maximumrating = 5]);

  @override
  _ratingpageState createState() => _ratingpageState();
}

class _ratingpageState extends State<ratingpage> {
  int haveusercurrentchoice;

  int _currentrating = 0;

  Widget _buildratingStar(int index) {
    if (index < _currentrating) {
      return Icon(
        Icons.star,color: Colors.yellow,);
    } else {
      return Icon(
        Icons.star,color: Colors.white,);
    }
  }

  Widget _buildBody() {
    final stars = List<Widget>.generate(this.widget.maximumrating,(index) {
      return Expanded(
        child: GestureDetector(
          child: _buildratingStar(index),onTap: () {
            setState(() {
              _currentrating = index;
            });

            this.widget.onratingSelected(_currentrating);
          },),);
    });
    return Row(
      children: [
        Expanded(
          child: Row(
            children: stars,Expanded(
          child: TextButton(
            onpressed: () {
              setState(() {
                _currentrating = 0;
              });

              this.widget.onratingSelected(_currentrating);
            },child: Text(
              "Clear",style: TextStyle(color: Colors.white),],);
  }

  @override
  Widget build(BuildContext context) {
    return _buildBody();
  }

如果您需要更多信息,请发表评论

这就是我调用页面的方式

 Container(
                                width: 210,height: 94,//color: Colors.blue.withOpacity(0.5),child: Column(
                                  children: [
                                    InkWell(
                                      onTap: () {
                                        setState(() {
                                          israting = true;
                                        });
                                        //  if( _rating !=null && _rating >0){
                                        // likevideo(videos.data()['id']);}
                                      },child: israting
                                          ? Container(
                                              height: 50,margin: EdgeInsets.fromLTRB(
                                                  0,5,0),child: Column(
                                                children: [
                                                  ratingpage((rating) {
                                                    setState(() {
                                                      _rating = rating;
                                                    });

                                                    if (_rating != null &&
                                                        _rating > 0) {
                                                      likevideo(
                                                          videos.data()['id'],_rating);

                                                      print(delteuserchoicing);
                                                    } else if (_rating ==
                                                            null ||
                                                        _rating == 0) {
                                                      dislike(
                                                          videos.data()['id'],_rating);
                                                    }
                                                  }),)
                                          : Icon(
                                              Icons.star,size: 37,color: videos
                                                      .data()['likes']
                                                      .contains(uid)
                                                  ? Colors.yellow
                                                  : Colors.white,

实际上是在一个列内

解决方法

因此,您在页面之间存储状态存在问题,然后在应用程序重启时存储评级存在问题。 2个独立的东西。您可能只关心前者,但这里是如何使用 GetX State managementGetStorage 来实现本地数据库存储。同样的事情可以用任何其他状态管理解决方案来完成,即。提供商、Riverpod、Bloc 等...

GetStorage 可与 SharedPreferences 互换,但我认为使用过两者的任何人都会同意 GetStorage 更易于使用。

为了清理我的示例,我删除了完成您所要求的任务所不需要的任何内容。根据您应用其余部分的情况,您可能不需要带回我删除的大部分或全部变量。

首先,让我们将逻辑和变量移动到 GetX 类,以便从应用程序的任何位置访问它们。它还有助于清理您的 UI 代码。

class RatingController extends GetxController {
  int currentRating = 0;
  final box = GetStorage();

  @override
  void onInit() { // called whenever we initialize the controller
    super.onInit();
    currentRating = box.read('rating') ?? 0; // initializing current rating from storage or 0 if storage is null
  }

  void updateAndStoreRating(int rating) {
    currentRating = rating;
    box.write('rating',rating); // stores to local database
    update(); // triggers a rebuild of the GetBuilder Widget
  }

  Widget buildRatingStar(int index) {
    if (index < currentRating) {
      return Icon(
        Icons.star,color: Colors.yellow,);
    } else {
      return Icon(
        Icons.star,color: Colors.white,);
    }
  }
}

我在此页面上添加了一个按钮,仅用于演示目的。由于此演示包括路由,因此我使用 Getx 也是一种更容易进行路由的方法,但它与回答您的问题完全无关或没有必要。此页面现在也可以是无状态的。

class Ratingpage extends StatelessWidget {
  static const id = 'rating_page'; // see GetMaterialApp for this usage

  final controller = Get.find<RatingController>(); // finding the same instance of initialized controller

  Widget _buildBody() {
    final stars = List<Widget>.generate(5,(index) {
      return GetBuilder<RatingController>( // rebuilds when update() is called from GetX class
        builder: (controller) => Expanded(
          child: GestureDetector(
            child: controller.buildRatingStar(index),onTap: () {
              controller.updateAndStoreRating(index + 1); // +1 because index starts at 0 otherwise the star rating is offset by one
            },),);
    });
    return Row(
      children: [
        Expanded(
          child: Row(
            children: stars,Expanded(
          child: TextButton(
            onPressed: () {
              controller.updateAndStoreRating(0);
            },child: Text(
              "Clear",style: TextStyle(color: Colors.white),],);
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,children: [
        _buildBody(),ElevatedButton(
          onPressed: () {
            Get.to(() => OtherPage()); // equivalent of Navigator.push....
          },child: Text('Other Page'),)
      ],);
  }
}

您的主要方法现在看起来像这样,因为我们需要初始化控制器和存储。

void main() async {
  await GetStorage.init();
  Get.put(RatingController());

  runApp(MyApp());
}

同样,为了更容易路由,我们使用 GetMaterialApp 并在那里定义页面。

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      title: 'Material App',home: Ratingpage(),getPages: [ // only necessary for routing,not for storage or state management
        GetPage(name: OtherPage.id,page: () => OtherPage()),GetPage(name: Ratingpage.id,page: () => Ratingpage()),);
  }
}

编辑:由于未维护的包与 GetStorage 路径提供程序依赖项冲突,添加了 SharedPreferences

SharedPreferences prefs; 添加到您的 GetX 类。

这是您现在的更新功能。

void updateAndStoreRating(int rating) {
    currentRating = rating;
    prefs.setInt('rating',rating); //SharedPreferences way
    update(); // triggers a rebuild of the GetBuilder Widget
  }

在 GetX Controller 类中添加一个 init 函数。

 Future<void> initSp() async {
    prefs = await SharedPreferences.getInstance();
    currentRating = prefs.getInt('rating') ?? 0;
  }

现在你的主菜有点不同。

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  
  final controller = Get.put(RatingController());
  await controller.initSp();

  runApp(MyApp());
}

enter image description here

相关问答

Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其...
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。...
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbc...