簡體   English   中英

jQuery Mobile Iphone應用程序

[英]jQuery Mobile Iphone application

我正在嘗試為iPhone創建HTML5 Web應用程序。 我正在使用jQuery Mobile。 我的應用程序涉及在畫布上繪制。 這很像一個繪畫應用程序,它利用畫布來渲染草圖。 用戶可以從任何方向在屏幕上滑動,應用程序應該能夠找出位置,然后在這些點之間畫線。

jQuery Mobile僅提供以下一些基本事件來進行滑動控制,但是我認為我需要對滑動進行更多控制,因為用戶可以沿任何方向滑動並且可以是任意像素長。 另一方面,我應該能夠捕獲大多數點,以便可以更清晰,更精確地可視化圖形。

tap
Triggers after a quick, complete touch event.
taphold
Triggers after a held complete touch event (close to one second).
swipe
Triggers when a horizontal drag of 30px or more (and less than 20px vertically) occurs within 1 second duration.
swipeleft
Triggers when a swipe event occurred moving in the left direction.
swiperight
Triggers when a swipe event occurred moving in the right direction.

在iOs應用程序的畫布中創建繪圖應用程序時,我還應該遵循其他技術嗎? 任何幫助將不勝感激。

您在jQuery Mobile文檔的“事件”頁面上錯過的一些事件是虛擬事件: http : //jquerymobile.com/demos/1.0/docs/api/events.html

vmousedown
    Normalized event for handling touchstart or mousedown events

vmousemove
    Normalized event for handling touchmove or mousemove events

vmouseup
    Normalized event for handling touchend or mouseup events

vmousecancel
    Normalized event for handling touch or mouse mousecancel events

我將使用vmousedown事件開始跟蹤光標的移動,使用vmousemove繼續跟蹤光標的路徑,並使用vmouseup完成跟蹤光標的移動。

一個簡單的例子是:

//setup a variable to store the cursor's movement
var tracks = [];

//bind to the three events described above
$(document).bind('vmousedown vmousemove vmouseup', function (event) {

    //check to see what event is being fired
    if (event.type == 'vmousedown') {

        //if the `vmousedown` event is fired then reset the value of the `tracks` variable and add the first point to the variable
        tracks = [{ x : event.pageX, y : event.pageY}];
    } else if (event.type == 'vmousemove') {

        //if the `vmousemove` event is fired then add a new point to the `tracks` variable
        tracks.push({ x : event.pageX, y : event.pageY});
    } else if (event.type == 'vmouseup') {

        //if the `vmouseup` event is fired then the user is done drawing and you can draw their line for them
    }
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM