【dart】ElevatedButton.styleFrom()でボタン背景色を白にするには

backgroundにwhiteを指定するだけだと白背景にならない

ElevatedButton(
  onPressed: () {},
  style: ElevatedButton.styleFrom(
    foregroundColor: Colors.black,
    backgroundColor: Colors.white,
  ),
  child: const Text('whiteButton'),
)

上のコードをビルドすると下のような感じになる。若干ピンク？

純白にしたい

styleFromの仮引数

static ButtonStyle styleFrom({
    Color? foregroundColor,
    Color? backgroundColor,
    Color? disabledForegroundColor,
    Color? disabledBackgroundColor,
    Color? shadowColor,
    Color? surfaceTintColor,
    double? elevation,
    TextStyle? textStyle,
    EdgeInsetsGeometry? padding,
    Size? minimumSize,
    Size? fixedSize,
    Size? maximumSize,
    BorderSide? side,
    OutlinedBorder? shape,
    MouseCursor? enabledMouseCursor,
    MouseCursor? disabledMouseCursor,
    VisualDensity? visualDensity,
    MaterialTapTargetSize? tapTargetSize,
    Duration? animationDuration,
    bool? enableFeedback,
    AlignmentGeometry? alignment,
    InteractiveInkFeatureFactory? splashFactory,
    @Deprecated(
      'Use backgroundColor instead. '
      'This feature was deprecated after v3.1.0.'
    )
    Color? primary,
    @Deprecated(
      'Use foregroundColor instead. '
      'This feature was deprecated after v3.1.0.'
    )
    Color? onPrimary,
    @Deprecated(
      'Use disabledForegroundColor and disabledBackgroundColor instead. '
      'This feature was deprecated after v3.1.0.'
    )
    Color? onSurface,
  })

surfaceTintColorが怪しそうな名前をしているので白にしてみる

ElevatedButton(
  onPressed: () {},
  style: ElevatedButton.styleFrom(
    foregroundColor: Colors.black,
    backgroundColor: Colors.white,
    surfaceTintColor: Colors.white,
  ),
  child: const Text('whiteButton'),
)

するとこうなった。

真っ白！めでたし。
こんなに純白が似合うのはナミさんか米くらいだ。

教訓

AndroidStudioのFindUsage便利。

深夜で眠くて雑な記事ですみません。