2012-05-08 4 views
0

PhoneGap 응용 프로그램에서 끌어서 놓기 기반 메뉴를 만드는 데 문제가 있습니다. 예 : 몇 가지 플러그인을 시도했습니다. jquery.mobiledraganddrop.js (http://www.stevefenton.co.uk/Content/Jquery-Mobile-Drag-And-Drop/)는 작동하지 않았고 jquery로 "touch"이벤트를 사용하여 직접이 기능을 작성하려고했습니다. 모바일 (애니메이션은 부드럽지 않았습니다.) 그 중 아무 것도 내 원인으로는 충분하지 않았습니다.Android에서 PhoneGap 및 pep.jquery.js를 사용하여 끌어서 놓기

결국 pep.jquery.js (http://pep.briangonzalez.org/) 플러그인이 완벽한 것으로 보였으 나, 나중에 설명 할 일부 문제가 발생했습니다.

아래 제시된 코드의 배경은 메뉴 항목이 원 주위에 균일하게 놓인 토큰으로 표시된다는 것입니다. 토큰이 원 중심에 떨어질 때마다 메뉴 옵션이 선택됩니다. 터치 이벤트가 끝날 때 토큰이 원 중심에 충분히 가깝지 않으면 원래 위치로 다시 이동합니다.

문제가 있다는 것입니다 : PC에서 작품을 드래그 만하면, touchend 이벤트 내가 토큰을 끌어 중지 할 때 발생하지 않는 안드로이드 전화에 전혀 하지 작업을 수행합니다 (I는 사실을 알고 있어요 marginLeft 및 marginTop은 0으로 설정되고 토큰이 원래 위치로 이동하지 않습니다. 디버깅 목적으로 토큰을 남겼습니다.

$(document).ready(function(){ 
    var centerX = 240; 
    var centerY = 440; 
    var radius = 180; 
    var internalRadius = 86;  
    var tokenNumber = $("#circle .token").length; 

    reloadTokens(tokenNumber, radius, 0); 

    $(".token").pep({ 
     cssEaseDuration: 0, 
     activeClass: "activeToken" 
    }); 

    $("#token").bind("touchend",function(){ 
     $(this).forceStop(); 
     $(this).animate({ 
      marginLeft: 0, 
      marginTop: 0 
     }, "fast", "easein"); 
    }); 

}); 

function reloadTokens(tokenNumber, radius, additionalOffset){ 

    var degreeOffset = 60; 

    var i = 0; 
    $(".token").each(function(){ 
     degree = (i * (360/tokenNumber) - degreeOffset + additionalOffset) % 360; 
     var tokenX = radius * Math.cos(degree * (Math.PI/180)) + radius; 
     var tokenY = radius * Math.sin(degree * (Math.PI/180)) + radius; 
     $(this).css({ 
      marginLeft: tokenX, 
      marginTop: tokenY 
     }); 
     i++; 
    }); 
} 

이 코드에 대한 도움은 매우 감사하겠습니다. :) 당신이 나에게 전에 설명한 방법 이외의 phonegap을 사용하여 드래그 앤 드롭을 처리하는 방법을 다른 아이디어로 주면 나는 또한 매우 기뻐할 것입니다.

답변

1

iamovie,

나는 Pep를 만들었습니다. 해당 기기에서 어떤 Android 기기 및 어떤 브라우저가 사용됩니까? 좀 더 자세한 정보를 알려 주면 디버깅에 도움이됩니다.

here 문제를 제기하면 버그를 추적 할 수 있으므로 여기에 문제가 상호 참조되어 있는지 확인하고이 질문에 대한 정당한 답변을 게시 할 수 있습니다.