Flutter:如何響應觸摸事件

目錄傳送門：《Flutter快速上手指南》先導篇

除了 GestureDetector，Flutter 還提供了 Listener 來監聽觸摸事件。

它也是一個 Widget，使用它包裹一個 Widget，就能可以處理該 Widget 上發生的觸摸事件。

1. Listener 的經常使用屬性

看看經過 Listener 能夠處理哪些事件：

屬性	類型	說明
onPointerDown	(PointerDownEvent event){}	按下時觸發
onPointerMove	(PointerDownEvent event){}	移動時觸發
onPointerEnter	(PointerDownEvent event){}	進入Widget區域時觸發
onPointerExit	(PointerDownEvent event){}	離開Widget區域時觸發
onPointerUp	(PointerDownEvent event){}	離開屏幕時觸發
onPointerDown	(PointerDownEvent event){}	按下時觸發
onPointerCancel	(PointerDownEvent event){}	取消觸摸時觸發
behavior	HitTestBehavior	控制事件傳遞。這個下面再說明

1.1 Listener 的使用

先看看例子🌰：

Listener(
  onPointerUp: (e){
    Navigator.pop(context);
  },
  child: Container(
    height: 80,
    color: Colors.blue,
    alignment: Alignment.center,
    child: Text(
      text,
      style: TextStyle(
          color: Colors.white, decoration: TextDecoration.none),
    ),
  ),
)
複製代碼

仍是那套用法，使用它去包裹要處理事件的 Widget 節點，就至關於使節點得到處理事件的能力。

1.2 HitTestBehavior

HitTestBehavior 用於控制事件的傳遞方式。

• HitTestBehavior.deferToChild

  只有有子 Widget 經過了 Hit-Test，才接收一系列的事件，接收區域也會被限制在該子 Widget 區域中。

• HitTestBehavior.opaque

  Widget 可以經過 Hit-Test，接收事件，且能阻止在它以前的 Widget（直觀來看就是被它擋住的 Widget）接收事件。

  簡單來講就是事件 不能透傳。

• HitTestBehavior.translucent

  Widget 可以經過 Hit-Test，接收事件，且不會阻止它以前的 Widget（直觀來看就是被它擋住的 Widget）接收事件。

  簡單來講就是事件 能透傳。

1.3 PointerEvent

PointerEvent 是 Listener 回調中的參數，儲存了一系列的觸摸信息。

看看一些比較經常使用的屬性：

屬性	類型	說明
pointer	int	標示一次觸摸id。從新觸摸會分配新的值
kind	PointerDeviceKind	觸摸事件的輸入類型。是觸摸，仍是鼠標..
position	Offset	當前座標。相對於全局座標
delta	Offset	指針移動期間，與上一次事件的移動距離
pressure	double	按壓力度。取值範圍 0.0-1.0

2.不接收觸摸事件 - IgnorePointer

若是不想讓一個 Widget 接收觸摸事件，那就用 IgnorePointer 包裹它好了。

IgnorePointer(
   ignoring: true,
   child: MyWidget(),
)
複製代碼

使用比較簡單，ignoring 控制是否忽略，默認爲 true。

目錄傳送門：《Flutter快速上手指南》先導篇

如何找到我？

傳送門：CoorChice 的主頁

傳送門：CoorChice 的 Github