Приложение jQuery Mobile для Iphone - PullRequest
Новая
       6

Приложение jQuery Mobile для Iphone

2 голосов
/ 28 ноября 2011

Я пытаюсь создать веб-приложение HTML5 для iPhone.Я использую 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?Любая помощь будет оценена.

1 Ответ

6 голосов
/ 28 ноября 2011

Некоторые события, которые вы пропустили на странице событий в документации по 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
    }
});
...