iOS WebView
このガイドでは、より大きなiOSアプリケーション内にCordova対応のWebViewコンポーネントを埋め込む方法を示します。これらのコンポーネントがお互いに通信する方法の詳細については、「アプリケーションプラグイン」を参照してください。
iOS向けWebViewのサポートは、Xcodeテンプレートが参照実装として機能する`Cleaver`コンポーネントを使用して、Cordovaバージョン1.4から開始されました。Cordova 2.0以降のバージョンでは、サブプロジェクトベースのCleaver実装のみがサポートされています。
これらの手順には、Cordova 4.x以降とXcode 8.0以降、および新しく作成されたiOSプロジェクトからの`config.xml`ファイルが必要です。新しいプロジェクトを作成するには、コマンドラインインターフェースの手順を使用し、`platforms/ios`内の指定されたアプリケーションのサブディレクトリ内から`config.xml`ファイルを取得できます。
これらの手順に従うには、最新のCordovaディストリビューションがインストールされていることを確認してください。cordova.apache.orgからダウンロードして、そのiOSパッケージを解凍してください。
プロジェクトにCordovaを追加するには2つの方法があります。1つ目はCarthageを使用する方法、2つ目は手動でCordovaを追加する方法です。Carthageのサポートは、cordova-iosバージョン4.4.0以降のみです。
これらの2つの方法のいずれかを使用したら、「**CDVViewControllerの使用**」セクションに進みます。
1. Carthageを使用してCordova.frameworkをXcodeプロジェクトに追加する
-
Carthageをインストールする
-
あなたのCartfileに以下を追加します(`
`を適切なバージョンに置き換えてください) git "git://git.apache.org/cordova-ios.git" "<version_or_tag>" # Apache
-
実行する
carthage update
-
Carthage/Build/iOS/Cordova.framework
をXcodeプロジェクトに追加します。
2. CleaverをXcodeプロジェクトに追加する(CordovaLibサブプロジェクト)
-
Xcodeが実行されている場合は終了します。
-
ターミナルを開き、Cordova iOSのソースディレクトリに移動します。
-
上記で説明した`config.xml`ファイルをプロジェクトディレクトリにコピーします。
-
Xcodeを開き、Finderを使用して`config.xml`ファイルを**プロジェクトナビゲータ**ウィンドウにコピーします。
-
**追加されたフォルダにグループを作成する**を選択し、**完了**を押します。
-
Finderを使用して`CordovaLib/CordovaLib.xcodeproj`ファイルをXcodeの**プロジェクトナビゲータ**にコピーします。
-
**プロジェクトナビゲータ**内で`CordovaLib.xcodeproj`を選択します。
-
**ファイルインスペクタ**を表示するには、**Option-Command-1**キーの組み合わせを入力します。
-
**ファイルインスペクタ**の**場所**のドロップダウンメニューで、**グループを基準に**を選択します。
-
**プロジェクトナビゲータ**で**プロジェクトアイコン**を選択し、**ターゲット**を選択してから、**ビルド設定**タブを選択します。
-
**その他のリンカーフラグ**の値に`-force_load`と`-ObjC`を追加します。
-
**プロジェクトナビゲータ**で**プロジェクトアイコン**をクリックし、**ターゲット**を選択してから、**ビルドフェーズ**タブを選択します。
-
**ライブラリとバイナリをリンク**を展開します。
-
**+**ボタンを選択し、以下の**フレームワーク**を追加します。必要に応じて、**プロジェクトナビゲータ**内で、それらを**フレームワーク**グループの下に移動します。
AssetsLibrary.framework CoreLocation.framework CoreGraphics.framework MobileCoreServices.framework
-
**ターゲットの依存関係**を展開します(複数のボックスがある場合は、そのラベルが付いた一番上のボックス)。
-
**+**ボタンを選択し、`CordovaLib`ビルド製品を追加します。
-
**ライブラリとバイナリをリンク**を展開します(複数のボックスがある場合は、そのラベルが付いた一番上のボックス)。
-
**+**ボタンを選択し、`libCordova.a`を追加します。
-
**Xcode環境設定→場所→派生データ→詳細…**を**一意**に設定します。
-
**プロジェクトナビゲータ**で**プロジェクトアイコン**を選択し、**ターゲット**を選択してから、**ビルド設定**タブを選択します。
-
**ヘッダー検索パス**を検索します。その設定に、以下の3つの値を引用符を含めて追加します。
"$(TARGET_BUILD_DIR)/usr/local/lib/include" "$(OBJROOT)/UninstalledProducts/include" "$(OBJROOT)/UninstalledProducts/$(PLATFORM_NAME)/include" "$(BUILT_PRODUCTS_DIR)"
Cordova 2.1.0以降、`CordovaLib`は**自動参照カウント(ARC)**を使用するようにアップグレードされています。`CordovaLib`を使用するために**ARC**にアップグレードする必要はありませんが、プロジェクトを**ARC**を使用するようにアップグレードする場合は、**編集→リファクタリング→Objective-C ARCに変換…**メニューからXcode移行ウィザードを使用し、**libCordova.a**を**選択解除**してから、ウィザードを完了するまで実行する必要があります。
CDVViewControllerの使用
-
以下のヘッダーを追加する
#import <Cordova/CDVViewController.h>
-
新しい`CDVViewController`をインスタンス化し、どこか(たとえば、クラスプロパティ)に保持する
CDVViewController* viewController = [CDVViewController new];
-
`wwwFolderName`プロパティを設定することもできます。デフォルトは`www`です。
viewController.wwwFolderName = @"myfolder";
-
`config.xml`ファイルの`
`タグで開始ページを設定することもできます。ローカルファイルの場合 <content src="index.html" />
…またはリモートサイトの場合
<content src="https://apache.dokyumento.jp" />
-
`useSplashScreen`プロパティを設定することもできます。デフォルトは`NO`です。
viewController.useSplashScreen = YES;
-
**ビューフレーム**を設定します。常に最後のプロパティとして設定します。
viewController.view.frame = CGRectMake(0, 0, 320, 480);
-
ビューにCleaverを追加する
[myView addSubview:viewController.view];
HTML、CSS、JavaScriptアセットの追加
-
プロジェクト内に新しいディレクトリを作成します(例:`www`)。
-
このディレクトリにHTML、CSS、JavaScriptアセットを配置します。
-
Finderを使用して、ディレクトリをXcodeの**プロジェクトナビゲータ**ウィンドウにコピーします。
-
**追加されたフォルダにフォルダ参照を作成する**を選択します。
-
最初に作成したディレクトリに対して適切な`wwwFolderName`と`startPage`プロパティを設定するか、`CDVViewController`をインスタンス化するときにデフォルト(前のセクションで指定)を使用します。
/* if you created a folder called 'myfolder' and you want the file 'mypage.html' in it to be the startPage */ viewController.wwwFolderName = @"myfolder"; viewController.startPage = @"mypage.html"