更改通知程序提供程序以将小部件添加到收藏屏幕

Question

我用电影的细节和最喜欢的电影制作了屏幕。我还有一份电影清单。在详情画面中，有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?

感谢您的帮助。

Answer 1

如果您想永久保存用户最喜欢的电影，那么您必须将 JSON 数据保存在 firestore 数据库中。

创建一个函数将最喜欢的电影 json 数据存储到 firestore，即，将 json 数据存储到 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);
 }
 }

此函数将特定用户最喜欢的电影存储在 his/her collection

使用与存储收藏夹数据相同的功能从 Firestore 数据库中检索和收藏电影json 用户数据，并在收藏夹屏幕中显示数据

更改通知程序提供程序以将小部件添加到收藏屏幕

Change Notifier Provider to add widget to Favourite Screen

navigation

dart

flutter

flutter-provider

flutter-change-notifier