Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
それでも	
  
TitaniumでiPhone,Android	
  
クロスプラットフォームを諦めない
2014.03.19	
  
日向強	
  @coffeegyunyu
*  このスライドはCoffeeScriptを多⽤用してます。
CoffeeScriptアレルギーの⼈人はご注意ください。
*  ここに出ているのはあくまで個⼈人の⽤用例例ですので、
「100%こうしたほうがいいよ」というものでは
ないのであしから...
自己紹介
⽇日向強
株式会社アールラーニング  
開発事業部  
モバイルのプロジェクト
(iOS,Android)を主にやってます
	
  
Titaniumでつくったもの
Font	
  Stamp	
  
⽂文字とフォントを組み合わせて各種SNSに
画像を送信するアプリ
ダウンロード数は33,000
Titanium3.2.0  使⽤用
https://play.google.c...
Titaniumでつくったもの
coe
声を使ったソーシャルレコーディングアプリ
声を録⾳音し、現在位置に声を置いておくことで、
他の⼈人が声を拾拾って聞くことができるアプリ
現在3000件ほど声が世界中においてあります
Titanium  3...
Titaniumの悪循環
Titaniumの悪循環
Titaniumで両⽅方作
れるらしいよ
コストダウン
できるのな
ら・・・
iOSでは動かない
Androidでもこの機能欲しい
if(OS_IOS)
If(OS_ANDROID)
もっと
もっと
iOS、Andro...
プロジェクト作成編
*  新規プロジェクト作成時は、絶対にTitanium	
  SDKを3.2.1
にしよう
プロジェクト作成編
なんで?
Titanium	
  3.1.3	
  Android Titanium	
  3.2.1	
  Android
*  Titanium  SDK  3.2.1だとデフォルトでAndroidの
UIのサイズが最適化されるよ(<property  
name=“ti.ui.defaultunit”  type=“string”>dp</
property>)...
*  新規プロジェクト
の選択について
画⾯面遷移が発⽣生する
アプリだとわかって
いる場合、
タブを使わなくても
Two-‐‑‒tabbed  Alloy  
Applicationのほうが
いい
プロジェクト作成編
*  画⾯面遷移の処理理⽅方法をiOS,Androidで統⼀一できるから
(iOSのNavigationWindowとか意識識しなくていい)
なんで?
#グローバルに現在のタブを保持	
  
$.index.addEventListener	
...
実際に画面遷移すると
iPhone
(前に戻るボタンが⾃自動付与)
Android	
  
(Backキーで戻れる)
Controller編
*  Android,iOSで明確に異なる記述で処理をする場合、
CoffeeScriptのクラスの機能を使用したほうが見通しやすい
Controller編
Controller編
#共通機能クラス部分
class	
  HogeWindowInplBase	
  
	
  	
  constructor:-­‐>	
  
	
  	
  hello:(e)-­‐>	
  
	
  	
  	
  ...
Controller編
iOS Android
UI編
*  まずは、どのOSでも使える部品のみを使って画面を組
み立てる  ドキュメントとにらめっこしましょう	
  
*  その上で、OS個別の部品を使いたくなったら、app/
view/{それぞれのOS}/{ファイル名}.xmlを作成する	
  ...
UI編
ファイル構成例	
  
└──	
  views	
  
	
  	
  	
  	
  ├──	
  UIWindow.xml	
  ←OS独自のビューが設定されていない場合	
  
	
  	
  	
  	
  ├──	
  in...
UI編
iOS/UIWindow.xml UIWindow.xml
<Alloy>	
  
	
  	
  	
  	
  <Window>	
  
	
  	
  	
  	
  	
  	
  	
  	
  <View	
  class=...
UI編
iOS Andoird
現在アールラーニング
では技術者を募集して
います
TitaniumやAndroid,iOSに限らず、
Java,Ruby,インフラetc…	
  
技術に自信のある方は、お気軽に	
  
t-­‐hyuga@r-­‐learning.co.j...
Upcoming SlideShare
Loading in …5
×

Titaniumもくもく20140319

174 views

Published on

  • Be the first to comment

  • Be the first to like this

