Buttons

Buttons are components that can be clicked

There are different types of buttons:

Contained button

They display contained text

ElevatedButton(
  onPressed: () {
      // Respond to button press
  },
  child: Text('CONTAINED BUTTON'),
)

Also, you can add an Icon

ElevatedButton.icon(
  onPressed: () {
      // Respond to button press
  },
  icon: Icon(Icons.add, size: 18),
  label: Text("CONTAINED BUTTON"),
)

Text button

They only displays text

TextButton(
  onPressed: () {
      // Respond to button press
  },
  child: Text("TEXT BUTTON"),
)

Also, you can add an Icon

TextButton.icon(
  onPressed: () {
      // Respond to button press
  },
  icon: Icon(Icons.add, size: 18),
  label: Text("TEXT BUTTON"),
)

RawMaterialButton

RawMaterialButton(
          // We set the shape to a rounded rectangle
          shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(100.0)),
          // Set the fill color
          fillColor: Colors.white,
          // Create a SizedBox for the dimensions
          child: const SizedBox(
            height: 50,
            width: 200.0,
            // Center everything
            child: Center(
              // Create the button's text
              child: Text(
                'Crear cuenta 🎉',
                // Set the text color
                style: TextStyle(color: Colors.black),
              ),
            ),
          ),
          onPressed: () {
            // Button action
          },
        ),

https://material.io/components/buttons/flutter#toggle-button 👈 more button info

Last updated