觸屏的觸發事件

2022-09-01 12:33:12 字數 2395 閱讀 7458

,事件可以執行,但是在安卓----我的是4.2 版本,同事的是winphone8----手機上面這個事件卻都不執行---(我們團隊在最後還是選擇click事件執行,雖然它執行很慢,)所以我蒐羅了一下觸控手機的觸控事件及手勢事件,以下為**資料,先儲備下來吧,當然,手勢事件我還沒有使用過,下面的**是從**上查詢的資料,。

/*觸控事件*/

1、touch事件簡介

pc上的web頁面鼠

標會產生onmousedown、onmouseup、onmouseout、onmouseover、onmousemove的事件,但是在移動終端如

iphone、ipod

touch、ipad上的web頁面觸屏時會產生

ontouchstart、ontouchmove、ontouchend、ontouchcancel

事件,分別對應了觸屏開始、拖拽及完成觸屏事件和取消。

當按下手指時,觸發ontouchstart;

當移動手指時,觸發ontouchmove;

當移走手指時,觸發ontouchend。

當一些更高階別的事件發生的時候(如**接入或者彈出資訊)會取消當前的touch操作,即觸發ontouchcancel。一般會在ontouchcancel時暫停遊戲、存檔等操作。

2、touch事件與mouse事件的出發關係

在觸屏操作後,手指提起的一剎那(即發生ontouchend後),系統會判斷接收到事件的element的內容是否被改變,如果內容被改變,接下來的事

件都不會觸發,如果沒有改變,會按照mousedown,mouseup,click的順序觸發事件。特別需要提到的是,只有再觸發乙個觸屏事件時,才會 觸發上乙個事件的mouseout事件。

client / clienty:// 觸控點相對於瀏覽器視窗viewport的位置

pagex / pagey:// 觸控點相對於頁面的位置

screenx /screeny:// 觸控點相對於螢幕的位置

identifier:>// touch物件的unique id

每個touch物件包含的屬性。

clientx:觸控目標在視口中的x座標。

clienty:觸控目標在視口中的y座標。

identifier:表示觸控的唯一id。

pagex:觸控目標在頁面中的x座標。

pagey:觸控目標在頁面中的y座標。

screenx:觸控目標在螢幕中的x座標。

screeny:觸控目標在螢幕中的y座標。

target:觸控的dom節點座標。

示例**

-->

/*手勢事件*/

3、gesture事件簡介

gesture事件,包括手指點選(click),輕拂

(flick),雙擊(double-click),手指的分開、閉合(scale)、轉動(rotate)等一切手指能在螢幕上做的事情,它只在有兩根

或多根手指放在螢幕上的時候觸發,事件處理函式中會得到乙個gestureevent型別的引數,它包含了手指的scale(兩根移動過程中分開的比例)

資訊和rotation(兩根手指間連線轉動的角度)資訊。這個事件是對touch事件的更高層的封裝,和touch一樣,它同樣包括

gesturestart,gesturechange,gestureend。

gesturestart: 當乙個手指按在螢幕上,另乙個手指有觸發螢幕時,觸發;

gestureend: 當你的任何乙個手指從螢幕上移開的時候,觸發;

gesturechange: 當觸控螢幕的任何乙個手指發生變化的時候,觸發;

在事件物件這裡,其他的都還一樣,在手勢這裡多了兩個很有用的東西:

乙個是rotation: 手指變化引起的旋轉角度,順時針為正的,逆時針為負的;

還有乙個scale: 兩個手指之間的距離變化;

示例**

-->

gesture事件觸發過程:

step 1、第一根手指放下,觸發touchstart

step 2、第二根手指放下,觸發gesturestart

step 3、觸發第二根手指的touchstart

step 4、立即觸發gesturechange

step 5、手指移動,持續觸發gesturechange,就像滑鼠在螢幕上移動的時候不停觸發mousemove一樣

step 6、第二根手指提起,觸發gestureend,以後將不會再觸發gesturechange

step 7、觸發第二根手指的touchend

step

8、觸發touchstart!注意,多根手指在螢幕上,提起一根,會重新整理一次全域性touch!重新觸發第一根手指的touchstart

step 9、提起第一根手指,觸發touchend

04 觸屏事件

touchstart 手指觸控螢幕時觸發 touchmove 手指在螢幕上移動時觸發 touchend 手指離開螢幕時觸發 touches 位於螢幕上的所有手指的列表 targettouches 位於該元素上的所有手指的列表 changedtouches touchstart時包含剛與觸控螢幕接觸的...

android game 觸屏事件處理

如圖 按螢幕飛機會發出子彈 img 用手指觸控一下螢幕,這短暫的0.1秒內大概會產生10個左右的motionevent 並且系統會盡可能快的把這些event發給監聽執行緒,這樣的話在這一段時間內cpu就會忙於處理ontouchevent從而畫面一卡一卡的。我用的辦法是在ontouchevent中sl...

移動端觸屏事件

移動端瀏覽器相容性較好,我們不需要考慮以前 js 的相容性問題,可以放心的使用原生 js 書寫效果,但是移動端也有自己獨特的地方。比如觸屏事件 touch 也稱觸控事件 android和 ios 都有。touch 物件代表乙個觸控點。觸控點可能是一根手指,也可能是一根觸控筆。觸屏事件可響應使用者手指...