Home > Enterprise >  What is MaterialStateProperty<OutlinedBorder>
What is MaterialStateProperty<OutlinedBorder>

Time:03-25

How to use the shape in buttonstyle, MaterialStateProperty<OutlinedBorder> shape

it doesn't work for me

CodePudding user response:

Here an example, you can do this to change the shape of ElevatedButton:

ElevatedButton.icon(
          onPressed: () {
            _showCustomerDialog();
          },
          icon: Icon(Icons.person_sharp, color: Colors.black),
          label: Text('Customer 1', style: TextStyle(color: Colors.black)),
          style: ButtonStyle(
            backgroundColor: MaterialStateProperty.all(Color(0xFF10FB06)),
            shape: MaterialStateProperty.all(RoundedRectangleBorder( borderRadius: BorderRadius.circular(40) ))
          ),
        ),

These are the classes of shapes that can be appplied:

  1. BeveledRectangleBorder,
  2. CircleBorder,
  3. ContinuousRectangleBorder,
  4. MaterialStateOutlinedBorder,
  5. RoundedRectangleBorder,
  6. StadiumBorder

All of them are an implementation of OutlinedBorder which is an abstract class, so all of them can apply an especific shape to a button, use either one as you needed.

More info in: https://api.flutter.dev/flutter/painting/OutlinedBorder-class.html

  • Related