更改通知提供程序以将小部件添加到收藏屏幕
Posted
技术标签:
【中文标题】更改通知提供程序以将小部件添加到收藏屏幕【英文标题】：Change Notifier Provider to add widget to Favourite Screen 【发布时间】：2022-01-08 12:21:45 【问题描述】：我用电影的细节和最喜欢的电影制作了屏幕。我也有电影清单。在详细画面中，有favourite icon。我想当你点击这个图标时，我想把这部电影添加到Favorite Screen。
有一个电影列表。
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'
]),
]
这里有详细信息屏幕。
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,
),
],
),
],
),
],
),
);
有喜欢的画面。
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,
),
)),
),
],
),
],
),
],
),
),
),
],
),
);
我尝试使用 Change Notifier Provider，但它不起作用，我不知道为什么它不起作用。还有什么我可以用Change Notifier Provider代替吗？
感谢您的帮助。
【问题讨论】：
您可以使用各种可用于 Flutter 的状态管理技术，例如 Flutter bloc：pub.dev/packages/flutter_bloc，这里讨论的可用状态管理技术很少：docs.flutter.dev/development/data-and-backend/state-mgmt/… 【参考方案1】：如果您想永久保存用户最喜欢的电影，则必须将 JSON 数据保存在 firestore 数据库中。
创建一个函数将喜欢的电影json数据存储到firestore，即将json数据存储到集合中；
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);
此功能将特定用户最喜欢的电影存储在他/她的收藏中
-
使用与存储收藏夹数据相同的方法从 Firestore 数据库中检索和收藏用户的电影 json 数据，并在收藏夹屏幕中显示数据
【讨论】：
以上是关于更改通知提供程序以将小部件添加到收藏屏幕的主要内容，如果未能解决你的问题，请参考以下文章