SlideShare a Scribd company logo
1 of 32
カメラアプリ開発入門
(第2回)
AVFoundationを使った無音カメラアプリの作り方
2013/6/29 名古屋iPhone開発者勉強会
13年6月29日土曜日
大塚 崇(おおつか たかし)
DJ / フリーランスのエンジニア・プログラマ
ハンドル名: takatronix
Facebook/Twitter/Skype/LINE/Weibo -> takatronix
http://takatronix.com
趣味興味:旅行、語学、筋トレ、LEGO、FX、心理学、 
脳科学、宇宙
自己紹介
13年6月29日土曜日
リリースしたアプリ
セクシーミラー、SEXY SCAN、 放射能汚染
地図、和牛スキャン ...
(代表作)
セクシーミラー-編集不要の神自撮りアプリ
13年6月29日土曜日
http://sexymirror-app.com
2013/1リリース イギリスのiPhone総合で
10位に、現在42万ダウンロード
セクシーミラー-編集不要の神自撮りアプリ
13年6月29日土曜日
iOSカメラAPI
UIImagePickerController
AVFoundation.framework
iOS4から、標準のカメラUIを使わない
アプリが作れる
よくあるカメラのUI
非常に簡単だが自由がない
リアルタイムエフェクトはできない
実装は結構大変だがなんでもできる
13年6月29日土曜日
AVFoundationを扱うのはけっこう大変
初期化だけでもかなりめんどくさい
ので....
AVFoundationを超絶簡単に使
えるクラスをつくりました
13年6月29日土曜日
サンプルのプロジェクトを用意しました。
http://takatronix.com/tutorial/20130629.zip
13年6月29日土曜日
#import <UIKit/UIKit.h>
#import "CameraManager.h"
@interface ViewController : UIViewController
@property CameraManager* cameraManager; // カメラマネージャクラス
@property IBOutlet UIImageView* previewView; // プレビューを配置するビュー
@property IBOutlet UIImageView* captureview; // キャプチャ後のイメージ
@end
CameraManagerクラスの使い方
13年6月29日土曜日
初期化
- (void)viewDidLoad
{
[super viewDidLoad];
// カメラクラスを初期化
_cameraManager = CameraManager.new;
// プレビューレイヤを設定
[_cameraManager setPreview:_previewView];
}
13年6月29日土曜日
撮影
// 静止画撮影(シャッター音あり)
-(IBAction)photo:(id)sender{
[_cameraManager takePhoto:^(UIImage *image, NSError *error) {
_captureview.image = image;
}];
}
// ビデオイメージ取得(シャッター音なし)
-(IBAction)video:(id)sender{
_captureview.image = _cameraManager.rotatedVideoImage;
}
13年6月29日土曜日
カメラ制御
// バックカメラを使う
-(IBAction)back:(id)sender{
[_cameraManager useFrontCamera:NO];
}
// フロントカメラを使う
-(IBAction)front:(id)sender{
[_cameraManager useFrontCamera:YES];
}
// カメラ切り替え
-(IBAction)flip:(id)sender{
[_cameraManager flipCamera];
}
13年6月29日土曜日
ライト制御
// ライト切り替え
-(IBAction)light:(id)sender{
[_cameraManager lightToggle];
}
// ライトON
-(IBAction)lightOn:(id)sender{
[_cameraManager light:YES];
}
// ライトOFF
-(IBAction)lightOff:(id)sender{
[_cameraManager light:NO];
}
13年6月29日土曜日
こんな感じに簡単につかえます。
詳しい使い方はCameraManager.hを読んで
ください
13年6月29日土曜日
さっそく
コードを読みながら
理解しよう
13年6月29日土曜日
基本的なクラスを
ざっと解説
13年6月29日土曜日
AVCaptureSession
セッション管理をするクラス
入力と出力をつなぎ映像や音声の流
れを定義し、実行する
13年6月29日土曜日
AVCaptureInput
カメラ、マイクなどの入力デバイスの
データを受け取る
AVCaptureSessionにつなぐ
13年6月29日土曜日
AVCaptureDevice
カメラやマイクなどのデバイス
ライトをつけたり、フォーカスの制
御したりするときに使う
AVCaptureInputを作成するときに使う
13年6月29日土曜日
AVCaptureOutput
ファイルやバッファなどの出力
AVCaptureSessionにつなぐ
AVCaptureStillImageOutput 静止画
AVCaptureAudioDataOutput
AVCaptureVideoDataOutput
オーディオ
ビデオ
いろんなのありますw
13年6月29日土曜日
AVCaptureVideoPreviewLayer
プレビューを表示するCALayer
カメラの生のデータを表示できる
リアルタイムエフェクトしたい場合には
使えないが、表示は速い。
AVCaptureSessionにつなぐ
13年6月29日土曜日
AVCaptureConnection
入力と出力の接続状態の設定とか
も、もうやめて・・・ って感じですよねw
13年6月29日土曜日
AVCaptureSession
AVCaptureOutput
AVCaptureInput
AVCaptureInput
AVCaptureOutput
startRunningで開始
カメラの入力
画像化
13年6月29日土曜日
// デフォルトはバックカメラ
videoInput = [AVCaptureDeviceInput deviceInputWithDevice:self.backCameraDevice error:nil];
/////////////////////////////////////////////////
// キャプチャセッションの作成
/////////////////////////////////////////////////
! captureSession = AVCaptureSession.new;
[captureSession setSessionPreset:preset];
[captureSession addInput:videoInput];
!self.previewLayer = [[AVCaptureVideoPreviewLayer alloc] initWithSession:captureSession];
! [self.previewLayer setBackgroundColor:[[UIColor blackColor] CGColor]];
[self.previewLayer setVideoGravity:AVLayerVideoGravityResizeAspect];
[self setupImageCapture];
[self setupVideoCapture];
[captureSession startRunning];
セッションの作成、初期化
13年6月29日土曜日
カメラを変更するときなど接続を組み直すとき
CaptureSessionの変更
// カメラを有効化する
-(void)enableCamera:(AVCaptureDevicePosition)desiredPosition{
[captureSession stopRunning];
for (AVCaptureDevice *d in [AVCaptureDevice devicesWithMediaType:AVMediaTypeVideo]) {
if ([d position] == desiredPosition) {
[captureSession beginConfiguration];
videoInput= [AVCaptureDeviceInput deviceInputWithDevice:d error:nil];
for (AVCaptureInput *oldInput in [[_previewLayer session] inputs]) {
[captureSession removeInput:oldInput];
}
[captureSession addInput:videoInput];
[captureSession commitConfiguration];
break;
}
}
[captureSession startRunning];
}
[captureSession beginConfigration]
[captureSession commitConfiration]
入出力の切り替え
反映
13年6月29日土曜日
静止画の取得
AVCaptureStillImageOutput
CaptureSessionに接続した
AVCaptureStillImageOutputから
CMSampleBufferを取得
デバイスの向きに合わせたUImageに変換
-(void)takePhoto:(takePhotoBlock) block
表示
13年6月29日土曜日
動画の取得
AVCaptureVideoDataOutput
CaptureSessionに
AVCaptureVideoDataOutputを接続
CaptureSettion startRunning後
- (void)captureOutput:(AVCaptureOutput *)captureOutput
didOutputSampleBuffer:(CMSampleBufferRef)sampleBuffer
fromConnection:(AVCaptureConnection *)connection
が、ビデオのフレームの更新毎に呼ばれる
13年6月29日土曜日
画像データの表示までの流れ
CMSampleBuffer
CVImageBuffer
CGImage
UIImage
Core Media
CoreVideo
Core Graphics
UIKit
13年6月29日土曜日
取得画像の向き
デバイスの向きが縦でも横でも取得す
るビデオイメージは横向き固定
撮影時のデバイスの向きを記録し、画
像化するときに回転させること
CameraManager rotatedVideoImageを参照
13年6月29日土曜日
例題
プレビューレイヤを使わずに取得し
た画像をリアルタイムでモノクロ化
してみよう
*モノクロ化のコードは前回のチュートリアル
を参考に
http://takatronix.com/tutorial/20130525.zip
13年6月29日土曜日
プロジェクトとこのスライドはここから
落とせますよ。
http://takatronix.com/tutorial/20130629.zip
13年6月29日土曜日
takatronix検索
http://takatronix.com
13年6月29日土曜日
ありがとうございました
takatronix検索
http://takatronix.com
13年6月29日土曜日

