具有动态图形按钮的 Android 移动网络应用程序答案

【问题标题】：Android mobile web app with dynamic graphical buttons具有动态图形按钮的 Android 移动网络应用程序
【发布时间】：2012-09-11 01:09:45
【问题描述】：

我想将我编写的 Python/wxPython 桌面应用程序转换为 Android 移动网络应用程序，并希望获得有关使用带有 PHP 后端的 JQuery Mobile 执行此操作的建议。（这是供内部使用的，因此我们可以指定要使用的移动设备。）具体而言：

现有的桌面触摸屏应用程序有一个图像背景，上面覆盖有响应触摸屏（即鼠标点击）事件的圆形图形按钮。单击时，图形会通过增加按钮文本中的计数器、更改按钮的背景颜色以及更新数据库记录来更新。

希望将 JQuery Mobile 用于标准菜单等，以及这种图形按钮方法来处理所述的点击事件。我应该为此研究 HTML5 画布吗？

我很喜欢使用 PHP/MySQL 以及带有标准表单提交的 JQM 进行 Web 编程，但我只是开始使用 JQuery、AJAX 等进行事件。
准备好并愿意学习，但不想在这方面一次朝太多方向走……

感谢您的建议，凯文

【问题讨论】：

标签： php jquery ajax mobile html5-canvas

【解决方案1】：

在我看来，这在 jQuery Mobile 中是完全可行的，而无需进入 Canvas 方面的内容——我非常同意你关于不想进入太多方向的观点！

首先，您可以使用您提到的所有标准布局/菜单/按钮。在您的可点击圈子的页面内容中，我只会制作可点击的 div，然后您可以“监听”点击事件，然后进行相应的处理。

至于制作圆圈，这可以通过 HTML5 的border-radius css 属性轻松完成，正如您所提到的，由于所有现代移动浏览器都支持这一点，因此应该很容易实现。对于下面的示例，我建议您在基于 webkit 的浏览器（如 Safari、Chrome 或现代版本的 FF）中查看它，以查看 CSS 边框半径创建圆圈的难易程度。

我在这里模拟了一个简单的例子http://jsbin.com/owipah/44/edit

当然，您会根据需要进行任何后/预处理，以使界面与您的服务器端保持一致。

希望对你有帮助，

【讨论】：