为什么保存的新闻不显示？

Question

我正在尝试实现“已保存”页面，其中将显示已保存的新闻。新闻来自 API 并显示在卡片中。每个新闻都可以保存。单击一个图标将在单独的页面上显示它。但是现在有些东西不起作用了。你能帮忙实施吗？我将不胜感激）

单击图标时触发的控制器代码：

Widget customListTile(Article article, BuildContext context) {
  final newsController = Get.put(FavoritesController());
  ...
  IconButton(
             onPressed: () 
                         {
                          newsController.addNews(article);
                          },
                          icon: const Icon(Icons.favorite_border))
}


class FavoritesController extends GetxController {

  var _news = {}.obs;

  void addNews(Article article) {
    if(_news.containsKey(article)) {
      _news[article] += 1;
    } else {
      _news[article] = 1;
    }


   Get.snackbar("News added", "You have added the ${article.title}",
   snackPosition: SnackPosition.BOTTOM,
       duration: Duration(seconds: 2)
   );
  }

  get news => _news;
}

以及输出页面本身的代码。现在，我只想在那里显示添加新闻的图片，但它们不会出现在那里：

class FavNews extends StatelessWidget {
  final FavoritesController controller = Get.find();

  FavNews({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 600,
      child: ListView.builder(
          itemCount: controller.news.length,
          itemBuilder: (BuildContext context, int index) {
            return FavNewsItem(
              controller: controller,
              article: controller.news.keys.toList()[index],
              index: index,
            );
          }),
    );
  }
}


class FavNewsItem extends StatelessWidget {
  final FavoritesController controller;
  final Article article;
  final int index;

  const FavNewsItem({Key? key, required this.controller, required this.article, required this.index}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Padding(padding: const EdgeInsets.symmetric(
      horizontal: 20.0,
      vertical: 10,
    ),
    child: Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        Container(
          height: 200.0,
          width: double.infinity,
          decoration: BoxDecoration(
            image: DecorationImage(
                image: NetworkImage(article.urlToImage), fit: BoxFit.cover),
            borderRadius: BorderRadius.circular(12.0),
          ),
        ),
      ],
    ),
    );
  }
}

我的文章模型：

//Source model

class Source {
  String id;
  String name;

  Source({required this.id, required this.name});

  factory Source.fromJson(Map<String, dynamic> json) {
    return Source(id: json['id'], name: json['name']);
  }
}

// Article model 

import 'source_model.dart';

class Article {
  Source source;
  String author;
  String title;
  String description;
  String url;
  String urlToImage;
  String publishedAt;
  String content;

  Article(
      {required this.source,
      required this.author,
      required this.title,
      required this.description,
      required this.url,
      required this.urlToImage,
      required this.publishedAt,
      required this.content});


  factory Article.fromJson(Map<String, dynamic> json) {
    return Article(
      source: Source.fromJson(json['source']),
      author: json['author'] ?? "",
      title: json['title'] ?? "",
      description: json['description'] ?? "",
      url: json['url'] ?? "",
      urlToImage: json['urlToImage'] ?? "",
      publishedAt: json['publishedAt'] ?? "",
      content: json['content'] ?? "",
    );
  }
}

Answer 1

GetX 控制器参考getx_example。

//// 用 Obx 小部件包裹 SizedBox。

class FavNews extends StatelessWidget {
  final FavoritesController controller = Get.find();

  @override
  Widget build(BuildContext context) {
    return Obx(() {
      return SizedBox(
        height: 600,
        child: ListView.builder(
            itemCount: controller.news.length,
            itemBuilder: (BuildContext context, int index) {
              return FavNewsItem(
                article: controller.news.keys.toList()[index],
                index: index,
              );
            }),
      );
    });
  }
}

//// 从 Container.

中删除 double.infinity width

class FavNewsItem extends StatelessWidget {
  final Article article;
  final int index;

  FavNewsItem({required this.article, required this.index});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.symmetric(horizontal: 20.0, vertical: 10),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Container(
            height: 200.0,
            width: 200.0,
            // width: double.infinity,
            decoration: BoxDecoration(
              image: DecorationImage(
                  image: NetworkImage(article.urlToImage), fit: BoxFit.cover),
              borderRadius: BorderRadius.circular(12.0),
            ),
          ),
        ],
      ),
    );
  }
}

为什么保存的新闻不显示？

Why are saved news not showing up?

dart

flutter

flutter-getx