More Related Content

What's hot

View customizeでユーザー/プロジェクトのカスタムフィールドを利用した個別カスタマイズの方法
View customizeでユーザー/プロジェクトのカスタムフィールドを利用した個別カスタマイズの方法View customizeでユーザー/プロジェクトのカスタムフィールドを利用した個別カスタマイズの方法
View customizeでユーザー/プロジェクトのカスタムフィールドを利用した個別カスタマイズの方法Asa Morino
 
Redmineでメトリクスを見える化する方法
Redmineでメトリクスを見える化する方法Redmineでメトリクスを見える化する方法
Redmineでメトリクスを見える化する方法Hidehisa Matsutani
 
Cinemachineで見下ろし視点のカメラを作る
Cinemachineで見下ろし視点のカメラを作るCinemachineで見下ろし視点のカメラを作る
Cinemachineで見下ろし視点のカメラを作るUnity Technologies Japan K.K.
 
SpringBootにおけるテンプレートエンジンの活用
SpringBootにおけるテンプレートエンジンの活用SpringBootにおけるテンプレートエンジンの活用
SpringBootにおけるテンプレートエンジンの活用iPride Co., Ltd.
 
Deterministic Simulation - What modern online games can learn from the Game B...
Deterministic Simulation - What modern online games can learn from the Game B...Deterministic Simulation - What modern online games can learn from the Game B...
Deterministic Simulation - What modern online games can learn from the Game B...David Salz
 
