1

現在、iPhone、iPad、Android フォン、および Android タブレット用のアプリを作成しています。

この例のような単一のコード ベースで作業しています。

しかし、タブレットもサポートしているため、私のプロジェクトはもう少し複雑なので、アプリをインストールするデバイスで使用されていないアセットを除外しようとしています。

明確にするために、私のプロジェクト ファイル/フォルダー構造は次のようになります。

プロジェクトのルート:

  • html (html、JS、Css、android & ios プロジェクトの画像)
    • CSS
      • スタイル.css
      • スタイル-android-phone.css
      • style-android-tablet.css
      • スタイル-ios-phone.css
      • style-ios-tablet.css
    • 画像
      • 共有
        • [...]
      • 電話
        • [...]
      • タブレット -[...]
    • js
      • [...]
    • テンプレート (=html テンプレート)
      • 電話
        • [...]
      • タブレット
        • [...]
  • アンドロイド (日食プロジェクト)
    • 資産
      • www (../../html へのシンボリックリンク)
    • 置き場
      • [...]
    • 世代
      • [...]
    • ライブラリ
      • [...]
    • 解像度
      • [...]
    • ソース
      • [...]
    • [...]
  • ios (xcode プロジェクト)
    • CordovaLib
      • [...]
    • 私のプロジェクト
      • クラス
        • [...]
      • プラグイン
        • [...]
      • 資力
        • [...]
      • [...]
    • My_project.xcodeproj
    • www (../../html へのシンボリックリンク)

たとえば、iphone アプリに html/css/style-android-tablet.css、html/css/style-ios-tablet.css、html/images/tablet/ 、html/テンプレート/タブレット/

現在、このアプリは、役に立たないアセット (主に画像) のため、iPhone などで重くなっています。

私は次のようないくつかのアイデアを試しました: - xcode プロジェクトで 2 つの tagets を使用します。1 つは iPhone 用、もう 1 つは iPad 用です。ただし、xcode の www の下にあるファイルとフォルダーは、ターゲット メンバーシップとして設定できません。できるのは www だけです。- 2 つの www ディレクトリと 2 つのターゲットを使用していますが、iphone ターゲットには ipad をターゲットとする www が含まれています。

この解決策が役立つと思いますが、ファイル構造に適応させる方法がよくわかりません。

したがって、将来（次のプロジェクトと既存のプロジェクトのリリース）に向けて、最善でよりシンプルなソリューションを見つけるためにあなたの助けを求めます。

事前に、ご協力いただきありがとうございます。

乾杯。

4

1 に答える 1

1

Android と iOS 間でリソースを共有するために私が過去に使用したアプローチを次に示します。

この正確な手法を使用して、共有コードベースを作成できますが、プラットフォーム固有のファイルも作成できます。フォルダーを www ディレクトリ (共有ディレクトリではなく) に追加し、プラットフォーム固有の CSS ファイルをその中に配置します。 注: このアプローチでは、www の親フォルダーではなく、www のサブフォルダーがシンボリック リンクされます。

デバイスのフォーム ファクタ間で個別の CSS ファイルを使用する場合は、もう少し注意が必要です...

1 つのオプションは、JavaScript を使用してアプリケーションの初期化中に <style> 要素を条件付きで追加することです。ユーザー エージェントとウィンドウの寸法を調べて、適切なプラットフォームとフォーム ファクターの <style> 要素を手動で追加できます。ただし、ユーザー エージェントのスニッフィングは、簡単に壊れたり、新しいデバイス カテゴリが導入された場合に失敗したりする可能性があるため、一般的に推奨されません。

もう 1 つのオプションは、すべてを含めて CSS メディア クエリを使用することです。

ユニバーサル バイナリ (携帯電話とタブレットの両方のフォーム ファクターを対象とする) を使用している場合は、携帯電話とタブレットの両方の CSS をアプリに含める必要があります。CSS スタイルが特定のデバイス フォーム ファクターにのみ適用されるように、CSS メディア クエリを使用できます。したがって、タブレット スタイルをメディア クエリでラップすると、タブレット フォーム ファクターにのみ適用されます。

CSS メディア クエリの詳細については、次を参照してください。

一般的なデバイス フォーム ファクタの事前定義された CSS メディア クエリは、次の場所からアクセスできます。

ユニバーサル バイナリを使用していない場合は、デバイス カテゴリごとに個別のプロジェクト環境が必要になります。個別のプロジェクトごとに、CSS ファイルへの静的パスを使用して、共有コードベースへのシンボリック リンクを作成できます。

特定の CSS ファイルを特定のプロジェクト構成に条件付きで挿入する場合は、それぞれに個別のプロジェクトが必要になるか、それを行うスクリプトを作成する必要があります。

うまくいけば、それは役に立ちます...

于 2012-12-14T15:05:16.517 に答える