How to specify disabledTextColor when migrating from FlatButton to TextButton

Question

Consider the following code that specifies disabledTextColor for a FlatButton:

FlatButton.icon(
  icon: const Icon(Icons.check_box),
  label: const Text('Foo'),
  disabledTextColor: Colors.black,
  onPressed: null,
),

How can I translate the disabledTextColor to the equivalent for TextButton?

I figure I need to override style, but I can't seem to get TextButton.styleFrom to work, and Theme.of(context).textButtonTheme.style is null.

Answer 1

The following are equivalent:

            FlatButton.icon(
              icon: const Icon(Icons.check_box),
              label: const Text('FlatButton'),
              disabledTextColor: Colors.black,
              onPressed: null,
            ),
            TextButton.icon(
              icon: const Icon(Icons.check_box),
              label: const Text('TextButton'),
              style: ButtonStyle(
                foregroundColor: MaterialStateProperty.all(Colors.black),
              ),
              onPressed: null,
            ),

In this case, since onPressed is null, the button will always be disabled, so the foregroundColor can simply be black in all cases. However, if you have a different scenario, the style can do something like:

style: ButtonStyle(
    foregroundColor: MaterialStateProperty.resolveWith<Color>(
      (Set<MaterialState> states) => states.contains(MaterialState.disabled) ? Colors.black : null,
    ),
  ),

Migrating to the New Material Buttons and their Themes - Migrating buttons with custom disabled colors provides more details.