SteamVR Plugin 2.0 にアップデートした話
SteamVR Plugin 2.0 にアップデートした話SteamVR Plugin 2.0 にアップデートした話
SteamVR Plugin 2.0 にアップデートした話shohashimoto4
 
CEDEC 2016 Metal と Vulkan を用いた水彩画レンダリング技法の紹介
CEDEC 2016 Metal と Vulkan を用いた水彩画レンダリング技法の紹介CEDEC 2016 Metal と Vulkan を用いた水彩画レンダリング技法の紹介
CEDEC 2016 Metal と Vulkan を用いた水彩画レンダリング技法の紹介Drecom Co., Ltd.
 
Android™組込み開発基礎コース BeagleBoard編
Android™組込み開発基礎コース BeagleBoard編Android™組込み開発基礎コース BeagleBoard編
Android™組込み開発基礎コース BeagleBoard編OESF Education
 
【Unity道場】物理シミュレーション完全マスター
【Unity道場】物理シミュレーション完全マスター【Unity道場】物理シミュレーション完全マスター
【Unity道場】物理シミュレーション完全マスターUnity Technologies Japan K.K.
 
VFXGraphでつくろう素敵なARエフェクト In QBSLab on 2020.01.25
VFXGraphでつくろう素敵なARエフェクト In QBSLab on 2020.01.25VFXGraphでつくろう素敵なARエフェクト In QBSLab on 2020.01.25
VFXGraphでつくろう素敵なARエフェクト In QBSLab on 2020.01.25Shunsuke Ishimoto
 
Unreal Engine を用いた、駐車スペース検知のための学習データ生成
Unreal Engine を用いた、駐車スペース検知のための学習データ生成Unreal Engine を用いた、駐車スペース検知のための学習データ生成
Unreal Engine を用いた、駐車スペース検知のための学習データ生成Silicon Studio Corporation
 
전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017
전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017
전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017devCAT Studio, NEXON
 
