MouseRegion 위젯에 cursor 속성이 있다.

Widget build(BuildContext context) {
  return Center(
    child: MouseRegion(
      cursor: SystemMouseCursors.text,
      child: Container(
        width: 200,
        height: 100,
        decoration: BoxDecoration(
          color: Colors.blue,
          border: Border.all(color: Colors.yellow),
        ),
      ),
    ),
  );
}

이런 식으로 사용하는 데 여기서 SystemMouseCursors 는 enum 이다.

일단 마우스 커서를 사용한다는 것은 web 또는 desktop 환경일 가능성이 높은데, 이런 환경에서 우리가 접할 수 있었던 기본 포인터 모양들이 정의되어 있다.

화살표, 로딩 등등 사용하는 각 네이티브에 정의된 포인터 모양으로 자동 변환해준다.

만약에 아예 새로운 모양의 커서를 만드려면 어떻게 할까?

우선 플러그인 적인 해법은 fancy_cursor( https://pub.dev/packages/fancy_cursor ) 가 있다.

이 플러그인에서는 Stack과 AnimatedPositioned 를 조합해서 사용했는데 그것이 조금 마음에 들지 않는다면 아래의 StreamBuilder 해법을 생각해보는 것도 괜찮다.