Change Notifier Provider to add widget to Favourite Screen - flutter

Question

I've made screen with details of movies and with favourite movies. Also I've got a list of movies. In Detail Screen, there is favourite icon. I want to make that when you tap on this Icon, I want to add this movie to Favourite Screen.
There is a list of movies.
class Movie {
String imgUrl;
String title;
String categories;
int year;
String country;
int length;
String description;
List<String> screenshots;
Movie({
required this.imgUrl,
required this.title,
required this.categories,
required this.year,
required this.country,
required this.length,
required this.description,
required this.screenshots,
});
}
final List<Movie> movies = [
Movie(
imgUrl:
'https://static.posters.cz/image/1300/plakaty/james-bond-no-time-to-die-profile-i114389.jpg',
title: 'No time to die',
categories: 'Adventure',
year: 2021,
country: 'USA/England',
length: 183,
description:
'James Bond has left active service. His peace is short-lived when Felix Leiter, an old friend from the CIA, turns up asking for help, leading Bond onto the trail of a mysterious villain armed with dangerous new technology.',
screenshots: [
'https://i.pinimg.com/originals/fd/5e/1d/fd5e1d8878c402aaba2fb6373e880b1f.webp',
'https://cdn.mos.cms.futurecdn.net/dNmCDjJT5G76aDKiYphTkF.jpg',
'https://i.imgur.com/Zm9X4lT.jpg',
'https://images.complex.com/complex/images/c_fill,f_auto,g_center,w_1200/fl_lossy,pg_1/knie3z7uwe3inyua5kft/no-time-to-die-04'
]),
]
There I've got Detail Screen.
class MovieScreen extends StatefulWidget {
final String photo, title, categories, country, description;
final int year, length;
final List<String> screenshots;
const MovieScreen(
{Key? key,
required this.photo,
required this.title,
required this.categories,
required this.year,
required this.country,
required this.description,
required this.length,
required this.screenshots})
: super(key: key);
#override
_MovieScreenState createState() => _MovieScreenState();
}
class _MovieScreenState extends State<MovieScreen> {
#override
Widget build(BuildContext context) {
final filmData = Provider.of<MovieProvider>(context);
final films = filmData.items;
return Scaffold(
backgroundColor: Colors.white,
body: ListView(
children: [
Stack(
children: [
Container(
transform: Matrix4.translationValues(0, -50, 0),
width: double.infinity,
child: Hero(
tag: widget.photo,
child: ClipShadowPath(
clipper: CircularClipper(),
shadow: Shadow(blurRadius: 20),
child: Image(
height: 400,
image: NetworkImage(widget.photo),
fit: BoxFit.cover,
),
),
),
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
IconButton(
padding: EdgeInsets.only(left: 20),
onPressed: () => Navigator.pop(context),
icon: Icon(Icons.arrow_back),
iconSize: 40,
),
IconButton(
padding: EdgeInsets.only(right: 20),
onPressed: () {},
icon: Icon(Icons.favorite_outline),
iconSize: 30,
color: Colors.red,
),
],
),
],
),
],
),
);
}
}
There is Favourite Screen.
class MyList extends StatefulWidget {
#override
_MyListState createState() => _MyListState();
}
class _MyListState extends State<MyList> {
#override
Widget build(BuildContext context) {
return Scaffold(
body: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Navbar1(),
Container(
width: MediaQuery.of(context).size.width - 60,
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 10),
child: ListView(
children: <Widget>[
SizedBox(
height: 50,
),
HeadMenuMylist(),
SizedBox(
height: 20,
),
GridView.count(
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
mainAxisSpacing: 10,
crossAxisSpacing: 10,
crossAxisCount: 2,
childAspectRatio: 1 / 2,
children: [
Stack(
children: [
Positioned.fill(
child: Container(
height: 200,
foregroundDecoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [Colors.transparent, Colors.black],
),
),
child: ClipRRect(
borderRadius: BorderRadius.circular(10),
child: Image.network(imgUrl
,
loadingBuilder: (BuildContext context,
Widget child,
ImageChunkEvent? loadingProgress) {
if (loadingProgress == null) return child;
return Center(
child: SizedBox(
height: 50,
width: 50,
child: CircularProgressIndicator(
strokeWidth: 4,
color: Colors.red,
),
),
);
},
fit: BoxFit.cover,
),
),
),
),
Padding(
padding: const EdgeInsets.only(bottom: 15),
child: Align(
alignment: Alignment.bottomCenter,
child: Text(
'Peaky Blinders',
style: GoogleFonts.openSans(
color: Colors.white,
fontSize: 18,
fontWeight: FontWeight.w700),
),
),
),
Padding(
padding: const EdgeInsets.only(top: 10, right: 10),
child: Align(
alignment: Alignment.topRight,
child: GestureDetector(
onTap: () {},
child: Icon(
Icons.delete,
color: Colors.white,
),
)),
),
],
),
],
),
],
),
),
),
],
),
);
}
}
I tried with Change Notifier Provider but it doesn't work and I don't have clue why it didn't work. Is there something else I can use instead Change Notifier Provider?
Thanks for help.

Answer 1

if you want to save the favorite movie of a user permanently, then you have to save the JSON data in firestore database.
Create a function to store the favorite movie json data to firestore, i,e , store the json data to collection like;
saveFavrotiesMovies() async {
final User user = auth.currentUser;
final uid = user.uid;
try {
await FirebaseFirestore.instance
.collection('Favorite Movies')
.doc()
.collection(uid.toString())
.doc()
.set(
movies.toJson());
print('data adedd succesfullyyyyyy');
} catch (e, s) {
print("#DatabaseService Exception IN ADDNG FAVOTRITE DATA $e");
print(s);
}
}
This function store the favorite movie of a specific user in his/her collection
Retrive and the Favorite movie json data of a user from the Firestore database using a function in same manner as will do in storing the favorite data, and display the data in the Favorite Screen