【Unite Tokyo 2018】チームラボ × Unity ~Unityで制作するデジタルアートの世界~
【Unite Tokyo 2018】チームラボ × Unity ~Unityで制作するデジタルアートの世界~【Unite Tokyo 2018】チームラボ × Unity ~Unityで制作するデジタルアートの世界~
【Unite Tokyo 2018】チームラボ × Unity ~Unityで制作するデジタルアートの世界~UnityTechnologiesJapan002
 
Redmine issue assign notice plugin の紹介
Redmine issue assign notice plugin の紹介Redmine issue assign notice plugin の紹介
Redmine issue assign notice plugin の紹介onozaty
 
View customize pluginを使いこなす
View customize pluginを使いこなすView customize pluginを使いこなす
View customize pluginを使いこなすonozaty
 
UE4+Photonでネットワーク同期を行う
UE4+Photonでネットワーク同期を行うUE4+Photonでネットワーク同期を行う
UE4+Photonでネットワーク同期を行うShohei Yamamoto
 
【Unite 2018 Tokyo】60fpsのその先へ!スマホの物量限界に挑んだSTG「アカとブルー」の開発設計
【Unite 2018 Tokyo】60fpsのその先へ!スマホの物量限界に挑んだSTG「アカとブルー」の開発設計【Unite 2018 Tokyo】60fpsのその先へ!スマホの物量限界に挑んだSTG「アカとブルー」の開発設計
【Unite 2018 Tokyo】60fpsのその先へ!スマホの物量限界に挑んだSTG「アカとブルー」の開発設計UnityTechnologiesJapan002
 
[IGC 2017] 아마존 구승모 - 게임 엔진으로 서버 제작 및 운영까지
[IGC 2017] 아마존 구승모 - 게임 엔진으로 서버 제작 및 운영까지[IGC 2017] 아마존 구승모 - 게임 엔진으로 서버 제작 및 운영까지
[IGC 2017] 아마존 구승모 - 게임 엔진으로 서버 제작 및 운영까지강 민우
 
모바일 서비스 기획 시작하기
모바일 서비스 기획 시작하기모바일 서비스 기획 시작하기
모바일 서비스 기획 시작하기Jae-hyung Park
 

What's hot (20)

View customizeでユーザー/プロジェクトのカスタムフィールドを利用した個別カスタマイズの方法
View customizeでユーザー/プロジェクトのカスタムフィールドを利用した個別カスタマイズの方法View customizeでユーザー/プロジェクトのカスタムフィールドを利用した個別カスタマイズの方法
View customizeでユーザー/プロジェクトのカスタムフィールドを利用した個別カスタマイズの方法
 
Redmineでメトリクスを見える化する方法
Redmineでメトリクスを見える化する方法Redmineでメトリクスを見える化する方法
Redmineでメトリクスを見える化する方法
 
Cinemachineで見下ろし視点のカメラを作る
Cinemachineで見下ろし視点のカメラを作るCinemachineで見下ろし視点のカメラを作る
Cinemachineで見下ろし視点のカメラを作る
 
4조 졸업작품
4조 졸업작품4조 졸업작품
4조 졸업작품
 
SpringBootにおけるテンプレートエンジンの活用
SpringBootにおけるテンプレートエンジンの活用SpringBootにおけるテンプレートエンジンの活用
SpringBootにおけるテンプレートエンジンの活用
 
Deterministic Simulation - What modern online games can learn from the Game B...
Deterministic Simulation - What modern online games can learn from the Game B...Deterministic Simulation - What modern online games can learn from the Game B...
Deterministic Simulation - What modern online games can learn from the Game B...
 
SteamVR Plugin 2.0 にアップデートした話
SteamVR Plugin 2.0 にアップデートした話SteamVR Plugin 2.0 にアップデートした話
SteamVR Plugin 2.0 にアップデートした話
 
