【Techbuzz】titanium資料

3,677 views

Published on

2012-10-31

Published in: Technology
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,677
On SlideShare
0
From Embeds
0
Number of Embeds
1,802
Actions
Shares
0
Downloads
11
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

【Techbuzz】titanium資料

  1. 1. Titaniumアプリを作ってみて (ゲームじゃなくてゴメンナサイ) !前田 洋平 2012/10/31@techbuzz12年10月30日火曜日
  2. 2. Agenda Titaniumについて 開発事例 開発環境 Titanium x Android = 脳トレ? Titanium♡iOSじゃないところ まとめ12年10月30日火曜日
  3. 3. 自己紹介 前田 洋平 Excite Japan スマートフォン推進室 (明日でちょうど1年!) Facebook: http://facebook.com/yohei.maeda.11 Twitter: @ArubaitoShain 言語 Java, PHP, JS, CoffeeScript, (Objective-C) アプリ スマホブックマーク(Android/iOS)/Stella(iOS)/LEC for au(Android) 最近のはまりもの LOST(洋ドラ)、RAIZIN12年10月30日火曜日
  4. 4. 宣伝 エキサイトエンジニアブログ始めました! http://blog.excite.co.jp/spdev エキサイト美人デザイナーブログ http://blog.excite.co.jp/spdesign 弊社アプリはこちら http://apps.excite.co.jp/ 日本Androidの会秋葉原支部アド部 https://www.facebook.com/groups/174233412687542/12年10月30日火曜日
  5. 5. Titaniumについて12年10月30日火曜日
  6. 6. 概要 Appcelerator 社が作ってます http://www.appcelerator.com/ 最新版は2.1.3(2012/10/28現在) 基本無料です。開発実績豊富です。 開発言語はJavaScript    iOS Android iOSとの相性はバッチシ!!12年10月30日火曜日
  7. 7. 拡張性 Module Java, Objective-Cで作成し、Titaniumに組み込む ことで、標準で使用出来る以外の機能を実装出来る。 設定ファイル 自作した設定ファイル(info.plist, Manifest.xml) を所定の場所に置くことでビルド時に優先的に選択し、 設定 (URL Scheme) を追加出来る。12年10月30日火曜日
  8. 8. 実装方法 1Window 1File それぞれはrequire(CommonJS)により読み込む UIのStyleは別ファイル管理 JSS(JavaScriptStyle)があるが、使いづらいのでオブ ジェクトとして定義する グローバルイベント Window間の値の受け渡しなどはグローバルイベントを発生 させて行う。12年10月30日火曜日
  9. 9. 開発事例12年10月30日火曜日
  10. 10.  沖縄で使えるクーポン12年10月30日火曜日
  11. 11.  屋久島・奄美諸島で使えるクーポン12年10月30日火曜日
  12. 12. AppBankさんにも紹介いただきました! http://www.appbank.net/2012/08/12/ iphone-application/450291.php 屋久島・奄美諸島で使えるクーポン: ダイビングや 登山、レンタカーまで!無料12年10月30日火曜日
  13. 13. その他情報 開発期間:学習期間含め約1.5ヶ月 開発コストは低め もっと色々(MVCとか)取り入れて見たかったけ ど、パートナーとの関係もあり、期日を優先。12年10月30日火曜日
  14. 14. 開発環境12年10月30日火曜日
  15. 15. 開発環境 Titanium Studio Eclipseを基として作られたTitanium用IDE CoffeeScript CoffeeScriptはプログラミング言語のひとつである。コードは JavaScriptのコードに変換される。(by wikipedia) underscore.js JavaScriptのユーティリティライブラリーだよ Guard ソースコードを監視し、変更があった時点で特定の処理を走らせてくれ る。12年10月30日火曜日
  16. 16. Titanium Studio Titaniumでアプリを作るときのIDE Androidのリリース用APKファイルの作成 iOSのAdHoc作成、submitのサポート12年10月30日火曜日
  17. 17. underscore.js http://underscorejs.org/ JavaScript用ユーティリティライブラリー 配列、関数、オブジェクトの扱いちょい楽に 個人的にはロゴが好み。 メソッドチェインを実現できる。 (_.chain(arry) .sort(sortfunc(obj)) .value())12年10月30日火曜日
  18. 18. CoffeeScript http://coffeescript.org/ JavaScriptに対してコードの量が約1/3になる コンパイルし、JSに変換される 書いてるだけで、ナウい感じに12年10月30日火曜日
  19. 19. guard ruby製 ソースコードを監視し、変更があった時点で特定の処理 を走らせてくれる。 coffeescriptの自動コンパイル環境として使用した。 用途 テスト、コンパイル etc...12年10月30日火曜日
  20. 20. Prj guard監視 coffee Database.coffee 保存 コンパイル ui Window1.coffee Resource Database.js ui JSに Window1.js 同階層で作られる12年10月30日火曜日
  21. 21. Titanium x Android = 脳トレ?12年10月30日火曜日
  22. 22. 脳トレってwwww 出典:http://www.nintendo.co.jp/3ds/asrj/top/img/top_img_professor.png12年10月30日火曜日
  23. 23. iOSでは実装した通りの動きをすることが多い が、Androidはところどころトラップがある! ハマった事例をいくつか、、、 解決にはちょっとしたひねりが必要なものも12年10月30日火曜日
  24. 24. 問題1 今選択中のタブオブジェクトが取れない12年10月30日火曜日
  25. 25. コレ12年10月30日火曜日
  26. 26. 問題1 内容 現在開いているタブオブジェクトを取得してゴニ ョゴニョ使用したい。TitaniumのAPIで用意さ れているcurrentTabというプロパティがある が、取得できない。むむっ12年10月30日火曜日
  27. 27. 問題1 解答 自前でグローバル変数として設定する。12年10月30日火曜日
  28. 28. 問題1 実装例 focusイベント取得 var tabGroup = Ti.UI.createTabGroup(); tabGroup.addEventListener(focus, function(e) { tabGroup._activeTab = e.tab; tabGroup._activeTabIndex = e.index; if (tabGroup._activeTabIndex === -1) { return; } Ti.API._activeTab = tabGroup._activeTab; }); グローバルとして設定12年10月30日火曜日
  29. 29. 問題2 Tab選択が変更された時の Eventが取れない12年10月30日火曜日
  30. 30. 問題2 内容1 通常、Tabで選択された場合、各Windowの Focusイベントを取ればいい。 だが、タブがない画面(次ページ参照)に移動し 再度タブ画面に戻った場合、Focusイベントが取 得できない。12年10月30日火曜日
  31. 31. 問題2 内容2 一覧画面 詳細画面 クリップ画面 (tab有) (tab無) (tab無)12年10月30日火曜日
  32. 32. 問題2 解答 TabのFocusが変わった場合、その Tab(Window)に対してグローバルイベントを発 生させて上げる!12年10月30日火曜日
  33. 33. 問題2 実装例 var clipWindow = Ti.UI.createWindow(); window作成 clipWindow.tag = clip; tag設定 Ti.App.addEventListener(clip:load, function(e) { loadData(); }); グローバル var tabGroup = Ti.UI.createTabGroup(); イベント付加 tabGroup.addEventListener(focus, function(e) { var win; tabGroup._activeTab = e.tab; tabGroup._activeTabIndex = e.index; if (tabGroup._activeTabIndex === -1) { グローバル return; } Ti.API._activeTab = tabGroup._activeTab; イベント発生 if ( _u.isAndroid()) { Ti.App.fireEvent(tabGroup._activeTab.tag + ":load"); win = self._activeTab.window; } });12年10月30日火曜日
  34. 34. 問題3 TableViewSectionをカスタムして使うと 表示順がバグる12年10月30日火曜日
  35. 35. 問題3 内容1 iOSではよくある実装のSection。 TitaniumのAPIとしてAndroidもサポートされ ている。12年10月30日火曜日
  36. 36. 問題3 内容2 Androidのデフォルトの Sectionだと、ダサいし 見にくい! ちょっとカスタムする。 (カスタムするにもちょっ とゴニョゴニョする必要が あります。今回は端折り ます)12年10月30日火曜日
  37. 37. 問題3 内容3 入れ替ってる! 正(section不使用) 誤(section使用)12年10月30日火曜日
  38. 38. 問題3 解答 Sectionを使うと、バグが出るから、Section に似せたRowを使えばいいんじゃね。 てか、そもそもAndroidにデフォルトで Sectionって考え方無いし。12年10月30日火曜日
  39. 39. 問題3 解答 SectionぽいRow Row Row SectionぽいRow Row Row12年10月30日火曜日
  40. 40. Titanium♡iOSじゃないところ12年10月30日火曜日
  41. 41. Titanium 2.1.0以上でScrollViewが ちょっと残念に ScrollViewが横にもス ライドするようになっ た。。。 (2.0.x系では大丈夫だ った)12年10月30日火曜日
  42. 42. XcodeとTitaniumStudioの関係 Xcodeをversion upすると、 TitaniumStudioでAdHocの作成、アプリ Submitができなくなる場合があります。 Xcode最新版にしてみて、できなかったらXcode のバージョンを戻して再度実行しましょう。12年10月30日火曜日
  43. 43. まとめ12年10月30日火曜日
  44. 44. Titanium導入する?しない?12年10月30日火曜日
  45. 45. Java12年10月30日火曜日
  46. 46. Objective-C12年10月30日火曜日
  47. 47. JavaScript12年10月30日火曜日
  48. 48. Android/iOS両 OS対応だ!12年10月30日火曜日
  49. 49. Android && 脳トレ♡12年10月30日火曜日
  50. 50. Android && 忍耐力あんぞ!12年10月30日火曜日
  51. 51. まとめ(全体編) 基本使用料無料! TitaniumStudio Eclipseライクで使いやすい オブジェクトの型とか無いし coffee美味しいし 開発コスト低い! Pushもできるよ!(まだやってないけどw12年10月30日火曜日
  52. 52. まとめ(対iOS編) iOSアプリは高クオリティで出来るよ! Xcodeのversionとか気をつけて! 不意にあげちゃダメ絶対!キリッ なんかScrollView変。実装悪いのかなぁ12年10月30日火曜日
  53. 53.  まとめ(対Android編) Android対応でネイティブとトントンぐらいの時間がかかる可能性 がある。 レイアウトがっつりやるやら、draw9patchとかネイティブ用スキ ルがいる。画像ボケるの覚悟。 (ネイティブでさえレイアウトつら(ry 脳トレになっていい レイアウト凝らないなら全然OK! 必須スキル:忍耐力12年10月30日火曜日
  54. 54. 今後的な moduleには夢があって、今後どんどん無料のも のがGitHub等で増えて来てくれるとどんどん Titanium周りが熱くなるのでは! ノウハウ貯めるためUtilsとかCommonUIとか自 分でLib作ってAndroidとiOSの差を埋めよー 社内ツールならTitaniumで十分12年10月30日火曜日
  55. 55. ご清聴 ありがとう ございました12年10月30日火曜日

×