flutter - 购物车计数器在 flutter 中返回时未更新

Question

我在购物车屏幕上将商品添加到购物车，但是当我返回产品以添加更多产品时，我的底部导航栏上的计数器没有更新，据我所知，事件已经在堆栈中，所以它不刷新，我可以做它在invalidateOptionMenu()函数上的 native android(java)中刷新appbar，但我不知道如何在flutter中做到这一点，这里也是它的底部导航。

我已经在 backpressed functionn 上尝试过这段代码

  Navigator.of(context).push(
            MaterialPageRoute(
              builder: (BuildContext context){
                return MainScreen();
              },
            ),
          );

在 willpopscope 上，
任何帮助将不胜感激。以下是主屏幕

    body: PageView(
      physics: NeverScrollableScrollPhysics(),
      controller: _pageController,
      onPageChanged: onPageChanged,
      children: <Widget>[
        Home(),
        FavoriteScreen(),
        SearchScreen(),
        CartScreen(),
        Profile(),
      ],
    ),

    bottomNavigationBar: BottomAppBar(
      child: new Row(
        mainAxisSize: MainAxisSize.max,
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          SizedBox(width:7),
          IconButton(
            icon: Icon(
              Icons.home,
              size: 24.0,
            ),
            color: _page == 0
                ? Theme.of(context).accentColor
                : Theme
                .of(context)
                .textTheme.caption.color,
            onPressed: ()=>_pageController.jumpToPage(0),
          ),

          IconButton(
            icon:Icon(
              Icons.favorite,
              size: 24.0,
            ),
            color: _page == 1
                ? Theme.of(context).accentColor
                : Theme
                .of(context)
                .textTheme.caption.color,
            onPressed: ()=>_pageController.jumpToPage(1),
          ),

          IconButton(
            icon: Icon(
              Icons.search,
              size: 24.0,
              color: Theme.of(context).primaryColor,
            ),
            color: _page == 2
                ? Theme.of(context).accentColor
                : Theme
                .of(context)
                .textTheme.caption.color,
            onPressed: ()=>_pageController.jumpToPage(2),
          ),

          IconButton(

            icon: IconBadge(

              icon: Icons.shopping_cart,
              size: 24.0,
            ),
            color: _page == 3
                ? Theme.of(context).accentColor
                : Theme
                .of(context)
                .textTheme.caption.color,
            onPressed: ()=>_pageController.jumpToPage(3),
          ),

          IconButton(
            icon: Icon(
              Icons.person,
              size: 24.0,
            ),
            color: _page == 4
                ? Theme.of(context).accentColor
                : Theme
                .of(context)
                .textTheme.caption.color,
            onPressed: ()=>_pageController.jumpToPage(4),
          ),

          SizedBox(width:7),
        ],
      ),
      color: Theme.of(context).primaryColor,
      shape: CircularNotchedRectangle(),
    ),
    floatingActionButtonAnimator: FloatingActionButtonAnimator.scaling,
    floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
    floatingActionButton: FloatingActionButton(
      elevation: 4.0,
      child: Icon(
        Icons.search,
      ),
      onPressed: ()=>_pageController.jumpToPage(2),
    ),

  ),
);

图标徽章

class IconBadge extends StatefulWidget {

  final IconData icon;
  final double size;

  static int counteer;

  IconBadge({Key key, @required this.icon, @required this.size})
      : super(key: key);


  @override
  _IconBadgeState createState() => _IconBadgeState();
}

class _IconBadgeState extends State<IconBadge> {



//List _users;
 static int count ; 
Future countForBadge() async{

var db = new DatabaseHelper();

   count = await db.getCount();
  print("Count: $count");
  //print("khAN NNNN $counteer");
}

@override
  void initState() {
    // TODO: implement initState
    super.initState();
    countForBadge();
  }



