flutter - 不推荐使用 Flutter FlatButton - 替代解决方案

Question

这是我的平面按钮。如何使用 textButton 或提升按钮解决它？

Center(
  child: FlatButton(
    onPressed: () {  },
    child: Container(
      margin:EdgeInsets.only(top: 25),
      child: image != null 
        ? Image.file(image,width:140,height:192,fit:BoxFit.fill) 
        : Container(
          width: 240, 
          height: 200, 
          child: Icon(Icons.camera_front, size: 100, color:Colors.grey,)
        ),
      ),
    ),
),

Answer 1

将 FlatButton 更改为 TextButton。

Center(
  child: TextButton(
    onPressed: () {  },
    child: Container(
      margin:EdgeInsets.only(top: 25),
      child: image != null 
        ? Image.file(image,width:140,height:192,fit:BoxFit.fill) 
        : Container(
          width: 240, 
          height: 200, 
          child: Icon(Icons.camera_front, size: 100, color:Colors.grey,)
        ),
      ),
    ),
),

对于使用 TextButton 的样式，

            TextButton(
              style: TextButton.styleFrom(
                padding: const EdgeInsets.all(16.0),
                primary: Colors.white,
                textStyle: const TextStyle(fontSize: 20),
              ),
              onPressed: () {},
              child: const Text('Gradient'),
            ),

Answer 2

只需更改FlatButton为TextButton或ElevatedButton。

Answer 3

FlatButton 被 TextButton 取代， RaisedButton 被 ElevatedButton 取代。

这是带有样式的 TextButton 的代码

TextButton(
    onPressed: () {  },
    style: ButtonStyle(
      backgroundColor: MaterialStateProperty.all(Colors.deepPurple)
    ),
    child: Container(
      margin:EdgeInsets.only(top: 25),
      child: image != null
          ? Image.file(image,width:140,height:192,fit:BoxFit.fill)
          : Container(
          width: 240,
          height: 200,
          child: Icon(Icons.camera_front, size: 100, color:Colors.grey,)
      ),
    ),
  ),