Приложение, встроенное в Phonegap — как сделать элементы перетаскиваемыми?

#javascript #jquery #android #html #cordova

#javascript #jquery #Android #HTML #кордова

Вопрос:

Я планирую создать приложение, которое будет использовать Phonegap, однако приложение в значительной степени основано на перетаскивании изображений или элементов.

Возможно ли это с использованием любой из доступных библиотек JavaScript? (jQuery, Sencha Touch и т. Д.) И кто-нибудь действительно получил эту работу на мобильном устройстве?

В качестве обновления:

Я протестировал это в обычном настольном браузере, и он работает нормально. Приложение также компилируется и запускается на телефоне Android, однако форма не перетаскивается. У кого-нибудь есть какие-либо предложения?

 <!DOCTYPE HTML>
<html>
<head>
<title>Title</title>

    <script type="text/javascript" charset="utf-8" src="phonegap-1.1.0.js"></script>
  <script src="jquery-1.6.2.min.js"></script>
  <script src="jquery-ui-1.8.16.custom.min.js"></script>

    <script>
  $(document).ready(function() {
    $(".shape").draggable();
  });
  </script>

    <script type="text/javascript" charset="utf-8">

    // Wait for PhoneGap to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

    // PhoneGap is ready
    //
    function onDeviceReady() {

    alert("phonegap works");

    $(".shape").draggable();



    }

    </script>

    </head>
    <body>

 <div data-role="page" id="home">
  <div data-role="header"> 
    <h1>Header Title</h1> 
  </div>  
  <div data-role="content">
  <img class="shape" src="images/150x150.gif" />
  </div> 
 </div>

  <div data-role="page" id="general"> 
    <div data-role="header"> 
     <h1>Header title</h1> 
    </div> 

    <div data-role="content">
    </div> 
  </div> 
</div> 
</body>
</html>
 

Ответ №1:

У меня есть несколько приложений, созданных с использованием jQuery / jQuery UI Draggable Phonegap, и они отлично работают.

Я бы посоветовал вам начать с этого; удачи!

Комментарии:

1. Спасибо за ваш ответ dSquared. Я создал базовую html-страницу, используя jQuery draggable, однако при переносе на Phonegap она не работает. Я бы что-то упустил? Я слышал, что у некоторых людей возникают проблемы с репликацией нажатия и удержания перетаскиваемого объекта щелчком мыши.