I'm a student new to flutter. I have created two buttons in one row. but it gives me an error like the picture shows. what should I do to the error? are there any wrong coding ?? how to correct this code. i keep space between buttons using a size box.

//button 1
Widget lbsButton() => Container(
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          SizedBox(
            width: 80,
            height:50,
            child: ElevatedButton(
              onPressed: () {},
              child: Text('lbs'),
              style: ButtonStyle(

                backgroundColor: MaterialStateProperty.all<Color>(mainPurpleText),

                shape: MaterialStateProperty.all<RoundedRectangleBorder>(
                  RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(20.0),
              ),

            ),
          ),
                SizedBox(
            width: 10,
          ),

//button 2
             SizedBox(
            width: 80,
            height:50,
                    child: new ElevatedButton(
              onPressed: () {},
              child: Text('kg' , style:TextStyle(color:Colors.grey,fontSize:13),
              ),
              style: ButtonStyle(
                backgroundColor: MaterialStateProperty.all<Color>( Colors.white),


                shape: MaterialStateProperty.all<RoundedRectangleBorder>(
                  RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(20.0),
              ),
            ),
          ),

        ],

      ),
    );

CodePudding user response：

Here you go. You seem to have missed a couple of closing parenthesis to close the SizedBox.

Widget lbsButton() => Row(
  mainAxisAlignment: MainAxisAlignment.center,
  children: [
    SizedBox(
      width: 80,
      height: 50,
      child: ElevatedButton(
        onPressed: () {},
        child: Text('lbs'),
        style: ButtonStyle(
          backgroundColor:
              MaterialStateProperty.all<Color>(mainPurpleText),
          shape: MaterialStateProperty.all<RoundedRectangleBorder>(
            RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(20.0),
            ),
          ),
        ),
      ),
    ),
    const SizedBox(
      width: 10,
    ),

//button 2
    SizedBox(
      width: 80,
      height: 50,
      child: ElevatedButton(
        onPressed: () {},
        child: Text(
          'kg',
          style: TextStyle(color: Colors.grey, fontSize: 13),
        ),
        style: ButtonStyle(
          backgroundColor: MaterialStateProperty.all<Color>(Colors.white),
          shape: MaterialStateProperty.all<RoundedRectangleBorder>(
            RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(20.0),
            ),
          ),
        ),
      ),
    ),
  ],
);

CodePudding user response：

Here:

 Widget lbsButton() => Container(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            SizedBox(
              width: 80,
              height: 50,
              child: ElevatedButton(
                onPressed: () {},
                child: Text('lbs'),
                style: ButtonStyle(
                  backgroundColor:
                      MaterialStateProperty.all<Color>(mainPurpleText),
                  shape: MaterialStateProperty.all<RoundedRectangleBorder>(
                    RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(20.0)),
                  ),
                ),
              ),
            ),
            SizedBox(width: 10),
            SizedBox(
              width: 80,
              height: 50,
              child: new ElevatedButton(
                onPressed: () {},
                child: Text(
                  'kg',
                  style: TextStyle(color: Colors.grey, fontSize: 13),
                ),
                style: ButtonStyle(
                  backgroundColor:
                      MaterialStateProperty.all<Color>(Colors.white),
                  shape: MaterialStateProperty.all<RoundedRectangleBorder>(
                    RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(20.0),
                    ),
                  ),
                ),
              ),
            )
          ],
        ),
      );

CodePudding user response：

  Widget lbsButton() => Row(
  mainAxisAlignment: MainAxisAlignment.center,
  children: [
    SizedBox(
      width: 80,
      height: 50,
      child: ElevatedButton(
        onPressed: () {},
        child: Text('lbs'),
        style: ButtonStyle(
          backgroundColor:
              MaterialStateProperty.all<Color>(mainPurpleText),
          shape: MaterialStateProperty.all<RoundedRectangleBorder>(
            RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(20.0),
            ),
          ),
        ),
      ),
    ),
    const SizedBox(
      width: 10,
    ),

//button 2
    SizedBox(
      width: 80,
      height: 50,
      child: ElevatedButton(
        onPressed: () {},
        child: Text(
          'kg',
          style: TextStyle(color: Colors.grey, fontSize: 13),
        ),
        style: ButtonStyle(
          backgroundColor: MaterialStateProperty.all<Color>(Colors.white),
          shape: MaterialStateProperty.all<RoundedRectangleBorder>(
            RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(20.0),
            ),
          ),
        ),
      ),
    ),
  ],
);