i os5 study

メディアテクノロジーラボ主催学生向けiPhoneアプリ勉強会（中級編）

2012/2/24

舩見高貴生チーフエンジニア/メディアテクノロジーラボ

筑波大学1988年卒　農林学類生物環境造成学主専攻

　～iOS5 & Xcode4.3でスマートに開発しよう！～

12年2月24日金曜日

～iOS5 & Xcode4.3でスマートに開発しよう！～アジェンダ

• 自己紹介

• MTLの紹介

• iOS5+Xcode4ショーケース+α

• Xcode4.3出ました

• ARC,StoryBoard,iCloud,AutomationTest,AirPlay

• iOS5概要とシェア

• 小話

• みなさんからの共有

自己紹介

フナミタカオ - エンジニア自己紹介

• 1988 入社 - リクルート国際VAN 技術サポート

• 1990 ケイコとマナブ営業

• 1994 エイビーロード制作システム

• 2000 原稿制作フレームワーク

• 2006 たたみラボ

• 2007 MTL - WebAPI、iOS、Android

• 1988 入社 - リクルート国際VAN 技術サポート

• 1990 ケイコとマナブ営業

• 1994 エイビーロード制作システム

• 2000 原稿制作フレームワーク

• 2006 たたみラボ

• 2007 MTL - WebAPI、iOS、Android

AppleScript

RB,.Net, Perl

Perl,PHP,Ruby

Perl,ObjC,Java

フナミタカオ - エンジニアブログ＆Twitter&Facebook

• はてな iRSS

• Twitter @iRSS

• Facebook takao.funami

• MTLブログ

• http://mtl.recruit.co.jp/

88年大学卒業筑波出身です

• 筑波大学　第二学群　農林学類

• 生物環境造成学主専攻

• イチゴの植物工場が卒論のテーマ

• 88当時、世の中はバブル黎明期でした

• ご縁あってリクルートに

メールなし、ネットなし、一太郎＆花子全盛期25年前、紙で情報をやり取りする時代

• パソコン通信はあった。

• コピー機もあった。１０円コピー

• 音声の電話回線をつかって、データを送信

• PC9800のパソコンで清書

• 一太郎 - ワープロ

• 花子 - 図表エディタ

コンピュータ博物館

http://museum.ipsj.or.jp/heritage/ichitaro.html

ポリプロピレンのおもちゃ箱http://monopoly.cocolog-nifty.com/blog/

2011/06/post-546f.html

パソコン通信の画面

電話線を使うので、音で通信していたモデム、音響カプラ

JAMJAMというミニコミ紙を作っていましたサークル活動

印刷屋さんで写植＆印刷12年2月24日金曜日

一部文字作成にワープロ使用

一行の液晶表示、プリンタ付き、紙は熱転写専用紙。

あれから24年iOSアプリの開発をやっています。

works1

ホットペッパーiPhone&Android APP

2009年秋 2011年春

works2

iPadアプリ-じゃらんシリーズ

2010年5月より、シリーズ５作12年2月24日金曜日

works3

はぴばる

2011年10月31日リリース12年2月24日金曜日

works4

リクルートWebサービス

• 17種類のWebサービス(WebAPI)の開発、運用を約3人で行っています。

• 月間６億リクエスト。リリースは6回/月程度。

• 毎週500行くらい書いてるかも

MTLとはメディアテクノロジーラボのリクルート内での役割

新領域学び領域ＨＲ領域住宅領域ＩＭＣ領域狭域領域

ライフステージ領域（人生の節目）

ライフスタイル領域（日常の消費）

情報誌

ＷＥＢ・

モバイル

新モデル

通販イベント

フリーペーパー

事業領域の拡大

プラットフォームの拡大

ＤＢ型サービスソリューション

新ﾋﾞｼﾞﾈｽﾓﾃﾞﾙ新メディア

リアル事業全国展開

情報誌/

Web/モバイル

新モデル

HR領域学び領域住宅領域 IMC領域狭域領域新領域

ライフステージ-人生の節目ライフスタイル-日常の生活

社会の変化・ITの発展にそって進化事業領域の拡大

新領域学び領域ＨＲ領域住宅領域ＩＭＣ領域狭域領域

ライフステージ領域（人生の節目）

ライフスタイル領域（日常の消費）

情報誌

ＷＥＢ・

モバイル

新モデル

通販イベント

事業領域の拡大

ＤＢ型サービスソリューション

新ﾋﾞｼﾞﾈｽﾓﾃﾞﾙ新メディア

リアル事業全国展開

情報誌/

Web/モバイル

新モデル

HR領域学び領域住宅領域 IMC領域狭域領域新領域

ライフステージ-人生の節目ライフスタイル-日常の生活