CEDEC 2016 Metal と Vulkan を用いた水彩画レンダリング技法の紹介
CEDEC 2016 Metal と Vulkan を用いた水彩画レンダリング技法の紹介CEDEC 2016 Metal と Vulkan を用いた水彩画レンダリング技法の紹介
CEDEC 2016 Metal と Vulkan を用いた水彩画レンダリング技法の紹介
 
Android™組込み開発基礎コース BeagleBoard編
Android™組込み開発基礎コース BeagleBoard編Android™組込み開発基礎コース BeagleBoard編
Android™組込み開発基礎コース BeagleBoard編
 
【Unity道場】物理シミュレーション完全マスター
【Unity道場】物理シミュレーション完全マスター【Unity道場】物理シミュレーション完全マスター
【Unity道場】物理シミュレーション完全マスター
 
VFXGraphでつくろう素敵なARエフェクト In QBSLab on 2020.01.25
VFXGraphでつくろう素敵なARエフェクト In QBSLab on 2020.01.25VFXGraphでつくろう素敵なARエフェクト In QBSLab on 2020.01.25
VFXGraphでつくろう素敵なARエフェクト In QBSLab on 2020.01.25
 
Unreal Engine を用いた、駐車スペース検知のための学習データ生成
Unreal Engine を用いた、駐車スペース検知のための学習データ生成Unreal Engine を用いた、駐車スペース検知のための学習データ生成
Unreal Engine を用いた、駐車スペース検知のための学習データ生成
 
전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017
전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017
전형규, 프로젝트DH의 절차적 애니메이션 시스템, NDC2017
 
【Unite Tokyo 2018】チームラボ × Unity ~Unityで制作するデジタルアートの世界~
【Unite Tokyo 2018】チームラボ × Unity ~Unityで制作するデジタルアートの世界~【Unite Tokyo 2018】チームラボ × Unity ~Unityで制作するデジタルアートの世界~
【Unite Tokyo 2018】チームラボ × Unity ~Unityで制作するデジタルアートの世界~
 
Redmine issue assign notice plugin の紹介
Redmine issue assign notice plugin の紹介Redmine issue assign notice plugin の紹介
Redmine issue assign notice plugin の紹介
 
View customize pluginを使いこなす
View customize pluginを使いこなすView customize pluginを使いこなす
View customize pluginを使いこなす
 
UE4+Photonでネットワーク同期を行う
UE4+Photonでネットワーク同期を行うUE4+Photonでネットワーク同期を行う
UE4+Photonでネットワーク同期を行う
 
【Unite 2018 Tokyo】60fpsのその先へ!スマホの物量限界に挑んだSTG「アカとブルー」の開発設計
【Unite 2018 Tokyo】60fpsのその先へ!スマホの物量限界に挑んだSTG「アカとブルー」の開発設計【Unite 2018 Tokyo】60fpsのその先へ!スマホの物量限界に挑んだSTG「アカとブルー」の開発設計
【Unite 2018 Tokyo】60fpsのその先へ!スマホの物量限界に挑んだSTG「アカとブルー」の開発設計
 
[IGC 2017] 아마존 구승모 - 게임 엔진으로 서버 제작 및 운영까지
[IGC 2017] 아마존 구승모 - 게임 엔진으로 서버 제작 및 운영까지[IGC 2017] 아마존 구승모 - 게임 엔진으로 서버 제작 및 운영까지
[IGC 2017] 아마존 구승모 - 게임 엔진으로 서버 제작 및 운영까지
 
모바일 서비스 기획 시작하기
모바일 서비스 기획 시작하기모바일 서비스 기획 시작하기
모바일 서비스 기획 시작하기
 

Similar to AVFoundationを使った無音カメラアプリの作り方

カメラアプリ開発入門3
カメラアプリ開発入門3カメラアプリ開発入門3
カメラアプリ開発入門3Takashi Ohtsuka
 
20130410 parseと国際化
20130410 parseと国際化20130410 parseと国際化
20130410 parseと国際化Takashi Ohtsuka
 
