Mtl主催i os勉強会中級編in筑波

メディアテクノロジーラボ主催
学生向けiPhoneアプリ勉強会（中級編）
∼iOS5 & Xcode4.3でスマートに開発しよう！∼

2012/2/20

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

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

12年2月22日水曜日

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

• 自己紹介

• MTLの紹介

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

• Xcode4.3出ました

• ARC,StoryBoard,iCloud,AutomationTest,AirPlay

• iOS5概要とシェア

• 小話

• みなさんからの共有


自己紹介


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

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

• 1990 ケイコとマナブ営業 DTP

• 1994 エイビーロード制作システム AppleScript
• 2000 原稿制作フレームワーク RB,.Net, Perl
• 2006 たたみラボ Perl,PHP,Ruby
• 2007 MTL - WebAPI、iOS、Android Perl,ObjC,Java


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

• はてな iRSS

• Twitter @iRSS

• Facebook takao.funami

• MTLブログ

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


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

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

• 生物環境造成学主専攻

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

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

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


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

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

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

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

• PC9800のパソコンで清書

• 一太郎 - ワープロ

• 花子 - 図表エディタポリプロピレンのおもちゃ箱
http://monopoly.cocolog-nifty.com/blo
2011/06/post-546f.html
コンピュータ博物館
http://museum.ipsj.or.jp/heritage/ichitaro.html


パソコン通信の画面


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


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

印刷屋さんで写植＆印刷

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

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


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


ホットペッパーiPhone&Android APP
works1

2009年秋 2011年春


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

2010年5月より、シリーズ５作

はぴばる
works3

2011年10月31日リリース

リクルートWebサービス
works4

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

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

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


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


社会の変化・ITの発展にそって進化
事業領域の拡大
事業領域の拡大
ライフステージ領域ライフスタイル領域
（人生の節目）
ライフステージ-人生の節目（日常の消費）
ライフスタイル-日常の生活
プラットフォームの拡大

ＨＲ領域学び領域住宅領域ＩＭＣ領域狭域領域
HR領域学び領域住宅領域 IMC領域狭域領域新領域
新領域
情
プラットフォームの拡大

フ報
リ誌
情報誌/
ー
フリー
ペ
ー
ペーパー
パ
ー
モＷ
Web/
バＥ
モバイル新ﾋﾞｼﾞﾈｽﾓﾃﾞﾙ
イＢ新メディア
ル・
イベント
新通販
モ
新モデル 5
デＤＢ型サービス
MTL
ソリューション
ルリアル事業全国展開


MTLについて
2007-2011

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

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

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


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

カンパニー
事業開発人材/進学/住宅
結婚/自動車
アドオプティマイゼーション推ライフスタイルetc.
進室 etc.
R&D
メディアテクノロジーラボ(MTL),
リクルートインキュベーションパートナーズ（RIP）
etc.

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

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

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


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


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

Exit


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

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

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

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

4.Hack For Japan&復興支援
いまできることに取り組む
みんなのわ、げんきのわ（NHK 報道局 × MTL コラボ）
Hack For Japan

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

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


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

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

「コンセントレーションスペース」
開発者のための集中作業スペース。
電話設置なし。ノートPC用外付モニタ完備。

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

座敷よりは腰にくるので、最近はテーブルを用意

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


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


XCode4.3
2月16日リリース


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

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

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

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

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

/Developerもなくなった
×

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


DashCodeはオプションに
CommandLine ToolsやiOS4.3 Simulatorも
More Developper Tootlsから
ダウンロード

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


復習
画面UIはかわらず


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

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

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

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

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

Ctl+数字ジャンプバー


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


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

• 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 MTLList MTLItem
- (void)setChild:(MTLItem *)obj{ _child _parent
_child = obj;
}
@end

@interface MTLItem : NSObject{
MTLList *_parent; {
} MTLItem *a = [[MTLItem alloc] init];
MTLList *b = [[MTLList alloc] init];
- (void)setParent:(MTLList *)obj;
@end [a setList:b];
@implementation [b setParent:a];
- (void)setChild:(MTLItem *)obj{ }
_parent = obj;
}
@end
循環参照になる
変数はデフォルトで__strong

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

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

@interface MTLItem : NSObject{
MTLList __weak *_parent; {
} MTLItem *a = [[MTLItem alloc] init];
MTLList *b = [[MTLList alloc] init];
- (void)setParent:(MTLList *)obj;
@end [a setList:b];
@implementation [b setParent:a];
- (void)setChild:(MTLItem *)obj{ }
_parent = obj;
}
@end
循環参照にならない
片方は__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];


Demo
MTLAppearanceソースをつかって


参考

• UIAppearance で色や画像を変える

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

• WWDC Video

• 114_customizing_the_appearance_of_uikit_contro
ls


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;
......

}

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] 画面操作を自動的に行えるツール


UIの自動テストを行う
UnitTest はSenTest

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

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

• Automation

• Javascriptで自動実行

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


SenTest
UnitTest

Person

ﬁrstName
lastName
age
address

fullName


Automation
Instrumentsに追加


テキスト

• HELP > Instruments New Features User Guide

• New Features in Instruments 4.2


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


Page-Based Application
iBook風のアプリ


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

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

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


UIPageViewController

FNSRootViewController
<UIPageViewControllerDele
gate> page view
spineLocationForInterfaceOr
ientation UIPageViewController
(回転時の挙動)

view view

FNSModelController<UIPa
geViewControllerDataSour
ce>
(改ページ時）
FNSDataViewController
Before View
After View @property
dataObject

UIPageViewControllerがページごとに
FNSDataViewController
Page@property
PageData(model)
Data(model) DataViewControllerを作成、破棄を繰り返
pageData @property
dataObject
してページを表示している。

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


テキスト


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


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

iPhoneOS3 iOS4 iOS5

1%

37%

62%


iOSバージョンシェア推移
公開から4ヶ月でiOS5シェアは6割強(2012/2)

iPhoneOS3 iOS4 iOS5
100%
90%
80%
70%
60%
50%
40%
30%
20%
10%
0%
10/5 10/7 10/9 10/11 11/1 11/3 11/5 11/7 11/9 11/11 12/1
2010/5 ∼2012/2のリクルートWebサービスへのリクエスト数から算出
iPhoneOS3→iOS4の時は6ヶ月後に1:9になった。4→5は少し鈍い

あるコミックアプリのiOSシェア
1ヶ月後でiOS5 5割超え
iPhone 4S発売及びiOS 5リリースから約一ヶ月後（集計期間11/11∼11/17）のシェア内訳

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


いつまでiOS4対応すべきか？
いつかは、iOS5以上になるけれど...

• iOS5以上で使える..

• iCloud
• ARC
• Newsstand
• StoryBoard
• iTunes U
• Segue
• 友達を探す
• Custom Appearance

• 通知センター • TwitterAPI

• Mountain Lion • Table View Static Content

ARC,StoryBoardは非常に魅力的すぐにでもiOS5にしぼりたい

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


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

地図と記事の２画面

25years ago


アパート情報の地図


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


地図別冊になりました


Now


5years ago


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

携帯できる

地図と記事が連動

しかし当時は、手頃なデバイスがなかった

1years ago


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

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

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

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


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

• 持ち運べる

• 常時接続

• プログラム可能


Mtl主催i os勉強会中級編in筑波

Recommandé

Recommandé

Contenu connexe

Similaire à Mtl主催i os勉強会中級編in筑波

Similaire à Mtl主催i os勉強会中級編in筑波 (20)

Dernier

Dernier (8)

Mtl主催i os勉強会中級編in筑波