Почему не отображаются сохраненные новости?

Пытаюсь реализовать страницу "Сохраненные", где будут отображаться сохраненные новости. Новости приходят через 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'] ?? "",
    );
  }
}

Добавьте Article модель тоже. Так что я могу помочь вам.

DholaHardik 10.04.2022 08:20

Добавлена ​​модель статьи

oleg_ 10.04.2022 08:25
Формы c голосовым вводом в React с помощью Speechly
Формы c голосовым вводом в React с помощью Speechly
Пытались ли вы когда-нибудь заполнить веб-форму в области электронной коммерции, которая требует много кликов и выбора? Вас попросят заполнить дату,...
Стилизация и валидация html-формы без использования JavaScript (только HTML/CSS)
Стилизация и валидация html-формы без использования JavaScript (только HTML/CSS)
Будучи разработчиком веб-приложений, легко впасть в заблуждение, считая, что приложение без JavaScript не имеет права на жизнь. Нам становится удобно...
Flatpickr: простой модуль календаря для вашего приложения на React
Flatpickr: простой модуль календаря для вашего приложения на React
Если вы ищете пакет для быстрой интеграции календаря с выбором даты в ваше приложения, то библиотека Flatpickr отлично справится с этой задачей....
В чем разница между Promise и Observable?
В чем разница между Promise и Observable?
Разберитесь в этом вопросе, и вы значительно повысите уровень своей компетенции.
Что такое cURL в PHP? Встроенные функции и пример GET запроса
Что такое cURL в PHP? Встроенные функции и пример GET запроса
Клиент для URL-адресов, cURL, позволяет взаимодействовать с множеством различных серверов по множеству различных протоколов с синтаксисом URL.
Четыре эффективных способа центрирования блочных элементов в CSS
Четыре эффективных способа центрирования блочных элементов в CSS
У каждого из нас бывали случаи, когда нам нужно отцентрировать блочный элемент, но мы не знаем, как это сделать. Даже если мы реализуем какой-то...
0
2
30
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

См. getx_example для контроллера GetX.

//// Оберните SizedBox виджетом Obx.

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,
              );
            }),
      );
    });
  }
}

//// Удалите double.infinityширина из Контейнер.

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),
            ),
          ),
        ],
      ),
    );
  }
}

Другие вопросы по теме