Flutter Buttons

ElevatedButton

ElevatedButton(
  onPressed: () {},
  child: Text('Button'),
  style: ElevatedButton.styleFrom(shape: StadiumBorder()),
)

shape types: RoundedRectangleBorder / StadiumBorder / CircleBorder / BeveledRectangleBorder

OutlinedButton

OutlinedButton(
    onPressed: () {},
    child: Text('Button'),
    style: OutlinedButton.styleFrom(
        shape: StadiumBorder(),
    ),
)

TextButton:

  • You can always use TextButton if you don't want an outline or color fill.
  • Don't forget, there's also an .icon constructor to add an icon easily:
ElevatedButton.icon(
  icon: Icon(Icons.thumb_up),
  label: Text("Like"),
  onPressed: () => print("it's pressed"),
  style: ElevatedButton.styleFrom(
      shape: RoundedRectangleBorder(
      borderRadius: BorderRadius.circular(32.0),
      ),
  ),
)

Comments !

Links

Social