社会の変化・ITの発展にそって進化事業領域の拡大

2007-2011

MTLについて

• 2007年4月1設立今年５期目

• 技術調査研究～新規事業開発を行う「実証研究機関（R＆D）」

• テクノロジを源泉としたサービス企画・運営を行い、ネット分野における新しいビジネスモデルを創造する

シードを担うMTLはリクルートのR&D部門

事業開発カンパニー

アドオプティマイゼーション推進室 etc.

事業開発カンパニー人材/進学/住宅結婚/自動車ライフスタイルetc.アドオプティマイゼーション推

進室 etc.

事業開発カンパニー人材/進学/住宅結婚/自動車ライフスタイルetc.アドオプティマイゼーション推

進室 etc.

メディアテクノロジーラボ(MTL), リクルートインキュベーションパートナーズ（RIP）

etc.12年2月24日金曜日

プランナーとエンジニア強みを活かして協働する

WEB サービスの企画設計・プロデュース、ビジネスプランニングなど。新規事業の企画・戦略立案から、プロジェクトチームの立上げ、課題抽出、日々の P/L 収益管理まで幅広く

システム設計、アーキテクチャ設計、フレームワーク開発、システム開発など。WEB サービスの企画設計から技術視点・クリエイタ視点で参加し、実際にシステム開発・運用までを行う。サービス企画・ディレクション・インフラ管理もあり。

プランナー

エンジニア - Webアーキテクト

- Webプロデューサー

最近のMTLのサービス代表的なサービスをいくつか...

開発勉強会支援→決済機能付きイベント開催支援1.ATND →EventATND

O2Oアプリ - オンライン・ツー・オフライン2.ショプリエ

チェックインしてポイントためることでユーザーと商品のマッチングと来店促進を目指す 2月14日公開

これまで７回開催、今年も実施予定3.Mashup Award 7

MA は、開発者が新技術・新サービスに挑戦する年に１度のお祭りです。今年も、オープンな API やプラットフォーム、デバイスを存分に活用して頂いて、ちょっと先の未来の Web を見せてくれる作品を期待しています！

いまできることに取り組む4.Hack For Japan&復興支援

じゃらん　東北地方太平洋沖地震＜被災者支援プラン＞API

Hack For Japanみんなのわ、げんきのわ（NHK 報道局 × MTL コラボ）

どんなオフィス職場環境は？

MTLのオフィス/カフェコラボが生まれる/開発に集中できる

「MTL カフェ」社内外の勉強会などに使うイベントスペース。

「コンセントレーションスペース」開発者のための集中作業スペース。

電話設置なし。ノートPC用外付モニタ完備。12年2月24日金曜日

伊豆とか、三浦とか。温泉付きでもちろん合宿もします

座敷よりは腰にくるので、最近はテーブルを用意12年2月24日金曜日

iPhone案件たくさん大半はMac,iPhone率100%越え

iOS5+Xcode4ショーケース+α注目の便利機能、iTVの予感

XCode4.32月16日リリース

それほど影響ないですが、とまどうかも4.2と違い

• iOSのバージョンはかわらない

• AppStoreからインストールはこれまでどおり

• /Applications/Xcode.appにインストール

• インストーラなくなった

• /Developerもなくなった×

共存もできる模様古いXCodeの削除はオプションで

CommandLine ToolsやiOS4.3 SimulatorもDashCodeはオプションに

More Developper Tootlsからダウンロード

Preferences>Downloadから取得できるものもある

画面UIはかわらず復習

これでだけは、覚えたいXcode ショートカット

コマンド+数字左枠(ナビゲーター)

コマンド+Opt+数字右上(インスペクタ)

コマンド+Opt+Ctl+数字右下(ライブラリ)

コマンド+Shift+Y 下(デバッグ)

Ctl+数字ジャンプバー

ARC[iOS5 ] Retain,Releaseからの解放

retain or releaseを自動的にやってくれるAutomatic Reference Counting

• retain, release, autoreleaseのことは忘れる

• コンパイラが自動挿入。GCではない

• ただしmalloc/free,CF等は対象外

• 変数の初期化は自動的に行われる

• nilになるので、安全。nilのメソッドを呼んでも落ちないから

• 循環参照には、注意

ARC利用のルール

• retain, release, retainCount, or autoreleaseを呼び出さない。@selector(retain), @selector(release)もNG

• deallocでインスタンス変数の解放は不要。

[super dealloc]はNG

• CFRetain, CFReleaseはARCの対象外

• Cの構造体は使わないで、Objective-Cのクラスに

• NSAutoreleasePool のかわりに@autoreleasepoolを

すこし心配な事

