'flutter web cursor not changing immediately

I am trying to change the cursor when I hover or click some button but it only change if I refresh the page it's very weird I found the same problem with this website https://flutteranimations.netlify.app/#/

I use MouseRegion Widget wrap with an entire body but not working I also create a stateless class for the button and wrap it with MouseRegion same problem nothing works unless I right-click the button and popup the menu it changes

this is the code I use

class DesktopPage extends HookWidget {
  DesktopPage({Key? key}) : super(key: key);

  String logo = "images/logo.png";
  String trash = "images/trash.png";
  String file = "images/file.png";
  String cepc = "images/cepc.png";
  String doc = "images/doc.png";

  DateTime now = DateTime.now();

  @override
  Widget build(BuildContext context) {
    var isHover = useState<bool>(false);

    return Scaffold(
        backgroundColor: Color(0xff008282),
        bottomNavigationBar: Container(
          decoration: BoxDecoration(color: const Color(0xffC0C0C0), boxShadow: [
            BoxShadow(
                color: Color.fromARGB(255, 255, 255, 255),
                offset: Offset(-1.5, -1.5)),
          ]),
          height: 40,
          child:
              Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
            Win95Button(
                hr: 2,
                vr: 1,
                image: logo,
                text: "Start",
                onTap: () {
                  print('Start');
                }),
            Padding(
              padding: EdgeInsets.only(right: 10, top: 6, bottom: 0.0),
              child: Container(
                width: 100,
                height: 40,
                decoration: BoxDecoration(
                    color: Color.fromARGB(255, 191, 191, 191),
                    boxShadow: [
                      BoxShadow(
                          color: Color.fromARGB(255, 147, 147, 147),
                          offset: Offset(-1.6, -1.6)),
                      BoxShadow(
                          color: Color.fromARGB(255, 255, 255, 255),
                          offset: Offset(1.5, 1.5)),
                    ]),
                child: Center(
                  child: Text(
                    '${DateFormat('jm').format(now)} ',
                    style: TextStyle(
                      color: Colors.black,
                      fontSize: 18.0,
                      fontFamily: 'WinLevi',
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                ),
              ),
            ),
          ]),
        ),
        body: MouseRegion(
          cursor: isHover.value
              ? SystemMouseCursors.click
              : SystemMouseCursors.basic,
          onHover: (h) {
            isHover.value = true;
            print(isHover.value);
          },
          onExit: (e) {
            isHover.value = false;
            print(isHover.value);
          },
          child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: [
              appIconsBtn(image: file, title: 'My Files'),
              appIconsBtn(image: doc, title: 'My CV'),
              appIconsBtn(image: cepc, title: 'My Computer'),
              appIconsBtn(image: trash, title: 'Recycle Bin'),
            ],
          ),
        ));
  }
}



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source