8

我目前正在一个新的项目上实现移动应用程序。客户还没有决定，我必须提出几个解决方案。需要与 Android（2.2+ 版）的兼容性，iOS 和其他操作系统可能会很好。我们只能为 Android 开发，但我想使用 Web 移动框架。

由于我从未使用过它们，我开始寻找现有的解决方案。我听说过PhoneGap、Titanium、Sencha Touch 和jQuery Mobile。

这是我发现的可能性：

  • PhoneGap + Sencha Touch
  • PhoneGap + jQuery Mobile（或同等产品）
  • Sencha Touch (API + UI)
  • 钛

该应用程序的关键点是允许用户拍照并对其进行编辑：调整大小、添加一些文本……在 Android 上，这在技术上是可行的，但我不知道使用 Web 移动框架。

以 PhoneGap 和 jQuery Mobile 为例，有可能做到吗？我找到了每个功能的部分代码，但没有很完整，并且不确定它是否能在很多手机上兼容。对于开发时间，也许做 2 个原生应用程序而不是尝试使用移动框架（并用 Javascript 开发图片版）更好？

我在每个框架上发现了很多意见，但其中一些已经发布了一年多，而且它们的发展如此之难，以至于对所有解决方案都有清晰的认识。

所以我想知道我是否可以用这些解决方案之一来实现这个图片版本，哪个可能是最好的。

谢谢您的帮助

4

5 回答 5

39

介绍

从技术上讲，它可以使用你所有的可能性来完成，我会按照难度从低到难排列它们，我会更多的可能性。此外，我为我的博客写了更广泛的文章。

PhoneGap/Cordova + jQuery Mobile（低难度）

Phonegap 是您需要的，jQuery Mobile 仅用于 UI。这种组合仍然很容易一起实现，并且有很多工作示例。Phonegap 充当 HTML5/JS/CSS 的包装器，它可以让您访问手机功能专家。Phonegap 将用于拍照，jQM 将用于修改。

这是一个相当新的PhoneGap + jQuery Mobile 教程。如果您想查看该文章的 MACOS 版本，请查看此处。

如果您想找到有关 jQuery 和 jQuery Mobile 之间差异的良好信息来源，请查看这里。

PhoneGap/Cordova + Sencha Touch（中/难）

与 jQM 不同，Sencha Touch 学习起来有点困难（或者更难，取决于您的 javascript 知识），尤其是如果您没有良好的 javascript 背景知识或没有 Sencha Touch 设计器工具的许可证。只有当你有足够的时间来学习新东西时，才走这条路。Sencha Touch 版本 2 有自己的应用程序包装器，因此不再需要 Phonegap。

如果您想了解更多信息，请查看这篇讨论 jQuery Mobile 和 Sencha Touch 之间区别的文章。

钛加速器（中等难度）

与前两个选项不同，Titanium 的工作方式略有不同。jQM 和 Sencha 用于创建混合移动应用程序，Titanium appcelerator 用于从 javascript 代码创建本机应用程序。掌握起来并不难，说实话js代码很简单。虽然快速的开发工具将更难正确设置您的原生应用程序的样式（从头开始构建原生应用程序时更容易处理）。

Inter App Framework / ex jqMoby (低难度)

这个框架几乎和 jQuery Mobile 一样古老，现在它归英特尔所有。与 Sencha Touch 一样，该框架的主要目标是开发混合移动应用程序，并且效果很好。它针对 Android 和 iOS 进行了优化，因此期望比 jQuery Mobile 更快的执行速度，就像 Sencha Touch 一样，这个框架有自己的原生应用程序包装器。当然，这个框架很少有不好的方面，比如糟糕的文档（至少在撰写本文时）。如果您想了解有关此框架的更多信息，请查看此文章。

剑道用户界面（低难度）

jQuery Mobile 的绝佳替代品。以任何方式更好，更快。只有一个问题，它是一种商业产品。这将花费你 200 美元。

在这里找到更多信息。

PhoneJS（低难度）

jQuery Mobile 和 Kendo UI 的另一个出色替代品。比 jQuery Mobile 快得多，与 Kendo UI 处于同一级别。它有一个很棒的文档，是我迄今为止最好的文档之一。

