Home > Enterprise >  How can I know whether Finger has entered a Widget or not while sliding over Screen in Flutter
How can I know whether Finger has entered a Widget or not while sliding over Screen in Flutter

Time:12-05

I want to get a true while finger in randomly sliding over the screen and enters a particular widget and false if finger gets out of that widget.

CodePudding user response:

There are no mouse devices on mobile, so users don't have the luxury of using hover effects. Using a hover effect on mobile apps causes buttons to stay stuck in the hovered state when tapped. This stickiness not only confuses users, but it frustrates them when they're forced to double-tap buttons to initiate an action. The alternative is the Inkwell widget which will show a splash when the user will enter said widget.

Hope this helps.

CodePudding user response:

This behavior can be achieved using the Draggable and DragTarget widgets:

refer to those topics:

Drag a UI element

Draggable Widget

DragTarget Widget

CodePudding user response:

To determine whether a finger is currently inside a particular widget in Flutter, you can use the GestureDetector widget's onTapDown and onTapUp callbacks. The onTapDown callback will be triggered whenever a finger comes into contact with the screen, while the onTapUp callback will be triggered when the finger is lifted off the screen.

Here's an example of how you could use these callbacks to determine whether a finger is currently inside a particular widget:

bool isInsideWidget = false;

GestureDetector(
  onTapDown: (details) {
    // Check if the tap down event occurred within the bounds of the widget
    if (widget.contains(details.globalPosition)) {
      isInsideWidget = true;
    }
  },
  onTapUp: (details) {
    // Check if the tap up event occurred within the bounds of the widget
    if (widget.contains(details.globalPosition)) {
      isInsideWidget = false;
    }
  },
  child: Container(
    // The widget that will be tracked for taps
  ),
)

In this example, the isInsideWidget variable will be set to true whenever a finger comes into contact with the widget and false when the finger is lifted off the widget. You can use this information to perform some action, such as changing the color of the widget or triggering some other event.

  • Related