I am trying to create a favorite button for my app. Which work is to change and save color, while the user presses it, So I decided to use hive db for it. When the icon button is tapped; the color get changed, which indicates to the user that it's been marked as their favorite. The problem is when I tap it again(if the user wants to unmark it ) though the color get changed ,when i move to other page or hot start/reload the page, the color changed back to it former self automatically(To the color when it was first pressed).I want the color reactive through the button and be saved. How can I solve this issue?(I am kinda confused at the key part. Maybe that's where the problem occurred)

     class p1 extends StatefulWidget {
     @override
    _p1State createState() => _p1State();
     }

     class _p1State extends State<p1> {
     Box box;
     bool _isFavorite = false;

     _p1State();
     @override
     void initstate(){
     super.initState();
    // Get reference to an already opened box

     box = Hive.box(FAVORITES_BOX);
     final data = box.get(_isFavorite).containskey("1" != null ? Colors.white:Colors.red );
    }

    @override
    Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
       body:Stack(
           children:<Widget>[
           Image(
           image:AssetImage("Image/Chowsun1.jpg"),
         fit:BoxFit.cover,
         width: double.infinity,
         height: double.infinity,
       ),
          Align(alignment: Alignment.center,
              child: Text('      "\n           The  entire  world ,       \n                is  not  worth \n                     A  single  Tear.\n'
                  '                                                      " \n                -Imam Hazrat Ali (R) '
                  ,style: TextStyle(fontSize: 35.0,
                      color: Colors.white,
                      fontFamily: "Explora",
                      fontWeight: FontWeight.w900 ) )



          ),
             Stack ( children: [Positioned(
               top:90,
               right: 20,
               child:const Text('   1 ',
                 style: TextStyle(
                     fontSize: 25.0,
                     color: Colors.white,
                     fontFamily: "Comforter"
                 ),
               ),
             )], ),





        Align(
            alignment: Alignment.bottomCenter,
            child: (
                IconButton(
                    icon: Icon(
                      Icons.favorite,
                        color:_isFavorite ? Colors.white: Colors.red


                    ),

                    onPressed: () {

                      setState(() {
                        _isFavorite= !_isFavorite;
                      });
                      if(box.containsKey(1)){
                        box.delete(1);
                      }else
                      box.put(1, _isFavorite);



                    }

                )
            )
        )])

      ),
    );
  }
}

CodePudding user response：

You can directly initialize hive while it is already open

  Box box = Hive.box(FAVORITES_BOX);
  bool _isFavorite = false;

  @override
  void initState() {
    super.initState();
    _isFavorite = box.get(0) ?? false;
  }

And changing value

onPressed: () {
  setState(() {
    _isFavorite = !_isFavorite;
  });

  box.put(0, _isFavorite);
},

CodePudding user response：

I see you're using a bool _isFavorite to record a like, and then you check for the value of is favorite again to know if to give a like or remove the like, well under the hood your hive is working but basically, the code you're using to update the color is not coming from the hive so when you reupdate your state, e.g Hot Reload everything is reset to the initial leaving your favorite button unchanged.

You basically just need to re-model your logic for it to work properly.