iPhoneアプリ入門者向けに行った勉強会の資料です。

1. プロ文.com 勉強会
Phase1
Yuki Urata
Hiroki Toyokawa

2. アウトライン
• プロフィール
• 本日作るiPhoneアプリ
• iPhoneアプリを作る方法
• Titanium Mobileの使い方
• Titanium Mobileによるプログラミング
• 地図アプリの作成
• iPhoneアプリの基礎
• APIリファレンスの使い方
2 2012/07/14 プロ文.com 勉強会

3. プロフィール
• 浦田 祐輝
• プログラミング歴：10年以上!!
• 使用可能言語：主要言語全て
• 得意言語はC
• 豊川 弘樹
• プログラミング歴：5年
• 使用可能言語：おおよその主要言語
• 得意言語はJavaScript
3 2012/07/14 プロ文.com 勉強会

4. 本日作るiPhoneアプリ
4 2012/07/14 プロ文.com 勉強会

5. iPhoneアプリを作る方法
Xcode
Titanium Mobile
HTML 5
5 2012/07/14 プロ文.com 勉強会

6. 各開発環境の特徴
開発言語 メリット デメリット
現状ほぼiPhoneアプリだ
純正品
ObjectiveC デバッガが充実
けのためにObjCを学ぶ
必要がある
サードパーティ製のた
言語的なハードルが
JavaScript 低い
めiOSバージョンアップ
に追いつかないことも
通信が必要なためネイ
HTML, CSS Web開発と同じ ティブアプリほどきび
JavaScript きび動かないことも
6 2012/07/14 プロ文.com 勉強会

7. プロジェクト作成
選択
7 2012/07/14 プロ文.com 勉強会

8. プロジェクト名入力
App ID入力
iPhoneのみチェック
クリックして作成
8 2012/07/14 プロ文.com 勉強会

9. クリックして
Project Explorerを表示
9 2012/07/14 プロ文.com 勉強会

10. 早速動かしてみましょう!!
① クリック
② iPhone Simulatorを選択
10 2012/07/14 プロ文.com 勉強会

11. Titaniumへようこそ!
11 2012/07/14 プロ文.com 勉強会

12. Titanium Mobileの使い方
ファイル一覧 コードを書くエリア
デバッグ用エリア
12 2012/07/14 プロ文.com 勉強会

13. app.jsが超重要!!
app.js
Titanium Mobileでは起動時にapp.jsが
自動的に読み込まれる。
つまり、ここにコードを書いていけば良い。
13 2012/07/14 プロ文.com 勉強会

14. コードを書いてみましょう
app.js
元からあったコードは
/* ~ */で囲ってコメント
アウトします。
14 2012/07/14 プロ文.com 勉強会

15. 実行すると...
15 2012/07/14 プロ文.com 勉強会

16. コード解説
iPhoneのWindowを作り、win
という名前の変数に格納
Windowの背景色をカラーコー
ドで指定 (オレンジ色)
作成したWindowを開く(起動)
16 2012/07/14 プロ文.com 勉強会

17. JavaScriptの復習
• JavaScriptとJavaの違いって？
• 両者は全く別の言語
• JavaScript(JS)はブラウザ上で動く言語として、
JavaはOSに依らない言語として開発された。
• プログラミングと言えばよくオブジェクト指
向という言葉を耳にするけど...？
• JavaScriptは関数型言語と呼ばれ、オブジェクト指
向型言語ではありません。
17 2012/07/14 プロ文.com 勉強会

18. JavaScriptのデバッグ
alertを追加
18 2012/07/14 プロ文.com 勉強会

19. alertデバッグ
19 2012/07/14 プロ文.com 勉強会

20. alertデバッグって何に使うん？
hogeってなんだっけ...？
20 2012/07/14 プロ文.com 勉強会

21. alert「1だよ!」
「知ってた」
21 2012/07/14 プロ文.com 勉強会

22. いよいよMapを使ってみましょう
22 2012/07/14 プロ文.com 勉強会

23. 23 2012/07/14 プロ文.com 勉強会

24. コード解説
マップに立てるピンを作成
マップビューを作成
マップに作成したピンを追加
マップビューをWindowに追加
24 2012/07/14 プロ文.com 勉強会

25. iPhoneアプリの基礎
Window
View
Label, Buttonなどのアイテムは
Label
Windowの上に直接置かずに、
必ずViewの上に置く。
Button
25 2012/07/14 プロ文.com 勉強会

26. APIリファレンスの使い方
• http://docs.appcelerator.com/titanium/2.1/#!/api
「発見!」
26 2012/07/14 プロ文.com 勉強会

27. まずは例を見る
これは補足説明
サンプルコード
「ほう...」
27 2012/07/14 プロ文.com 勉強会

28. コピペして動かしてみる
変数名の変更をお忘れなく!
サンプルコード オリジナル
window win
28 2012/07/14 プロ文.com 勉強会

29. 29 2012/07/14 プロ文.com 勉強会

30. 少し変えて動かしてみる
値を変えてみる
30 2012/07/14 プロ文.com 勉強会

31. 「伸びただと...!?」
31 2012/07/14 プロ文.com 勉強会

32. Enjoy Your Programming Life!!
32 2012/07/14 プロ文.com 勉強会

33. 以上です。
ありがとうございました。
33 2012/07/14 プロ文.com 勉強会

34. 次回は...
• PHPとMySQLを使ったサーバサイドプログラミング
• 今回作成した地図アプリとサーバとの連携
みたいなことを浦田さんがやってくれるはず...
しかし浦田さんは僕の10倍多忙です。
34 2012/07/14 プロ文.com 勉強会

35. 参考URL
• Titanium SDK APIリファレンス(本家)
http://docs.appcelerator.com/titanium/2.1/#!/api
• Titanium SDK APIリファレンス(日本語wiki)
http://code.google.com/p/titanium-mobile-doc-ja/w/list
• titanium-mobile-doc-ja / MapView
http://code.google.com/p/titanium-mobile-doc-ja/wiki/MapView
• appcelerator / KitchenSink
Titaniumのベストプラクティス。Titaniumを本気でやりたい方はどうぞ。
https://github.com/appcelerator/KitchenSink/
35 2012/07/14 プロ文.com 勉強会