0

PhoneGapアプリケーションでドラッグアンドドロップベースのメニューを作成する際に問題が発生しました。jquery.mobiledraganddrop.js（http://www.stevefenton.co.uk/Content/Jquery-Mobile-Drag-And-Drop/）などのプラグインを試しましたが、機能せず、この機能を自分で作成しようとしました。 jquery mobileで「タッチ」イベントを使用します（ただし、アニメーションはスムーズではありませんでした）。それらのどれも私の目的のために十分ではありませんでした。

最終的に、完璧に見えるpep.jquery.js（http://pep.briangonzalez.org/）プラグインを見つけましたが、いくつかの問題が発生しました。これについては後で説明します。

以下に示すコードの背後にある考え方は、メニュー項目が円の周りに均一に配置されたトークンとして表示されることです。トークンが円の中心にドロップされるたびに、メニューオプションが選択されます。タッチイベントが終了したときにトークンが円の中心に十分に近づいていない場合、トークンは元の位置に戻されます。

問題は次のとおりです。ドラッグはPCでは機能しますが、Androidスマートフォンではまったく機能しません。トークンのドラッグを停止しても、タッチエンドイベントは発生しません（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を使用してドラッグアンドドロップを処理する方法について別のアイデアを教えていただければ幸いです。

4

1 に答える 1

1

映画、

ペップを作りました。どの Android デバイスと、そのデバイスのどのブラウザですか? もう少し情報を教えてください。デバッグを手伝います。

ここで問題を報告していただければ、バグを追跡できます。問題がここSO で相互参照されていることを確認し、この質問に対する正当な回答を投稿できます。

于 2012-05-13T19:40:28.040 に答える