使用颤振文档在每个视图图块上创建带有心形图标的随机单词列表视图。 （请在下面找到问题）

Posted 2023-02-23

【中文标题】使用颤振文档在每个视图图块上创建带有心形图标的随机单词列表视图。 （请在下面找到问题）

【英文标题】：Creating a list view of random words with heart icon on each view tile using the flutter documentation. (Please find the problem below)

【发布时间】：2021-10-24 04:06:20

【问题描述】：

问题：当点击心形图标时，它应该将图标类型从空心图标更改为填充心形图标。 此外，当点击心形图标时，它应该显示为红色，但也没有出现

请在下面找到特定小部件的相关代码

_pairList 是正在渲染的随机英语单词列表， _saved 是一个集合，其中包含通过单击心形图标选择的值

WordPair 是一个导入的 dart 库，可以随机获取英文单词。

final _pairList = <WordPair>[];


final _saved = <WordPair>;

  Widget wordListHolder() 
    return ListView.builder(
      padding: const EdgeInsets.all(26.0),
      itemBuilder: (BuildContext context, int index) 
        if (index >= _pairList.length) 
          _pairList.addAll(generateWordPairs().take(10)); /*4*/
        
        final _getword = WordPair.random();
        final alreadySaved = _saved.contains(_getword);

        return Column(
          children: <Widget>[
            ListTile(
              title: Text(_getword.asPascalCase),
              trailing: Icon(
                alreadySaved ? Icons.favorite : Icons.favorite_border,// main concern
                color: alreadySaved ? Colors.red : null,// main concern
              ),
              onTap: () 
                setState(() 
                  if (alreadySaved == true) 
                    _saved.remove(_getword);
                   else 
                    _saved.add(_getword);
                  
                );
              ,
            ),
            Divider(),
          ],
        );
      ,
    );
  

【参考方案1】：

试试这个：

final _getword = WordPair.random();
if (index >= _pairList.length) 
          _pairList.add(_getword); 
        

我认为您的 _pairList 和 _saved 列表中应该有相同的项目。

【讨论】：

对于 if 语句，我想在向下滚动时再生成 10 个随机单词，这就是我有这个的原因 (generateWordPairs().take(10)) 但是，_saved 是一个应该只拥有通过单击心形图标选择的单词。我正在关注此文档flutter.dev/docs/get-started/codelab

问题是您正在生成 10 个随机单词，直到您将它们的数据存储在您的 _saved 列表中。但是，您正在生成一个新单词（也是随机的），因此生成的单词不会出现在您选择的列表中。

我明白你的意思，也有办法 console.log 列表。我尝试了 print()、log() 但由于某种原因没有任何效果。有什么建议吗？

在 Flutter 中，您应该使用 print("YOUR TEXT") 进行日志记录过程。确保您提供了一个有效的String 值，就我个人而言，我通常会在我的字符串中添加一个前缀。例如print("MY LOG" + YourVariable.toString())