• 外部ライブラリ(github等）がARCに非対応のものも多い。

• でも大丈夫、混在は可能。

• ビルド設定の、Build Phaseタブの、Compile

Sources 設定でコンパイルオプションに -fno-

objc-arcを入力すれば、ARC非対応のライブラリもARC環境で混在できる

__weak修飾子を使う循環参照をさける

@interface MTLList : NSObject{ MTLItem *_child;}- (void)setChild:(MTLItem *)obj;@end@implementation- (void)setChild:(MTLItem *)obj{ _child = obj;}@end

@interface MTLItem : NSObject{ MTLList *_parent;}

- (void)setParent:(MTLList *)obj;@end@implementation- (void)setChild:(MTLItem *)obj{ _parent = obj;}@end

{ MTLItem *a = [[MTLItem alloc] init]; MTLList *b = [[MTLList alloc] init]; [a setList:b]; [b setParent:a]; }

循環参照になる変数はデフォルトで__strong

MTLList_child

MTLItem_parent

__weak修飾子を使う循環参照をさける

@interface MTLList : NSObject{ MTLItem *_child;}- (void)setChild:(MTLItem *)obj;@end@implementation- (void)setChild:(MTLItem *)obj{ _child = obj;}@end

@interface MTLItem : NSObject{ MTLList __weak *_parent;}

- (void)setParent:(MTLList *)obj;@end@implementation- (void)setChild:(MTLItem *)obj{ _parent = obj;}@end

MTLList_child

MTLItem_parent

{ MTLItem *a = [[MTLItem alloc] init]; MTLList *b = [[MTLList alloc] init]; [a setList:b]; [b setParent:a]; }

循環参照にならない片方は__weakとする

参考書＆リファレンスARC

• Transitioning to ARC Release Notes

• https://developer.apple.com/library/ios/#releasenotes/ObjectiveC/RN-TransitioningToARC/Introduction/Introduction.html

• エキスパートObjective-Cプログラミング ― iOS/OS X

のメモリ管理とマルチスレッド

• 電子書籍：http://tatsu-zine.com/books/objc

• Amazon書籍 : http://amzn.to/xGuL2c

WWDC2011

ビデオ

詳細はぜひ、ビデオ+スライドで

iCloud[iOS5]OSX10.8ではMacでも本格対応

UIDocument,Key-ValueStore

• UIDocument

どんなクラスを使うのか

• UIDocument

• サブクラスを作って、データの読み書きを実装

• NSUbiquitousKeyValueStore（シンプル）NSUbiquitousKeyValueStore *keyStore = [[NSUbiquitousKeyValueStore alloc] init];

//保存[keyStore setString:@”Saved String” forKey:@"MyString"];[keyStore synchronize];

//読み出しNSString *storedString = [keyStore stringForKey:@"MyString"];

Storyboard[iOS5 ] ワイヤーとして流れがつかめるわかりやすさ。

画面の関連を見渡せるようになった。.xibから.storyboardに

• コントロール＋ドラッグで画面をつなぐ

• Segueで関連づけ

• 遷移アニメーションをカスタマイズ可能

• UITableView

• 固定セル作成可能

• UITableViewCellの編集が簡単に

Appearance [iOS5 ]一気に画面をカスタマイズ。「友達を探す」のようなアプリを簡単に実現

Tint color & BackgroundImage &etc

一気に雰囲気を変更できる

[[UINavigationBar appearance] setTintColor:color]

[[UINavigationBar appearance] setBackgroundImage:[UIImage imageNamed:@"skin_44"] forBarMetrics:UIBarMetricsDefault];

MTLAppearanceソースをつかってDemo

参考

• UIAppearance で色や画像を変える

• http://cocoadays.blogspot.com/2011/10/uiappearance.html

• WWDC Video

• 114_customizing_the_appearance_of_uikit_controls

iTVの予感[iOS4.3～]AppleTVと組み合わせてできる、iTVもどき

ミラーリングできるApple TV & iOSでバイス

別スクリーンとしても使えるUIScreen

- (void)viewDidLoad...

// 最後のスクリーンが外部ディスプレイ if ([[UIScreen screens] count] > 1) { [self prepareScreen:[[UIScreen screens] lastObject]]; }......}

- (void)prepareScreen:(UIScreen *)connectedScreen{

//外部ディスプレイのサイズでWindowを作る CGRect frame = connectedScreen.bounds; self.window2 = [[UIWindow alloc] initWithFrame:frame]; [self.window2 setScreen:connectedScreen]; self.window2.hidden = NO;......

}12年2月24日金曜日

参考AirPlay

• WWDC Video

• 406_airplay_and_external_displays_in_ios_apps

• サンプルコード

• ExternalDisplay

• https://developer.apple.com/library/ios/#samplecode/ExternalDisplay/Introduction/Intro.html#//apple_ref/doc/uid/DTS40010724

Automation + SenTest[Instruments] 画面操作を自動的に行えるツール

UnitTest はSenTest

UIの自動テストを行う

• SenTestを使った、自動テスト。

• 自動テストだが、UIが絡むとむずかしい

• Automation

• Javascriptで自動実行

• JavaScriptの記録もできるので、テストのひな形にできる

UnitTest

SenTest

Person

firstNamelastName

ageaddress

fullName

Instrumentsに追加Automation

テキスト

• HELP > Instruments New Features User Guide

• New Features in Instruments 4.2

UIPageViewManeger[iOS5]iBookのようなUIができちゃう

iBook風のアプリPage-Based Application

R25APIを利用した例ページめくりアニメーションを実現

サンプルソース：http://dl.dropbox.com/u/27096935/students/mybook.zip

参考：MTL主催　学生向けiPhoneアプリ勉強会（中級編）　～リクルート流アプリの創り方～　http://atnd.org/events/24249

UIPageViewController

page view

view view

FNSDataViewController

FNSRootViewController<UIPageViewControllerDele

spineLocationForInterfaceOrientation

(回転時の挙動)

FNSModelController<UIPageViewControllerDataSour

ce>(改ページ時）

Before ViewAfter View

Page Data(model)Page Data(model)@property pageData

@property dataObject

UIPageViewControllerがページごとにDataViewControllerを作成、破棄を繰り返

してページを表示している。12年2月24日金曜日

UITwitter[iOS5]Twitterアカウント管理はOS任せにできる

テキスト

ところで、iOS5のシェアは？i0S4の対応はどうしようか？

リクルートWebサービスへのリクエスト数から算出iOS5のシェアは6割強

iPhoneOS3 iOS4 iOS5

公開から4ヶ月でiOS5シェアは6割強(2012/2)

iOSバージョンシェア推移

10/5 10/7 10/9 10/11 11/1 11/3 11/5 11/7 11/9 11/11 12/1

iPhoneOS3 iOS4 iOS5

2010/5 ～2012/2のリクルートWebサービスへのリクエスト数から算出iPhoneOS3→iOS4の時は6ヶ月後に1:9になった。4→5は少し鈍い

1ヶ月後でiOS5 5割超えあるコミックアプリのiOSシェア

中村智武のCTO記-http://ameblo.jp/tomotaken/entry-11060841833.html iPhone向けコミック配信サービスのサーバーへのアクセスを元にした独自調べ

iPhone 4S発売及びiOS 5リリースから約一ヶ月後（集計期間11/11～11/17）のシェア内訳

いつかは、iOS5以上になるけれど...

いつまでiOS4対応すべきか？

• iOS5以上で使える..

• iCloud

• Newsstand

• iTunes U

• 友達を探す

• 通知センター

• Mountain Lion

• ARC

• StoryBoard

• Segue

• Custom Appearance

• TwitterAPI

• Table View Static Content

ARC,StoryBoardは非常に魅力的すぐにでもiOS5にしぼりたい12年2月24日金曜日

My Little Story自分の想いをコードで実現することについて、すこし、自分の体験を話します

2010/5/28 iPad日本公開同時発売iPadじゃらん

地図と記事の２画面12年2月24日金曜日

25years ago

アパート情報の地図

テキスト雲定規＋製図ペン+トレース用紙

地図別冊になりました

5years ago

2006年の想い位置と連動するサービスを...

携帯できる

地図と記事が連動

携帯できる

地図と記事が連動

しかし当時は、手頃なデバイスがなかった12年2月24日金曜日

1years ago

最適なデバイスの登場

最適なデバイスの登場+

最適なデバイスの登場じゃらんというコンテンツ

想いは形になります確認事項

• アイデアや想いはいつか形になるもの

Android,WindowsPhoneも含むiOSデバイスのすごさ

• 持ち運べる

• 常時接続

• プログラム可能

Thank You! 樹海の森ですが、とても面白い場所です。一緒に楽しみましょう！

i os5 study

Business

field study i

il japan studies i 11b -hit study ahrœd a ill japan study n...

print03* · human factors & intelligent manufacturing...

case study & policies and case study procedures i

kfinleywallace case study i

tag integrated multi-label music style...

global i study guide

cashmere science study session why should i study? how do i...

do 8= pt 6m qc gv tq;< - yaphank...

os5 - linux

os5-20071 chapter 5 cpu scheduling. os5-20072 outline basic...

i ct network study

torah study · web viewin this study i would like to study...

m&g katalog - komponente · osiguraÈi 5 x 20 mm.....os5...

study guide tax i

study strategies i

exam scheme - amie(i) study circle · study material for...

study report i

progression annuelle en svt- classe de...

traducciÓn volxi n1585ai g515 os5 nli1t5 2l 0i6