【Schoo web campus】拡張現実の最前線と未来の可能性
【Schoo web campus】拡張現実の最前線と未来の可能性【Schoo web campus】拡張現実の最前線と未来の可能性
【Schoo web campus】拡張現実の最前線と未来の可能性schoowebcampus
 
iPhoneカメラアプリ開発入門(第1回)
iPhoneカメラアプリ開発入門(第1回)iPhoneカメラアプリ開発入門(第1回)
iPhoneカメラアプリ開発入門(第1回)Takashi Ohtsuka
 
Crashlyticsでクラッシュ撲滅作戦
Crashlyticsでクラッシュ撲滅作戦Crashlyticsでクラッシュ撲滅作戦
Crashlyticsでクラッシュ撲滅作戦Yoichiro Sakurai
 
アプリ開発新時代!オープンデータを活用したお得な企画&プログラミングテクニック
アプリ開発新時代!オープンデータを活用したお得な企画&プログラミングテクニックアプリ開発新時代!オープンデータを活用したお得な企画&プログラミングテクニック
アプリ開発新時代!オープンデータを活用したお得な企画&プログラミングテクニックTaisuke Fukuno
 
第2回スマートフォン講座
第2回スマートフォン講座第2回スマートフォン講座
第2回スマートフォン講座Shinichi Kosaki
 
Location & Sencor base Augmented Reality / Jagat 2013-02-22
Location & Sencor base Augmented Reality  / Jagat 2013-02-22Location & Sencor base Augmented Reality  / Jagat 2013-02-22
Location & Sencor base Augmented Reality / Jagat 2013-02-22Etsuji Kameyama
 
#yidev 横浜 iPhone 勉強会 - 第16回 オープニング
#yidev 横浜 iPhone 勉強会 - 第16回 オープニング#yidev 横浜 iPhone 勉強会 - 第16回 オープニング
#yidev 横浜 iPhone 勉強会 - 第16回 オープニングTomohiro Kumagai
 

Similar to AVFoundationを使った無音カメラアプリの作り方 (9)

カメラアプリ開発入門3
カメラアプリ開発入門3カメラアプリ開発入門3
カメラアプリ開発入門3
 
20130410 parseと国際化
20130410 parseと国際化20130410 parseと国際化
20130410 parseと国際化
 
【Schoo web campus】拡張現実の最前線と未来の可能性
【Schoo web campus】拡張現実の最前線と未来の可能性【Schoo web campus】拡張現実の最前線と未来の可能性
【Schoo web campus】拡張現実の最前線と未来の可能性
 
iPhoneカメラアプリ開発入門(第1回)
iPhoneカメラアプリ開発入門(第1回)iPhoneカメラアプリ開発入門(第1回)
iPhoneカメラアプリ開発入門(第1回)
 
Crashlyticsでクラッシュ撲滅作戦
Crashlyticsでクラッシュ撲滅作戦Crashlyticsでクラッシュ撲滅作戦
Crashlyticsでクラッシュ撲滅作戦
 
アプリ開発新時代!オープンデータを活用したお得な企画&プログラミングテクニック
アプリ開発新時代!オープンデータを活用したお得な企画&プログラミングテクニックアプリ開発新時代!オープンデータを活用したお得な企画&プログラミングテクニック
アプリ開発新時代!オープンデータを活用したお得な企画&プログラミングテクニック
 
第2回スマートフォン講座
第2回スマートフォン講座第2回スマートフォン講座
第2回スマートフォン講座
 
Location & Sencor base Augmented Reality / Jagat 2013-02-22
Location & Sencor base Augmented Reality  / Jagat 2013-02-22Location & Sencor base Augmented Reality  / Jagat 2013-02-22
Location & Sencor base Augmented Reality / Jagat 2013-02-22
 
#yidev 横浜 iPhone 勉強会 - 第16回 オープニング
#yidev 横浜 iPhone 勉強会 - 第16回 オープニング#yidev 横浜 iPhone 勉強会 - 第16回 オープニング
#yidev 横浜 iPhone 勉強会 - 第16回 オープニング
 

AVFoundationを使った無音カメラアプリの作り方