Мобильное веб-приложение для Android с динамическими графическими кнопками

Я хочу преобразовать настольное приложение Python / wxPython, которое я написал, в мобильное веб-приложение для Android, и хотел бы получить рекомендации по выполнению этого с помощью JQuery Mobile с серверной частью PHP. (Это для внутреннего использования, поэтому мы можем указать, какие мобильные устройства будут использоваться.) В частности:

Существующее настольное приложение для сенсорного экрана имеет фон изображения с наложенными круговыми графическими кнопками, которые реагируют на события сенсорного экрана (т. Е. Щелчок мыши). При нажатии изображение обновляется путем увеличения счетчика в тексте кнопки, изменения цвета фона кнопки и обновления записи в базе данных.

Хотел бы использовать JQuery Mobile для стандартных меню и т. Д., А также этот подход с использованием графических кнопок для обработки событий касания, как описано. Стоит ли мне заглядывать в холст HTML5 для этого?

Мне комфортно заниматься веб-программированием с использованием PHP / MySQL, а также JQM со стандартной отправкой форм, но я просто вхожу в события с JQuery, AJAX и т. Д.
Готов и хочу учиться, но не хочу идти сразу по слишком многим направлениям ...

Спасибо за ваши предложения, Кевин


mobile php jquery ajax html5-canvas
person user1681048    schedule 18.09.2012    source источник

Ответы (1)


arrow_upward
0
arrow_downward

На мой взгляд, это более чем выполнимо только в jQuery Mobile без необходимости вдаваться в аспекты Canvas - я полностью согласен с вами в том, что вы не хотите идти в слишком многих направлениях!

Во-первых, вы можете использовать все стандартные макеты / меню / кнопки, которые вы упомянули для стандартных вещей. В содержимом страницы для ваших кликабельных кругов я бы просто сделал кликабельные блоки div, которые вы затем могли бы «прослушивать», чтобы нажимать события, а затем обрабатывать соответствующим образом.

Что касается создания кругов, это можно легко сделать с помощью свойства css HTML5 border-radius, которое, как вы упомянули, должно быть легко достижимым, поскольку все современные мобильные браузеры поддерживают это. Ради примера ниже я бы порекомендовал вам просмотреть его в браузере на основе webkit, таком как Safari, Chrome или в современной версии FF, чтобы увидеть простоту CSS border-radius для создания кругов.

Здесь я создал простой пример http://jsbin.com/owipah/44/edit.

Естественно, вы будете делать любую пост / предварительную обработку по мере необходимости, чтобы поддерживать интерфейс на стороне сервера.

Надеюсь, это поможет,

R.

person Rob Schmuecker    schedule 18.09.2012