Flutter– 手势 - 芒果文档

📌 相关文章

📜 Flutter– 手势

📅 最后修改于: 2021-09-02 05:29:36 🧑 作者: Mango

手势用于与应用程序交互。它通常用于基于触摸的设备以与应用程序进行物理交互。它可以像在屏幕上单击一样简单，也可以是更复杂的物理交互，例如向特定方向滑动以向下滚动应用程序。它在游戏中被大量使用，随着设备变得比以往更加基于触摸，每个应用程序或多或少都需要它来函数。在本文中，我们将详细讨论它们。

这里提到了一些广泛使用的手势：

点击：用指尖触摸设备表面一小段时间，最后松开指尖。
双击：在短时间内点击两次。
拖动：用指尖触摸设备表面，然后平稳移动指尖，最后松开指尖。
轻弹：类似于拖动，但速度更快。
捏：用两根手指捏住设备表面。
缩放：与捏相反。
平移：用指尖触摸设备表面并在不松开指尖的情况下沿所需方向移动它。

在flutterGestureDetector小部件用于检测与在UI上应用物理相互作用。如果小部件应该体验手势，则它会保存在 GestureDetector 小部件中。同一个小部件捕捉手势并返回适当的动作或响应。

以下是手势及其相应事件的列表：

轻敲

点按
点按
点按
点击取消

双击

双击

长按

长按

垂直拖动

onVerticalDragStart
onVerticalDragUpdate
垂直拖拽结束

水平拖动

onHorizontalDragStart
onHorizontalDragUpdate
onHorizontalDragEnd

平底锅

启动时
更新
盘端

例子：

Dart

import 'package:flutter/material.dart';
  
void main() => runApp(MyApp());
  
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final title = 'Gestures';
  
    return MaterialApp(
      title: title,
      home: MyHomePage(title: title),
    );
  }
}
  
class MyHomePage extends StatelessWidget {
  final String title;
  
  MyHomePage({Key key, this.title}) : super(key: key);
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('GeeksForGeeks'),
        backgroundColor: Colors.green,
      ),
      body: Center(child: MyButton()),
    );
  }
}
  
class MyButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // The GestureDetector wraps the button.
    return GestureDetector(
      // show snackbar on tap of child
      onTap: () {
        final snackBar = SnackBar(content: Text(" You just Tapped on the Button"));
  
        Scaffold.of(context).showSnackBar(snackBar);
      },
      // The tap button
      child: Container(
        padding: EdgeInsets.all(12.0),
        decoration: BoxDecoration(
          color: Theme.of(context).buttonColor,
          borderRadius: BorderRadius.circular(8.0),
        ),
        child: Text('Tap Button'),
      ),
    );
  }
}

输出：

Flutter支持作为低级手势检测机制的 Listener 小部件。它检测用户交互并调度以下提到的相应事件之一：

指针向下事件
指针移动事件
指针向上事件
指针取消事件

Flutter还具有用于执行特定和高级手势的小部件。这些小部件如下：

Dismissible：支持轻击手势来终止小部件。
Draggable：支持拖动手势使小部件移动。
LongPressDraggable：如果父widget可拖动，则支持拖动手势移动子widget。
DragTarget：接受任何 Draggable 小部件
IgnorePointer：使用时，它会在手势检测过程中隐藏小部件及其相应的子部件。
AbsorbPointer：停止手势检测过程本身以避免对重叠小部件的动作分派。
可滚动：使小部件内的内容可滚动。

想要一个更快节奏和更具竞争力的环境来学习 Android 的基础知识吗?