Home > Software design >  Return value from widget to parent class
Return value from widget to parent class

Time:11-11

I encounter the following issue. In Body class I have a widget Counter (Counter class) and what I need to do is to get the currentAmount value and return to Body class and then, this value I will use in the AddToCart widget (numOfItems = currentAmount). Do you have any suggestion how I can solve this issue?

Body class:

class Body extends StatelessWidget {
  final Product product;

  const Body({Key? key, required this.product}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return ListView(
      children: [
        ProductImages(product: product),
        TopRoundedContainer(
          color: Colors.white,
          child: Column(
            children: [
              ProductDescription(
                product: product,
                pressOnSeeMore: () {},
              ),
              TopRoundedContainer(
                color: Color(0xFFF6F7F9),
                child: Column(
                  children: [
                    **currentAmount = Counter()**,
                    TopRoundedContainer(
                      color: Colors.white,
                      child: Padding(
                        padding: EdgeInsets.only(
                          left: SizeConfig.screenWidth * 0.15,
                          right: SizeConfig.screenWidth * 0.15,
                          bottom: getProportionateScreenWidth(40),
                          top: getProportionateScreenWidth(15),
                        ),
                        child: AddToCart(product: product, **numOfItems: currentAmount**),
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ],
    );
  }
}

Counter class:

class Counter extends StatefulWidget {
  const Counter({
    Key? key,
  }) : super(key: key);

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

class _CounterState extends State<Counter> {
  int _currentAmount = 0;

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding:
          EdgeInsets.symmetric(horizontal: getProportionateScreenWidth(20)),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          GestureDetector(
            child: Container(
              padding: const EdgeInsets.all(5.0),
              decoration: const BoxDecoration(
                shape: BoxShape.circle,
                color: Colors.white,
              ),
              child: const Icon(
                Icons.remove,
                color: Colors.red,
              ),
            ),
            onTap: () {
              setState(() {
                if (_currentAmount > 0) {
                  _currentAmount -= 1;
                } else {
                  _currentAmount = 0;
                }
              });
            },
          ),
          const SizedBox(width: 10),
          Text(
            "$_currentAmount",
          ),
          const SizedBox(width: 10),
          GestureDetector(
            child: Container(
              padding: const EdgeInsets.all(5.0),
              decoration: const BoxDecoration(
                shape: BoxShape.circle,
                color: Colors.white,
              ),
              child: const Icon(
                Icons.add,
                color: Colors.green,
              ),
            ),
            onTap: () {
              setState(() {
                _currentAmount  = 1;
              });
            },
          ),
        ],
      ),
    );
  }
}

I am open to any suggestions! Thank you!

CodePudding user response:

You can use callback method to get the counter value from Counter widget.

class Counter extends StatefulWidget {
  final Function(int) counterValue ;
  const Counter({
    Key? key,
    required this.counterValue,
  }) : super(key: key);

And when the value changes, call this method like

onTap: () {
   ....
  widget.counterValue(_currentAmount);
},

And the use of Counter

Counter(
counterValue: (counterValue) {
   print(counterValue);
},
),
  • Related