Flutter: How to use MaterialStateProperty to set ElevatedButton's minimumWidth?

2,761

This MaterialStateProperty is confusing when you want to use it for the first time. If you want to set minimumSize the same for all states possible in MaterialState (hovered, focused, pressed, ...) you can use this:

MaterialStateProperty.all(Size(width, height))

Or if you want to have different minimumSize for different states then this is the way to do it:

MaterialStateProperty.resolveWith((states) {
  if (states.contains(MaterialState.disabled)) {
    return Size(width, height);
  }
  return Size(width, height);
}
Share:
2,761
Sam
Author by

Sam

Updated on December 28, 2022

Comments

  • Sam
    Sam over 1 year

    I've been puzzling on this for a while. I want 2 buttons with different text to be the same width.

    I've achieved this by making ElevatedButton a child of SizedBox, but I'm concerned that the Button title text will be clipped if the users has the default font size set to large.

    I can put a 'minimumSize' on the ElevatedButton's style attribute:

    style: ButtonStyle(minimumSize: ),

    But I don't have a clue how to set the minimumSize, it wants this:

    {MaterialStateProperty minimumSize} Type: MaterialStateProperty The minimum size of the button itself. The size of the rectangle the button lies within may be larger per tapTargetSize

    I can't figure out how to set a MaterialStateProperty, Android Studio complains 'Abstract classes can't be instantiated.' Help!