[iOS 8] PhotoKit 10 – Photo Editing Extensionの実装 (前篇)

はじめに

前回の記事ではPhoto Editing Extensionの概要を紹介しましたが、今回はPhoto Editing Extensionの実装を扱います。

以下の画像のような、写真にフィルターをかけるApp Extensionを実装します。

実装

プロジェクト作成

新しいプロジェクトを作成します。今回は「Single View Applicasion」テンプレートを選択します。

ターゲット追加

プロジェクトの作成できたら、App Extension用のターゲットを追加します。

Xcodeのメニューの「File」→「New」と辿り、「Target」をクリックします。

追加するターゲットの種類を選択する画面が表示されますので、 「Applicasion Extension」項目をクリックして、 「Photo Editing Extension」を選択し、「Next」ボタンをクリックします。

追加するターゲットのオプションを入力／選択する画面が表示されます。 Product Name項目に「FilterExtension」と入力し、「Finish」ボタンをクリックします。

「FilterExtension」用のスキーマを有効にするか聞かれるので「Activate」をクリックします。

ターゲットを追加すると、必要最低限のファイルも追加されます。

• メインViewControllerのクラスファイル
• storyboardファイル
• Info.plistファイル

storyboardファイルの編集

「MainInterface.storyboard」ファイルを編集していきます。

もともと配置してあった「Hello World」ラベルを削除し、 UIImageViewとUISegmentedControlを配置します。

Viewの背景色を黒に変更します。 UISegmentedControlの項目を1つ増やし、 以下の図の通りに「セピア」「クローム」「インスタント」というタイトルを設定します。

Autolayoutの制約を追加します。 UIImageViewとUISegmentedControlに関する制約は以下のように設定しました。

Storyboard編集画面上のFrameをアップデートすると以下のような配置になります。

UIImageViewとUISegmentedControlに関して、Storyboardから実装ファイルへ、アウトレットを接続します。 プロパティ名はそれぞれimageView、segmentedControlとしました。

まとめ

今回はターゲットの追加とStoryboardファイルの編集を行いました。Photo Editing Extensionの実装(後編)へ続きます。

本シリーズの記事一覧

• [iOS 8] PhotoKit 1 – Photos Frameworkの概要
• [iOS 8] PhotoKit 2 – Photos Framework – モデルオブジェクトの取得
• [iOS 8] PhotoKit 3 – Photos Framework – モデルオブジェクトのプロパティの編集
• [iOS 8] PhotoKit 4 – Photos Framework – モデルオブジェクトのコンテンツの編集
• [iOS 8] PhotoKit 5 – Photos Framework – モデルオブジェクトの削除
• [iOS 8] PhotoKit 6 – Photos Framework – モデルの変更のハンドリングとコンテンツ編集のrevert
• [iOS 8] PhotoKit 7 – Photos Framework – フォトライブラリへのアクセス許可を得る
• [iOS 8] PhotoKit 8 - UIImagePickerControllerとPhotos Frameworkを組み合わせて使う
• [iOS 8] PhotoKit 9 – Photo Editing Extensionの概要
• [iOS 8] PhotoKit 10 – Photo Editing Extensionの実装 (前篇)
• [iOS 8] PhotoKit 11 – Photo Editing Extensionの実装 (後篇)