Home > Mobile >  Unable to display the widget parameter when initializing
Unable to display the widget parameter when initializing

Time:12-23

class reusableCard extends StatelessWidget {
  reusableCard({required this.colour, this.cardChild});
  final Color colour;
  final Widget? cardChild;

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: colour,
        borderRadius: BorderRadius.circular(20),
      ),
      margin: EdgeInsets.all(20),
    );
  }
}

i am calling a class named reuseabelCard with two parameter among which one is a of Widget datatype. when calling i am passing a column containing icon and text ,but the the widget is not getting displayed at all.

Expanded(
  child: reusableCard(
    colour: ActiveColourCard,
    cardChild: Column(
      children: [
        Icon(FontAwesomeIcons.mars),
        SizedBox(
          height: 10.0,
        ),
        Text(
          'Male',
          style: TextStyle(
            color: Colors.white,
          ),
        ),
      ],
    ),
  ),
),

I am expecting for the icon and text to be displayed.

CodePudding user response:

you forgot to add cardChild on reusableCard build() method

    return Container(
      decoration: BoxDecoration(
        color: colour,
        borderRadius: BorderRadius.circular(20),
      ),
      margin: EdgeInsets.all(20),
      // add this line
      child: cardChild ?? null,
    );

also, by dart convention, you should name classes with PascalCase (ReusableCard instead of reusableCard)

CodePudding user response:

You are not calling the cardChild in reusableCard widget.

class reusableCard extends StatelessWidget {
  reusableCard({required this.colour, this.cardChild});
  final Color colour;
  final Widget? cardChild;

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: colour,
        borderRadius: BorderRadius.circular(20),
      ),
      margin: EdgeInsets.all(20),
      child: cardChild,
    );
  }
}
  • Related