【コラム】
実践! iPhoneアプリ開発
1 カメラアプリの作り方(1) - イメージピッカーのためのアクションシートを作る
2009/01/26
App Storeに登録できるiPhoneアプリを作るために
iPhoneが登場して半年が経った。iPhoneの魅力は、デバイスとしての機能だけでなく、同時に登場したApp Storeにもあるだろう。日々新しいiPhone向けアプリケーションが登場し、その数は1万5000本を突破した。
iPhone向けアプリを作成してApp Storeに登録してみたい、と考える開発者は多くいるだろう。だが、開発に関する情報は、特に日本語のものは、絶望的に少ないのが現状だ。アプリ開発の最初の一歩の解説を行う書籍は、ようやく登場し始めた。だが、そこから先の、実際にユーザに使ってもらうためのアプリを作ろうとなると、もっと実践的な情報が欲しくなる。
そこで、具体的なiPhoneアプリの開発を解説する連載を始めたいと思う。この連載では、カメラアプリや、RSSリーダアプリといった、本当に使い物になるアプリを作りながら、必要となる知識を解説していく。ここで紹介するアプリをベースにして機能を拡張すれば、App Storeに登録するものを作り上げる事もできるだろう。
対象となる読者としては、すでにiPhoneアプリ開発の基礎を理解している人を想定している。プログラミング言語であるObjective-Cや、開発環境であるXcode、基礎的なフレームワークであるFoundationの開発などは、省略する。これらは、書籍などを使って学んでほしい※1。また、ここで公開するソースコードの著作権は筆者に属するが、それを明記すればいかように再利用しても構わない。
※1 本誌特集『iPhoneアプリケーション開発入門』や、連載『ダイナミックObjective-C』でもiPhoneアプリの開発方法やObjective-Cについて解説している。参考にしてほしい。
では、早速始めよう。最初に取り上げるのは、カメラアプリの作り方だ。
カメラアプリを作る
カメラアプリは、iPhoneのカメラを使って写真をとり、その画像に様々なエフェクトを加えたりするアプリだ。iPhoneアプリでも人気分野の1つで、App Storeに多くの種類のカメラアプリが登録されている。
アプリの仕様を考えてみよう。まずアプリにツールバーを配置して、カメラボタンを用意しておく。このボタンを押して写真を撮ればいいのだが、カメラを使って目の前の写真を撮りたい事もあれば、前に撮っておいた写真を読み込んで表示したい事もあるだろう。そこで、カメラボタンを押したらアクションシートを表示し、カメラを使うか、画像を読み込むかを選択できるようにしよう。
カメラを選択した場合は、写真を撮るモードになる。画像読み込みの場合は、リストから画像を選択する。そうやって画像が取得できたら、それをアプリで表示する。さらに、エフェクトをかけて、標準のカメラでは得られない画像を作り出す。
このようなアプリを作ってみよう。
アクションシートの表示
まず、Xcodeを起動して、新規プロジェクトを作ろう。プロジェクトのテンプレートは、今回はView-Based Applicationを選択した。プロジェクト名は「Camera」としておく。アプリケーションコントローラと、ビューコントローラが1つずつ作られる事になる。主にいじるのは、ビューコントローラの方だ。
アプリにツールバーを追加しよう。CameraViewController.xibファイルを開き、Inteface Builderに移動する。このビューに、ライブラリパレットからツールバーをドラッグ&ドロップで追加する。
このバーに、カメラボタンを作ろう。バーボタンアイテムを追加して、インスペクタパネルを使い、Identifierとして「Camera」を指定する。これで、カメラのアイコンが表示されるはずだ。さらに、このボタンを真ん中に配置しておこう。両脇に、フレキシブルな空白を挿入する事で、真ん中に持っていく事ができる。
次に、このボタンを押したときに呼び出される、アクションを追加する。カメラで撮影するか、画像を取り込むかを選択するアクションだ。この選択は、アクションシートを使って行うようにしよう。アクションシートはUIActionSheetというクラスを使うのだが、これを呼び出すクラスはUIActionSheetDelegateプロトコルに準拠しておくと便利だ。これも対応しておこう。
CameraViewController.hを開き、次のように編集する。
CameraViewController.h
@interface CameraViewController : UIViewController <UIActionSheetDelegate>
{
}
// アクション
- (IBAction)showCameraSheet;
@end
ポイントは、2箇所だ。まず、クラスの定義のところで、UIActionSheetDelegateプロトコロに準拠している。これにより、アクションシートを閉じたときに処理を行う事ができる。
そして、アクションシートを表示するためのメソッドを用意している。showCameraSheetという名前にしてみた。これを、ツールバーのカメラボタンから呼び出せばいい。Interface Builderに戻って、カメラボタンからの接続を行っておいてほしい。
続いて、CaemeraViewController.mで実装を行おう。次のメソッドを追加する。
CameraViewController.m
- (IBAction)showCameraSheet
{
// アクションシートを作る
UIActionSheet* sheet;
sheet = [[UIActionSheet alloc]
initWithTitle:@"Select Soruce Type"
delegate:self
cancelButtonTitle:@"Cancel"
destructiveButtonTitle:nil
otherButtonTitles:@"Photo Library", @"Camera", @"Saved Photos", nil];
[sheet autorelease];
// アクションシートを表示する
[sheet showInView:self.view];
}
- (void)actionSheet:(UIActionSheet*)actionSheet clickedButtonAtIndex:(NSInteger)buttonIndex
{
}
showCameraSheetでは、アクションシートの表示を行っている。まず、UIActionSheetクラスのインスタンスを作る。初期化メソッドには多くの引数が必要だが、順に、シートのタイトル、デリゲート、キャンセルボタンのタイトル、削除などを行うボタンのタイトル(色が変わる)、他のボタンのタイトル、を指定する。最後の、他のボタンのタイトルは、可変長引数になっているので、カンマで区切りながら必要な数だけ渡す。最後にnilを付けるのを忘れないでほしい。
もう1つ実装しているactionSheet:clickedButtonAtIndex:メソッドは、UIActionSheetDelegateで定義されているメソッドだ。このメソッドは、アクションシートでボタンをクリックしたときに呼び出される。このメソッドの中身は、次回に取り上げる。
ここまでのアプリを動作させて、アクションシートを表示させると、次のようになる。
次回は、カメラを使って撮影するためのコードを紹介しよう。
ここまでのソースコード: Camera-1.zip
提供:マイコミエージェント
マイコミエージェントではITエンジニア出身のキャリアコンサルタントで形成するIT専門のチームを編成し、キャリアに応じた専任コンサルタントがご相談を承ります。キャリアチェンジから市場価値の可能性、ご収入などの相談から面接のアドバイスまでお気軽にご相談ください。求人情報誌や転職情報サイトなどで一般に公開されていないような「急募求人案件」も随時ご紹介が可能です。まずはご登録ください!
関連記事
- 【特集】iPhoneアプリケーション開発入門[2008/12/24]
ヘッドライン
- ルネサス、RXファミリ第3弾としてモータ制御向け「RX62T」を製品化[07:00 2/10]エレクトロニクス
- Rambus、次世代携帯機器向けメモリ「モバイルXDR」を発表[21:16 2/9]エレクトロニクス
- Intel、基幹業務システム向け次世代プロセッサ「Itanium 9300」を発表[20:47 2/9]エレクトロニクス
- MicronとNanya、42nmプロセスを採用した2GビットDDR3を開発[20:07 2/9]エレクトロニクス
- ISSCC 2010 - 日立、1Gbpsあたり消費電力1mW以下のトランシーバ回路を開発[19:52 2/9]エレクトロニクス
- CSSを最適化する3つのツール[17:17 2/9]JavaScript / CSS / HTML
- TIOBEプログラミング言語人気 - Scratch/Erlang/Scala/JavaFX[17:17 2/9]プログラミング
- Microsoft、Red Hat Linuxサポートをひっそり追加[17:15 2/9]システム管理
- IBM、8コア/32MB eDRAM搭載の高速CPU「POWER7」を発表 - サーバも販売開始[17:02 2/9]サーバとストレージ
- 【レポート】UTM最新動向 - クラウドに耐えうる処理性能と管理性の強化が進む[14:42 2/9]セキュリティ





