0

我的任务是当用户在另一个屏幕上订购商品时从同一选项卡上的屏幕返回时显示黑色横幅。下面的当前代码仅在用户通过选择另一个选项卡离开然后返回屏幕时适当地显示黑色横幅。我需要动态呈现的部分以“if (OrderProvider.listOrderSummary.isNotEmpty)”开头。我相信这涉及使无状态小部件有状态,但这会导致错误表明这可能不是正确的方法。

class GridItems extends StatelessWidget {
  GridItems({@required this.infinityPageController});

  final InfinityPageController infinityPageController;

  @override
  Widget build(BuildContext context) {
    final List<Item> itemList = Provider.of<List<Item>>(context);
    if (itemList == null) {
       return Center(
       child: CupertinoActivityIndicator(
         radius: 20,
       ),
    );
  }
  final List<Item> mapItemList = itemList.toList();
    return Column(
      children: <Widget>[
        TopMenuNavigation(
          infinityPageController: infinityPageController,
          title: 'ALL ITEMS',
        ),
        Divider(
          color: Colors.grey,
        ),
        Expanded(
          child: GridView.builder(
            gridDelegate:
               SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
            itemCount: itemList.length,
            itemBuilder: (BuildContext contex, int index) {
              return Center(
                child: InkWell(
                  onTap: () {
                    Navigator.of(context)
                        .pushNamed('/order', arguments: mapItemList[index]);
                  },
                  child: Container(
                    width: 310,
                    margin: EdgeInsets.all(7),
                    decoration: BoxDecoration(
                      color: Colors.white,
                      border: Border.all(width: 1, color: Colors.grey),
                      borderRadius: BorderRadius.all(
                        Radius.circular(7.0),
                      ),
                    ),
                    child: Column(
                      children: <Widget>[
                        Container(
                          padding: EdgeInsets.only(left: 10, top: 10),
                          width: double.infinity,
                          child: Text('${mapItemList[index].itemName}'),
                        ),
                        Expanded(
                          child: Image.network(
                            '${mapItemList[index].imageUrl}',
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
              );
            },
          ),
        ),
        if (OrderProvider.listOrderSummary.isNotEmpty)
          GestureDetector(
            onTap: () {
              Navigator.of(context).pushNamed('/review_order');
            },
            child: Container(
              height: 55,
              color: Colors.black,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: <Widget>[
                  Spacer(),
                  Text(
                    'REVIEW ORDER (${OrderProvider.listOrderSummary.length} items)',
                    style: TextStyle(
                        fontSize: 17,
                        color: Colors.white,
                        fontFamily: 'OpenSans',
                        fontWeight: FontWeight.bold),
                  ),
                  SizedBox(width: 8),
                  Icon(
                    Icons.navigate_next,
                    color: Colors.white,
                    size: 35,
                  ),
                  SizedBox(
                    width: MediaQuery.of(context).size.height * 0.065,
                  ),
                ],
              ),
            ),
          )
        else
          SizedBox(),
     ],
    );
  }
}
4

1 回答 1

0

您必须以某种方式重建您想要返回的屏幕(或部分屏幕)。这是状态管理解决方案应该到位的地方:)。

创建一个 BLoC 或 a并使用 a或 aValueNotifier重建小部件。如果您想让它变得简单,只需在选项卡屏幕之间的有状态小部件内创建一个共享状态,并在黑色横幅应该出现时调用StreamBuilderValueListenableBuildersetState

于 2021-01-27T15:57:34.630 回答