  @override
  Widget build(BuildContext context) {

     if (count == null){

    count = 0;
  }

   print("Count lande: $count");
    return Stack(
      children: <Widget>[
        Icon(
          widget.icon,
          size: widget.size,
        ),
        Positioned(
          right: 0.0,
          child: Container(
            padding: EdgeInsets.all(1),
            decoration: BoxDecoration(
              color: Colors.red,
              borderRadius: BorderRadius.circular(6),
            ),
            constraints: BoxConstraints(
              minWidth: 13,
              minHeight: 13,
            ),
            child: Padding(
              padding: EdgeInsets.only(top: 1),
              child:Text(
                "$count",
                style: TextStyle(
                  color: Colors.white,
                  fontSize: 8,
                ),
                textAlign: TextAlign.center,
              ),
            ),
          ),
        ),
      ],
    );
  }
}

Answer 1

我用简单的 Container() 替换了一些屏幕.
如果我理解您的问题，这是使用 VoidCallBack 的解决方案:

主要.dart

import 'package:badges/badges.dart';
import 'package:flutter/material.dart';
import 'package:issue_counter_cart/cart_screen.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _page;
  int _counter = 0;
  PageController _pageController;

  @override
  void initState() {
    super.initState();
    _pageController = PageController();
  }

  @override
  void dispose() {
    _pageController.dispose();
    super.dispose();
  }

  void _increaseCart() {
    setState(() {
      _counter++;
    });
  }

  void _decreaseCart() {
    setState(() {
      _counter--;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: PageView(
        physics: NeverScrollableScrollPhysics(),
        controller: _pageController,
        // onPageChanged: onPageChanged,
        children: <Widget>[
          Container(),
          Container(),
          Container(),
          CartScreen(
            increaseCart: () => _increaseCart(),
            decreaseCart: () => _decreaseCart(),
          ),
          Container(),
        ],
      ),
      bottomNavigationBar: BottomAppBar(
        child: new Row(
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[
            SizedBox(width: 7),
            IconButton(
              icon: Icon(
                Icons.home,
                size: 24.0,
              ),
              color: _page == 0
                  ? Theme.of(context).accentColor
                  : Theme.of(context).textTheme.caption.color,
              onPressed: () => _pageController.jumpToPage(0),
            ),
            IconButton(
              icon: Icon(
                Icons.favorite,
                size: 24.0,
              ),
              color: _page == 1
                  ? Theme.of(context).accentColor
                  : Theme.of(context).textTheme.caption.color,
              onPressed: () => _pageController.jumpToPage(1),
            ),
            IconButton(
              icon: Icon(
                Icons.search,
                size: 24.0,
                color: Theme.of(context).primaryColor,
              ),
              color: _page == 2
                  ? Theme.of(context).accentColor
                  : Theme.of(context).textTheme.caption.color,
              onPressed: () => _pageController.jumpToPage(2),
            ),
            IconButton(
              icon: Badge(
                badgeContent: Text(_counter.toString()),
                child: Icon(Icons.shopping_cart),
              ),
              color: _page == 3
                  ? Theme.of(context).accentColor
                  : Theme.of(context).textTheme.caption.color,
              onPressed: () => _pageController.jumpToPage(3),
            ),
            IconButton(
              icon: Icon(
                Icons.person,
                size: 24.0,
              ),
              color: _page == 4
                  ? Theme.of(context).accentColor
                  : Theme.of(context).textTheme.caption.color,
              onPressed: () => _pageController.jumpToPage(4),
            ),
            SizedBox(width: 7),
          ],
        ),
        color: Theme.of(context).primaryColor,
        shape: CircularNotchedRectangle(),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {},
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}

cart_screen.dart

import 'package:flutter/material.dart';

class CartScreen extends StatefulWidget {
  final VoidCallback increaseCart;
  final VoidCallback decreaseCart;
  CartScreen({this.increaseCart, this.decreaseCart});

  @override
  _CartScreenState createState() => _CartScreenState();
}

class _CartScreenState extends State<CartScreen> {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Center(
        child: Column(
          children: <Widget>[
            RaisedButton(
              onPressed: widget.increaseCart,
              child: Text('Increase cart'),
            ),
            RaisedButton(
              onPressed: widget.decreaseCart,
              child: Text('Decrease cart'),
            ),
          ],
        ),
      ),
    );
  }
}

为了简化代码，我使用了 bagdes package