第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに...

21
第 6 第 iPhone 第第第第第第 第第第第第第第第第第 縣 縣縣
  • date post

    19-Dec-2015
  • Category

    Documents

  • view

    235
  • download

    7

Transcript of 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに...

Page 1: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

第 6回 iPhoneアプリ勉強会〜画像の取得と処理〜

                      縣 禎輝

Page 2: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

2

はじめに

• カメラアプリを作成– 基盤となる Interface とアクションメソッドの作成– 画像の取得先の設定– 画像の表示と保存– 画像にエフェクトをかける

• 参考ウェブサイト– http://journal.mycom.co.jp/column/iphone/index.html

Page 3: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

3

アプリの基盤作成

• アクションシートの作成1. Interface Builder の作成2. アクションの実装3. メソッドとボタンの接続

Page 4: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

4

Interface Builder の作成

Step1. ToolBar をドラック&ドロップ

Page 5: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

5

Interface Builder の作成

Step2. インスペクタパネルで, Identifier を“ Camera” に指定

Page 6: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

6

Interface Builder の作成

Step3. カメラアイコンを中央に表示

Page 7: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

7

アクション(選択画面表示)の実装

Step1.ImageViewController.h の編集- アクションメソッドを作成

Page 8: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

8

アクション(選択画面表示)の実装

Step2.ImageViewController.m の編集- showImageSheet メソッドの実装

Page 9: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

9

メソッドの接続

• Interface Builder でメソッドとボタンを接続実行結果

Page 10: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

10

画像の取得先の設定

• 作成した選択ボタンのリンク先を設定– Photo Library   →  “ Photo Library” へ移動– Camera →   “ Camera の撮影画面”へ移動– Saved Photo →   “以前 Camera で撮影した画像”へ移動

Page 11: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

11

ボタンのリンク先を設定

Step1. imageViewController.h の編集 *詳しく– イメージピッカーを使用する

• 写真を撮るために使う機能• UIImagePickerController というクラスで使用可能

Page 12: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

12

ボタンのリンク先を設定

Step2. imageViewController.m の編集• ボタンが押されたときの処理

Page 13: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

13

画像の表示と保存

• リンク先から指定された画像を表示– 画像の取得– 描画範囲の指定– 画像のリサイズ

Page 14: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

14

画像の表示と保存

Step1. imageViewController.h の編集– 画像表示用のアウトレットを作成

Page 15: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

15

画像の表示と保存

Step2. imageViewController.m の編集• アウトレットの内容

Page 16: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

16

Interface Builder の編集

1. 画像表示用の描画領域を作成2. 描画領域とアウトレットを接続

実行結果

Page 17: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

17

画像にエフェクトをかける

• 画像の情報を取得し,エフェクトをかける– 画像の情報をビットマップデータとして取得

Page 18: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

18

画像にエフェクトをかける

Step1.ImageViewController.h の編集- Core Graphics: 画像のビットマップデータを取得可

能な API を持つ

Page 19: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

19

Step2.ImageViewController.m の編集- 画像の情報を取得し,エフェクトをかける

画像にエフェクトをかける

実行結果

Page 20: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

20

• 2値化の答え

Page 21: 第 6 回 iPhone アプリ勉強会 〜画像の取得と処理〜 縣 禎輝. はじめに カメラアプリを作成 – 基盤となる Interface とアクションメソッドの作成

21

おわりに

• カメラアプリを作成– 基盤となる Interface とアクションメソッドの作成– 画像の取得先の設定– 画像の表示と保存– 画像にエフェクトをかける

• 参考ウェブサイト– http://journal.mycom.co.jp/column/iphone/index.html