天天看點

Hammer.js分析(四)——recognizer.js一、繼承關系二、識别器狀态三、Recognizer父類中的抽象方法四、Recognizer父類中的方法

不同識别器會使用不同邏輯,根據從相關Input類擷取到的事件對象和事件,實作自定義的觸屏事件,例如tap、pinch等。

Hammer.js分析(四)——recognizer.js一、繼承關系二、識别器狀态三、Recognizer父類中的抽象方法四、Recognizer父類中的方法

Recognizer與前面的Input一樣,也相當于是個抽象類。

從上圖中可以看到,6個子類都會先繼承AttrRecognizer類,因為AttrRecognizer類中的2個方法可以共用,attrTest與process,如果自己不實作,就可以直接調用。

每個識别器的初始狀态是 “POSSIBLE”,每個識别器都會有一個狀态周期。

例如做一次 “tap” 操作,浏覽器使用了touch相關操作模拟: touchstart -> touchend,而狀态是從 STATE_FAILED -> STATE_ENDED。

6種操作的狀态走向圖如下:

Hammer.js分析(四)——recognizer.js一、繼承關系二、識别器狀态三、Recognizer父類中的抽象方法四、Recognizer父類中的方法

在 manage.js 中recognize方法,就是在根據識别器狀态,來給 “curRecognizer” 與 “session.curRecognizer” 指派,緩存這個目前周期内的狀态。

如果識别器的狀态是FAILED, CANCELLED 或者 RECOGNIZED (等同于 ENDED),那就要重置為 POSSIBLE,或結束目前識别器周期,讓下一個識别器來。

下面的1,2,4,8等這樣取值是為了友善位運算。

1. process(inputData)

傳回識别器的狀态,各個子類的實作邏輯都會不同,如果沒有實作,就會引用通用父類AttrRecognizer中的process。

2. getTouchAction()

擷取“touch-action”的屬性數組

3. reset()

隻有 tap.js 與 press.js實作了這個方法

1)recognizeWith(otherRecognizer)  和 dropRecognizeWith(otherRecognizer)

dropRecognizeWith:就是解除這層關系。

上面的代碼中 recognizeWith 在内部會調用三次,下面的第17行代碼,促使這個方法調用3次。

manager.js中recognize方法内調用了個 canRecognizeWith 的方法,裡面其實就是在根據識别器的ID判斷是否存在。

2)requireFailure(otherRecognizer)  和 dropRequireFailure(otherRecognizer)

dropRequireFailure:解除這層關系。

這個 requireFail 數組在 Recognizer.canEmit 方法中會被調用,傳回一個boolean值,用于在 Recognizer.tryEmit 是否能執行子類中的 emit 方法。

demo源碼下載下傳:

<a href="http://download.csdn.net/download/loneleaf1/9429375" target="_blank">http://download.csdn.net/download/loneleaf1/9429375</a>

參考資料:

FIVE THINGS YOU NEED TO KNOW ABOUT HAMMER.JS 2.0

    本文轉自 咖啡機(K.F.J)   部落格園部落格,原文連結:http://www.cnblogs.com/strick/p/5185077.html,如需轉載請自行聯系原作者

繼續閱讀