0

是否可以在不使用 MouseRegion 的情况下更改 Windows 和 Web 应用程序中光标的外观？我目前有一个自定义小部件，它使用 CustomPainter 在画布上绘制多个形状，并使用 MouseRegion 我正在监听鼠标事件（进入/退出）以确定鼠标悬停在哪些形状上。我的问题是，如果我使用鼠标区域来包装 CustomPainter，即使用户不在画布上的形状上而是悬停在形状之间的空间中，它也会更改光标。

有没有一种方法可以明确告诉颤振在我需要时将光标更改为某些东西，例如Mouse.of(context) = SystemMouseCursor.text？

4

2 回答 2

2

您可以尝试这样的事情，您只需将整个视图包装在 MouseRegion 中，然后使用 setState 更改光标：

import 'package:flutter/material.dart';
import 'package:flutter/services.dart'; // <----

class Home extends StatefulWidget {
  const Home({Key? key}) : super(key: key);

  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {

  SystemMouseCursor cursor = SystemMouseCursors.zoomIn; // <----

  @override
  Widget build(BuildContext context) {
    return MouseRegion( // <----
        cursor: cursor, // <----
        child: Scaffold(
          body: Center(
            child: TextButton(onPressed: () {
              cursor = SystemMouseCursors.grab; // <----
              setState(() {});                  // <----
            }, child: const Text("Change Cursor")),
          ),
        ),
      );
  }
}

希望能帮助到你

于 2022-02-12T18:32:18.370 回答
0

该Stack小部件可以帮助您。它可以和未对齐的孩子一样大，因此如果您不希望整个形状在其中，例如，您可以使用堆栈并用鼠标区域填充边框（例如正方形）：

Stack(
  children: [
    const SizedBox.square(dimension: 50), //Unpositioned child
    
    //Four sides
    Positioned(
      left: 0,
      top: 3,
      bottom: 3,
      child: GestureDetector(
        onScaleUpdate: (details) => debugPrint(details.toString()),
        child: const MouseRegion(
          cursor: SystemMouseCursors.resizeLeftRight,
          child: SizedBox(width: 3),
        ),
      ),
    ),
    Positioned(
      right: 0,
      top: 3,
      bottom: 3,
      child: GestureDetector(
        onScaleUpdate: (details) => debugPrint(details.toString()),
        child: const MouseRegion(
          cursor: SystemMouseCursors.resizeLeftRight,
          child: SizedBox(width: 3),
        ),
      ),
    ),
    Positioned(
      top: 0,
      right: 3,
      left: 3,
      child: GestureDetector(
        onScaleUpdate: (details) => debugPrint(details.toString()),
        child: const MouseRegion(
          cursor: SystemMouseCursors.resizeUpDown,
          child: SizedBox(height: 3),
        ),
      ),
    ),
    Positioned(
      bottom: 0,
      right: 3,
      left: 3,
      child: GestureDetector(
        onScaleUpdate: (details) => debugPrint(details.toString()),
        child: const MouseRegion(
          cursor: SystemMouseCursors.resizeUpDown,
          child: SizedBox(height: 3),
        ),
      ),
    ),

    //Four corners
    Positioned(
      left: 0,
      top: 0,
      child: GestureDetector(
        onScaleUpdate: (details) => debugPrint(details.toString()),
        child: const MouseRegion(
          cursor: SystemMouseCursors.resizeUpLeft,
          child: SizedBox.square(dimension: 3),
        ),
      ),
    ),
    Positioned(
      right: 0,
      top: 0,
      child: GestureDetector(
        onScaleUpdate: (details) => debugPrint(details.toString()),
        child: const MouseRegion(
          cursor: SystemMouseCursors.resizeUpRight,
          child: SizedBox.square(dimension: 3),
        ),
      ),
    ),
    Positioned(
      bottom: 0,
      left: 0,
      child: GestureDetector(
        onScaleUpdate: (details) => debugPrint(details.toString()),
        child: const MouseRegion(
          cursor: SystemMouseCursors.resizeDownLeft,
          child: SizedBox.square(dimension: 3),
        ),
      ),
    ),
    Positioned(
      bottom: 0,
      right: 0,
      child: GestureDetector(
        onScaleUpdate: (details) => debugPrint(details.toString()),
        child: const MouseRegion(
          cursor: SystemMouseCursors.resizeDownRight,
          child: SizedBox.square(dimension: 3),
        ),
      ),
    ),
  ],
)
于 2022-02-14T10:54:52.937 回答