8

私は現在、モバイル用のアプリケーションを実現するための新しいプロジェクトに取り組んでいます。クライアントが決まっておらず、いくつかの解決策を提案する必要があります。Android (バージョン 2.2+) との互換性が必要であり、iOS およびその他の OS が適切である可能性があります。私たちは Android 向けしか開発できませんが、Web モバイル フレームワークを使用することを考えました。

それらを使用したことがないので、既存のソリューションを探し始めました。PhoneGap、Titanium、Sencha Touch、jQuery Mobile について聞いたことがあります。

私が見つけた可能性は次のとおりです。

  • PhoneGap + Sencha Touch
  • PhoneGap + jQuery Mobile (または同等のもの)
  • Sencha Touch (API + UI)
  • チタン

アプリケーションの重要なポイントは、ユーザーが写真を撮って編集できるようにすることです。サイズ変更、テキストの追加... Android では技術的に可能ですが、Web モバイル フレームワークではわかりません。

たとえば、PhoneGap と jQuery Mobile を使用して、それを行うことは可能ですか? 各機能のコードの一部を見つけましたが、完全なものはなく、多くのモバイルで互換性があるかどうかもわかりません. 開発時間については、モバイル フレームワークを使用する (および Javascript で画像版を開発する) よりも、2 つのネイティブ アプリケーションを実行する方がよいでしょうか?

そして、各フレームワークについて多くの意見を見つけましたが、そのうちのいくつかは 1 年以上投稿されており、すべてのソリューションの明確なビジョンを持つことが非常に困難になりました。

したがって、これらのソリューションのいずれかを使用してこの写真版を実現できるかどうか、またどれが最適かを知りたいと思います。

ご協力ありがとうございました

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 Appcelerator (中難易度)

前の 2 つのオプションとは異なり、Titanium の動作は少し異なります。jQM と Sencha を使用してハイブリッド モバイル アプリを作成し、Titanium appcelerator を使用して JavaScript コードからネイティブ アプリを作成します。マスターするのはそれほど難しくありません。率直に言って、js コードは非常に単純です。開発ツールは高速ですが、ネイティブ アプリを適切にスタイル設定するのは難しくなります (ゼロからネイティブ アプリを構築する場合はプロセスがはるかに簡単になります)。

Inter App Framework / ex jqMoby (低難易度)

このフレームワークは jQuery Mobile と同じくらい古いもので、現在は Intel が所有しています。Sencha Touch と同様に、このフレームワークの主な目標はハイブリッド モバイル アプリの開発であり、うまく機能します。Android と iOS 向けに最適化されているため、jQuery Mobile よりも高速な実行が期待できます。また、Sencha Touch と同様に、このフレームワークには独自のネイティブ アプリ ラッパーがあります。もちろん、このフレームワークには、おぞましいドキュメンテーションのような悪い面はほとんどありません (少なくともこの記事を書いている時点では)。このフレームワークについて詳しく知りたい場合は、このARTICLEをご覧ください。

剣道UI(低難易度)

jQuery Mobile の優れた代替手段。より良く、より速く。一つだけ問題があります。それは商用製品です。約 200 米ドルかかります。

詳細については、こちらをご覧ください。

PhoneJS (低難易度)

jQuery Mobile と Kendo UI のもう 1 つの優れた代替手段です。Kendo UI と同じレベルで、jQuery Mobile よりもはるかに高速です。それには素晴らしいドキュメントがあり、今日までで最高のドキュメントの 1 つです。

詳細については、こちらをご覧ください。

ここでそれについて読んでください

佳作

ロモービルに行く。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

また、さまざまなクロスプラットフォーム フレームワーク (Sencha、jQM、PhoneGap など) で実装された同じアプリケーションを示すオープン ソースのPropertyCrossプロジェクトにも興味があるかもしれません。

更新 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

JQM を無視してください。アプリケーションに余分なオーバーヘッドが追加されます。代わりにIonicをお勧めします。PhoneGap/Cordova + Angularjs (オプション) + Ionic は、あなたを本当に遠くまで連れて行ってくれます。

于 2014-06-19T20:52:50.340 に答える