how to assign height and width of widget child(container) from another custom widget in flutter

Question

I want to change my width and height of container widget which is inside custom widget forProducts and I want to pass that width and height from another custom ProductContainer widget but when I pass it in ProductContainer it gives undefined name height and width.

here is my code for this your help is appreciated, thank you,

 import 'package:myEcomm/screens/info_page.dart'; import 'package:flutter/material.dart'; class ProductContainer extends StatefulWidget { final List products; final double height; final double width; const ProductContainer({ Key key, this.products, this.height, this.width, }): super(key: key); @override _ProductContainerState createState() => _ProductContainerState(); } class _ProductContainerState extends State<ProductContainer> { @override Widget build(BuildContext context) { return SingleChildScrollView( child: Column( mainAxisSize: MainAxisSize.min, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[ SizedBox( height: 150, child: ListView.builder( scrollDirection: Axis.horizontal, itemCount: widget.products.length, itemBuilder: (context, index) { return forProducts( image: widget.products[index]['imageLink'], tag: widget.products[index]['tag'], name: widget.products[index]['name'], category: widget.products[index]["category"], price: widget.products[index]["price"], context: context); }, ), ), ], ), ); } } Widget forProducts( {String image = "images/", @required String tag, @required String name, @required String category, @required String price, @required BuildContext context}) { return Column(children: [ Material( child: Hero( tag: tag, child: GestureDetector( onTap: () { Navigator.push( context, MaterialPageRoute( builder: (context) => InfoPage( image: image, tag: tag, name: name, category: category, price: price, ))); }, child: Container( padding: EdgeInsets.all(2), margin: EdgeInsets.all(5), height: height, // this is the height which I want to assign from productcontainer(height: anyValue) widget width: width, // this is the width which I want to assign from productcontainer(width: anyValue) widget decoration: BoxDecoration( borderRadius: BorderRadius.circular(20), image: DecorationImage( fit: BoxFit.cover, image: AssetImage(image)), ), ), ))), Text(name), ]); }

Answer 1

This worked for me

 import 'package:myEcomm/screens/info_page.dart'; import 'package:flutter/material.dart'; class ProductContainer extends StatefulWidget { final List products; final double height; final double width; const ProductContainer({ Key key, this.products, this.height, this.width, }): super(key: key); @override _ProductContainerState createState() => _ProductContainerState(); } class _ProductContainerState extends State<ProductContainer> { @override Widget build(BuildContext context) { return SingleChildScrollView( child: Column( mainAxisSize: MainAxisSize.min, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[ SizedBox( height: 150, child: ListView.builder( scrollDirection: Axis.horizontal, itemCount: widget.products.length, itemBuilder: (context, index) { return forProducts( height: widget.height, width: widget.width, image: widget.products[index]['imageLink'], tag: widget.products[index]['tag'], name: widget.products[index]['name'], category: widget.products[index]["category"], price: widget.products[index]["price"], context: context); }, ), ), ], ), ); } } Widget forProducts( {String image = "images/", @required String tag, @required String name, @required String category, @required String price, @required double height, @required double width, @required BuildContext context}) { return Column(children: [ Material( child: Hero( tag: tag, child: GestureDetector( onTap: () { Navigator.push( context, MaterialPageRoute( builder: (context) => InfoPage( image: image, tag: tag, name: name, category: category, price: price, ))); }, child: Container( padding: EdgeInsets.all(2), margin: EdgeInsets.all(5), height: height, width: width, decoration: BoxDecoration( borderRadius: BorderRadius.circular(20), image: DecorationImage( fit: BoxFit.cover, image: AssetImage(image)), ), ), ))), Text(name), ]); }