在这里找到更多信息。

在这里阅读它。

荣誉奖

去罗莫比尔。类似于 Phonegap/Cordova 但较少使用。

从开发时间的角度来看，创建混合应用程序比创建原生应用程序更快。在您的情况下，如果您有 Java/Objective C 知识，请坚持使用本机应用程序。无论您花费多少时间进入混合应用程序，它都会足够好或足够快。

编辑 ：

这是一个 Phonegap + jQuery Mobile 的例子：http ://therockncoder.blogspot.com/2012/07/jquery-mobile-phonegap-and-camera.html ，在那里你会找到一个用于 Android 和 iOS 实现的 github 链接。

如果您从未使用过 jQuery，请坚持使用Dawson Toth Titanium 示例。但如果可能的话，坚持使用 jQuery Mobile。

更新 1

您可能还对开源PropertyCross项目感兴趣，该项目演示了使用一系列跨平台框架（包括 Sencha、jQM 和 PhoneGap）实现的相同应用程序。

更新 2

过去几周我一直在审查其他 HTML5 移动框架。我的评论可以在这里和这里找到。

于 2013-01-04T23:15:35.693 回答
2

是的，您可以在 Titanium 中执行此操作。下面是一个简单的实现，在 5 分钟内起草和测试。

为了让您了解它的外观，请参阅以下内容。然后看看 Pedro Enrique 的 TiDraggable，如果你想增强它以让用户在文本或图像之间相互拖动：https ://github.com/pec1985/TiDraggable

// This app consists of two visual parts: a canvas where the user does stuff,
// and a save button in the bottom right.
var win = Ti.UI.createWindow({
    backgroundColor: 'black'
});

// First, the canvas.
var canvas = Ti.UI.createView({
    bottom: 50,
    backgroundColor: 'white'
});
// It has a scroll view so the user can...
var scroll = Ti.UI.createScrollView({
    // ... zoom content in or out.
    maxZoomScale: 2, minZoomScale: 0.1,
    // .. and freely position the image.
    contentWidth: 1000, contentHeight: 1000
});
// Add the image to the middle of the scroll view.
scroll.add(Ti.UI.createImageView({
    image: 'http://appc.me/Content/kitten.jpg',
    width: 750, height: 426,
    hires: true
}));
canvas.add(scroll);
// Add some text.
canvas.add(Ti.UI.createLabel({
    text: 'Kittens are the best.', textAlign: 'center',
    font: { fontSize: 28 },
    color: '#000',
    bottom: 20
}));
// Add the canvas to the win.
win.add(canvas);

// Second, create the "save" button.
var save = Ti.UI.createButton({
    title: 'Save to Gallery',
    height: 30, width: Ti.UI.SIZE,
    bottom: 10, right: 10
});
save.addEventListener('click', function (evt) {
    // Turn our "canvas" view (and its children) in to an image,
    // and save it to the gallery.
    Ti.Media.saveToPhotoGallery(canvas.toImage(), {
        success: function () {
            alert('Saved!');
        },
        error: function () {
            alert('Oh no...');
        }
    });
});
// Add it to the win.
win.add(save);

win.open();
于 2013-01-05T03:51:53.327 回答
1

请参阅对 5 个最佳移动 Web 应用程序框架的深入审查和比较：

于 2014-03-12T09:56:57.747 回答
1

忽略 JQM，它给您的应用程序增加了太多开销。我会推荐Ionic。PhoneGap/Cordova + Angularjs（可选）+ Ionic 会让你走得很远。

于 2014-06-19T20:52:50.340 回答
1

我会说去离子- http://ionicframework.com

Ionic 提供了一个针对移动设备优化的 HTML、CSS 和 JS CSS 组件、手势和工具的库，用于构建高度交互的应用程序。使用 Sass 构建并针对 AngularJS 进行了优化。

它是一个专注于性能且专注于本机的框架，具有强大的 CLI。

它允许您开发

  1. iOS
  2. 安卓
  3. Windows Phone/通用
  4. 移动网络
于 2016-03-21T07:09:13.607 回答