基础列表更新后,Flutter ListView不会更新

时间:2020-05-16 18:53:36

标签: flutter dart flutter-listview

我正在构建这个纸牌游戏应用程序,其中包含纸牌(具有特殊效果的容器)列表,并且该列表由提供者/消费者机制管理和更新。

它看起来像这样 enter image description here

class LowerSectionWithScrollingCardList extends StatefulWidget {
  @override
  _LowerSectionWithScrollingCardListState createState() =>
      _LowerSectionWithScrollingCardListState();
}

class _LowerSectionWithScrollingCardListState
    extends State<LowerSectionWithScrollingCardList> {

  @override
  Widget build(BuildContext context) {
    return Consumer<GameState>(builder: (context, gameState, child) {
      print('lower list ${gameState.gcurrentPlayers[0].ownList}');
      return Expanded(
        flex: 34,
        child: Container(
          color: Colors.white,
          child: ListView(
            children: gameState.gcurrentPlayers[0].ownList,
            scrollDirection: Axis.horizontal,
          ),
        ),
      );
    });
  }
}

gameState.gcurrentPlayers [0] .ownList是我们的第一个玩家,ownlist是通过单击应用程序中的其他按钮进行更新的小部件或卡片的实际列表。

通过此方法完全更新列表

void ggiveCardToCurrentPlayer(int howMuch){
    for(int i=0;i<howMuch;i++)
      ggetPlayerWithCurrentTurn().ownList.add(gplayingCards.removeLast());
    notifyListeners();
  }

现在,在调用“ notifylisteners”之后,我100%确定使用新数据更新了Consumer,因为build方法中的print语句将打印新添加的卡。

最后,问题是listView本身不会更新,而其呈现的列表具有已添加的卡片。

我检查了一些有关类似问题的帖子,他们建议给数据项添加密钥,在我的情况下,数据项是我的卡片,然后我向它们添加密钥。没变化。

class RegularUnoCard extends StatelessWidget{
  final Color _color;
  final String _value;
  final Key _key;
  RegularUnoCard(this._color, this._value,this._key);

@override
  Widget build(BuildContext context) {
    return Container(
      key: _key,
      margin: EdgeInsets.symmetric(
          vertical: _cardMarginVer, horizontal: _cardMarginHor),
      padding: EdgeInsets.all(15),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(_cardCornerRadii),
        border: Border.all(color: _color, width: 4, style: BorderStyle.solid),
        boxShadow: [
          BoxShadow(
              color: _color,
              spreadRadius: (_value == plus2) ? 8 : 2,
              blurRadius: 5)
        ],
        color: Colors.white,
      ),
      child: Container(
        height: _cardHeight,
        width: _cardWidth,
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(60),
          color: _color,
        ),
        child: Center(
          child: getLogo(),
        ),
      ),
    );
  }

我希望这是将密钥放入卡中的正确方法。

我还读到一个人必须调用setState(),但是我没有任何地方可以从listView中调用Setstate。

我尝试用Provider.of(context).playerlist [0] .ownlist等替换ownList逻辑,但这也不起作用

我希望我已为此次评估提供了足够的数据。如果需要更多信息,请发表评论。非常感谢您的时间和建议。

1 个答案:

答案 0 :(得分:1)

我阅读了有关该问题的更多信息,很有帮助的来源是this

基本上,我的列表正在更新,但我提供了数组的引用,并且由于flutter处理不可变数据,因此无法检测到我的数组更改。因此,我要做的就是从现有参考数组中构建一个新列表。

children: List<Widget>.from(gameState.gcurrentPlayers[0].ownList),

最终的ListView应该看起来像

@override
  Widget build(BuildContext context) {
    return Consumer<GameState>(builder: (context, gameState, child) {
      print('lower list ${gameState.gcurrentPlayers[0].ownList}');
      return Expanded(
        flex: 34,
        child: Container(
          color: Colors.white,
          child:ListView(
            children: List<Widget>.from(gameState.gcurrentPlayers[0].ownList),
            scrollDirection: Axis.horizontal,
          ),
        ),
      );
    },key: UniqueKey(),);
  }
}

现在我的纸牌游戏正在使用新纸牌进行更新!