'How do I update since flatbutton is deprecated

height: MediaQuery.of(context).size.height \* 0.1 \* buttonHeight,

color: buttonColor,

**child: FlatButton(**

shape: RoundedRectangleBorder(

borderRadius: BorderRadius.circular(0.0),

side: BorderSide(

color: Colors.black12,

width: 1,

style: BorderStyle.solid)),

padding: EdgeInsets.all(16.0),

onPressed: () =\> buttonPressed(buttonText),

child: Text(
buttonText,

style: TextStyle(
fontSize: 30.0,

fontWeight: FontWeight.bold,

color: Colors.black
),
)
),

Im trying to update from flatbutton to textbutton, but it lead to other error



Solution 1:[1]

After Flutter update some of Widgets are Deprecated.

You Used TextButton instead of FlatButton, FlatButton is deprecated by flutter.

Refer Documentation here for changing the buttons

Your Code:

 TextButton(
        style: TextButton.styleFrom(
          side: BorderSide(
            color: Colors.black38,
          ),
        ),
        onPressed: () {
          //write onPressed function here
          print('Button Pressed');
        },
        child: Text('Pressed Me'),
      ),

Your result screen-> image

Solution 2:[2]

In TextButton, all your style should be inside the "style: ButtonStyle" like this:

TextButton(
style: ButtonStyle(
  shape: MaterialStateProperty.all(
    RoundedRectangleBorder(
      side: const BorderSide(
        color: Colors.black12,
        width: 2,
        style: BorderStyle.solid,
      ),
      borderRadius: BorderRadius.circular(0.0),
    ),
  ),
),
child: Text(
  "CLICK ME!",
  style: const TextStyle(
    fontSize: 30.0,
    fontWeight: FontWeight.bold,
    color: Colors.black,
  ),
),
onPressed: () {
  debugPrint("Click Button pressed");
},
),

Screenshot here

Solution 3:[3]

IT WORKS! I DID IT like this

height: MediaQuery.of(context).size.height * 0.1 * buttonHeight,

  color: buttonColor,
  child: TextButton(
    style: TextButton.styleFrom( 
      padding: EdgeInsets.all(16),
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(0),
        side: BorderSide(
          color: Colors.black12,
              width: 1,
              style: BorderStyle.solid
        ),
    ),
      ),
      onPressed: () => buttonPressed(buttonText),
      child: Text(
        buttonText,
        style: TextStyle(
            fontSize: 30.0,
            fontWeight: FontWeight.bold,
            color: Colors.black
        ),
      )
  ),

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Ravindra S. Patil
Solution 2
Solution 3 rider2501