import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: 'Flutter Demo',
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);
  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  List<String> buttonText = ['Button', 'Button', 'Button', 'Button', 'Button', 'Button'];

  static ButtonStyle getButtonStyle(
      {Color? hoverColor, Color? pressedColor, Color? focusColor, Color? disableColor, Color? normalColor}) {
    return ButtonStyle(
      backgroundColor: MaterialStateProperty.resolveWith((states) {
        if (pressedColor != null && states.contains(MaterialState.pressed)) {
          return pressedColor;
        }
        if (hoverColor != null && states.contains(MaterialState.hovered)) {
          return hoverColor;
        }
        if (focusColor != null && states.contains(MaterialState.focused)) {
          return focusColor;
        }
        if (disableColor != null && states.contains(MaterialState.disabled)) {
          return disableColor;
        }
        //默认不使用背景颜色
        return normalColor;
      }),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          children: [
            for (int i = 0; i < buttonText.length; i++)
              Padding(
                padding: const EdgeInsets.only(bottom: 5, top: 5),
                child: TextButton(
                  onHover: (bool isHover) {
                    if (isHover) {
                      buttonText[i] = 'hover';
                      setState(() {});
                    } else {
                      buttonText[i] = 'Button';
                    }
                  },
                  onFocusChange: (bool isFocus) {
                    if (isFocus) {
                      buttonText[i] = 'focus';
                      setState(() {});
                    } else {
                      buttonText[i] = 'Button';
                    }
                  },
                  onPressed: () {},
                  style: getButtonStyle(
                      normalColor: Colors.blue,
                      pressedColor: Colors.red,
                      hoverColor: Colors.green,
                      focusColor: Colors.orange),
                  child: SizedBox(
                    width: 200,
                    height: 60,
                    child: Center(
                      child: Text(
                        '${buttonText[i]}:$i',
                        style: const TextStyle(color: Colors.black, fontSize: 14),
                      ),
                    ),
                  ),
                ),
              ),
          ],
        ),
      ),
    );
  }
}