Titaniumもくもく20140319

  1. 1. それでも   TitaniumでiPhone,Android   クロスプラットフォームを諦めない 2014.03.19   日向強  @coffeegyunyu
  2. 2. *  このスライドはCoffeeScriptを多⽤用してます。 CoffeeScriptアレルギーの⼈人はご注意ください。 *  ここに出ているのはあくまで個⼈人の⽤用例例ですので、 「100%こうしたほうがいいよ」というものでは ないのであしからず。 Caution
  3. 3. 自己紹介 ⽇日向強 株式会社アールラーニング   開発事業部   モバイルのプロジェクト (iOS,Android)を主にやってます  
  4. 4. Titaniumでつくったもの Font  Stamp   ⽂文字とフォントを組み合わせて各種SNSに 画像を送信するアプリ ダウンロード数は33,000 Titanium3.2.0  使⽤用 https://play.google.com/store/apps/details? id=jp.coe.fontstamp   https://itunes.apple.com/jp/app/ fontosutanpu-­‐wen-­‐zisutanpuga/id687721425? mt=8    
  5. 5. Titaniumでつくったもの coe 声を使ったソーシャルレコーディングアプリ 声を録⾳音し、現在位置に声を置いておくことで、 他の⼈人が声を拾拾って聞くことができるアプリ 現在3000件ほど声が世界中においてあります Titanium  3.2.0使⽤用 https://itunes.apple.com/jp/app/coe-‐‑‒ shengdetsunagaruapuri/id367895344?mt=8 https://play.google.com/store/apps/details? id=jp.coe.coe
  6. 6. Titaniumの悪循環
  7. 7. Titaniumの悪循環 Titaniumで両⽅方作 れるらしいよ コストダウン できるのな ら・・・ iOSでは動かない Androidでもこの機能欲しい if(OS_IOS) If(OS_ANDROID) もっと もっと iOS、Androidの分岐がいたる ところに⼊入ったメンテしづら いスパゲッティの出来上がり 各所各所でOSごとの分 岐を設けます ⼀一時的に要件は満たさ れます
  8. 8. プロジェクト作成編
  9. 9. *  新規プロジェクト作成時は、絶対にTitanium  SDKを3.2.1 にしよう プロジェクト作成編
  10. 10. なんで? Titanium  3.1.3  Android Titanium  3.2.1  Android
  11. 11. *  Titanium  SDK  3.2.1だとデフォルトでAndroidの UIのサイズが最適化されるよ(<property   name=“ti.ui.defaultunit”  type=“string”>dp</ property>) *  Titanium  SDK  3.2.1だと、Androidのデザインも かっちょよくなるよ(Theme.holo) なんで?
  12. 12. *  新規プロジェクト の選択について 画⾯面遷移が発⽣生する アプリだとわかって いる場合、 タブを使わなくても Two-‐‑‒tabbed  Alloy   Applicationのほうが いい プロジェクト作成編
  13. 13. *  画⾯面遷移の処理理⽅方法をiOS,Androidで統⼀一できるから (iOSのNavigationWindowとか意識識しなくていい) なんで? #グローバルに現在のタブを保持   $.index.addEventListener  "open",  (e)  -­‐>      Alloy.Globals.currentTab  =  e.source.activeTab  if  e?.source?.activeTab?   $.index.addEventListener  "focus",  (e)  -­‐>      Alloy.Globals.currentTab  =  e.tab  if  e?.tab?     clickMe  =  (e)-­‐>      nextwindow  =  Ti.UI.createWindow()      Alloy.Globals.currentTab.open  nextwindow  #ここで画面遷移   $.index.open()   app/controller/index.coffee
  14. 14. 実際に画面遷移すると iPhone (前に戻るボタンが⾃自動付与) Android   (Backキーで戻れる)
  15. 15. Controller編
  16. 16. *  Android,iOSで明確に異なる記述で処理をする場合、 CoffeeScriptのクラスの機能を使用したほうが見通しやすい Controller編
  17. 17. Controller編 #共通機能クラス部分 class  HogeWindowInplBase      constructor:-­‐>      hello:(e)-­‐>          alert  "hello"      thankyou:-­‐>          alert  "Thank  you"   #OSによって使用する継承クラスを決定 IMPL  =  if  OS_IOS  then  class  HogeWindowInplIos  extends  HogeWindowInplBase      hello:(e)-­‐>          alert  "hello  iOS"   else  if  OS_ANDROID  then  class  HogeWindowInplAndroid  extends  HogeWindowInplBase      hello:(e)-­‐>          alert  "hello  Android"     #コントローラ実装部 impl  =  new  IMPL()   clickHello  =  (e)-­‐>      impl.hello()  #ここはOSによって異なる clickThankyou  =  (e)-­‐>      impl.thankyou()  #ここはOS共通 app/controllers/HogeWindow.coffee
  18. 18. Controller編 iOS Android
  19. 19. UI編
  20. 20. *  まずは、どのOSでも使える部品のみを使って画面を組 み立てる  ドキュメントとにらめっこしましょう   *  その上で、OS個別の部品を使いたくなったら、app/ view/{それぞれのOS}/{ファイル名}.xmlを作成する   UI編
  21. 21. UI編 ファイル構成例   └──  views          ├──  UIWindow.xml  ←OS独自のビューが設定されていない場合          ├──  index.xml          └──  ios                  └──  UIWindow.xml  ←iOS独自のビュー
  22. 22. UI編 iOS/UIWindow.xml UIWindow.xml <Alloy>          <Window>                  <View  class="container">                          <Button  >hello</Button>                          <Button  >thankyou</Button>                  </View>          </Window>   </Alloy> <Alloy>          <Window>                  <Toolbar  class="container">                          <Items>                                  <Button  >hello</Button>                                  <Button  >thankyou</Button>                          </Items>                  </Toolbar>          </Window>   </Alloy>     ※iOSなので、せっかくだからToolbarを使いたい!
  23. 23. UI編 iOS Andoird
  24. 24. 現在アールラーニング では技術者を募集して います TitaniumやAndroid,iOSに限らず、 Java,Ruby,インフラetc…   技術に自信のある方は、お気軽に   t-­‐hyuga@r-­‐learning.co.jpまで!  

×