日手机商用java程序市场JavaScriでネイ

JavaScriptでネイティブiPhone/Androidアプリを作るグリー株式会社伊藤直也自己紹介伊藤直也(33)グリー株式会ソーシャルメディア統括部長プロデューサーiPhone/Android等やってますアジェンダiPhone/AndroidアプリをJavaScriptで作る普通のiPhone/Android開発の触りTitaniumMobileでJavaScriptでアプリ開発※JavaScript+iPhone/Androidと言ってもHTML5+JavaScriptなWebアプリケーションの話はありませんスマートフォン開発iPhone(iOS)Android普通のiPhoneアプリ開発iOSSDK+Xcode,Objective-CInterfaceBuilderGUIでレイアウト→コード中のアクション紐付け結局Objective-Cで書くことも普通のAndroidアプリ開発AndroidSDK+Eclipse,Java(GUIBuilderはそこまで使われていない?)iPhone/Androidアプリで作るもの主にUIとデバイス連携部分「クラウド端末」の性格を活かしてドメインロジックはサーバーで。アプリで表示デバイスの機能にアクセスしたいときはコアAPIでiPhoneアプリのコード-(void)applicationdidFinishLaunching:(UIApplication*)application{CGRectrect=[windowframe];UILabel*label=[[UILabelalloc]initWithFrame:rect];label.text=@"Hello,world!";[window

addSubview:label];[labelrelease];[windowmakeKeyAndVisible];}"Window"に"View"(ラベルやボタン)を置くObjective-CでSDK提供のクラスのAPIを呼ぶAndroidアプリのコード"View"で組み立てる(概念はiPhoneと似ている)JavaでSDKのAPIを呼んで組み立て(XMLでも書ける)publicclassHelloWorldextendsActivity{@OverridepublicvoidonCreate(BundlesavedInstanceState){super.onCreate(savedInstanceState);

setContentView(newHelloView(this));}}publicclassHelloViewextendsView{@OverrideprotectedvoidonDraw(Canvascanvas){canvas.drawText("HelloWorld!",0,12,newPaint());}}iPhone/AndroidネイイティブブアプリリPros速くて快快適なイインタフフェーススを構築築できるるデバイススの機能能をフルルに活かかせるConsコード量量が多いい、工数数がかかかるObjective-C････メメモリリ管理:(iPhone/Androidそそのほかかマルチチプラッットフォォームににどう対対応するるか問題題Objective-C/Java両方方覚えるるの大変変/両両プララットフフォームムのアーーキテククチャにに慣れるるの大変変AppceleratorTitaniumMobileJavaScriptでiPhone/Android/BlackBerryアアプリがが書けるる開発環環境JavaScriptなののにネイイティブブアプリリ････「な、、なんだだってーー！」フリー、、オーププンソーース(有料版版あり)Hello,Titaniumvarwin=Titanium.UI.createWindow({backgroundColor:'#fff',title:'FirstApp'});varlabel=Titanium.UI.createLabel({text:'Hello,Titanium!',textAlign:'center',height:20,font:{fontSize:20,fontWeight:'bold'}});win.add(label);win.open();ビルドド結果果Titaniumでで開開発JavaScript書書く→→ビビルルドすする→→シシミミュレレータタで確確認→→JavaScript書書く･････TitaniumSDKははbuilderののみみ。IDEなししEmacs+j2-mode.elででモモリモモリ書書いててますすTitaniumMobile開開発ののはじじめ方方プロジジェククト作作る→→Resources/app.js編編集→→TitaniumDeveloperででビルルドWindowににViewをを載せせるモモデルルは変変わららずTitaniumisNativeネイテティブブだけけどJavaScript、、JavaScriptだけけどネネイテティブブUIは速速い。快適適setTimeout()、、JSON.parse()など普普通に呼べべるTitanium.include('../js/jquery.js')ななども可能能HowdoesTitaniumMobilework?/questions/2444001/how-does-appcelerator-titanium-mobile-workJavaScriptをププリプロセセッサがTitaniumAPIをシンンボルマッップにプリリコンパイイルiPhone････.oにコンンパイルAndroid････.classにココンパイルルあとはSDKががネイティィブバイナナリにしててくれる具体例をみみていく/*最初初の画面(window)*/varfirst=Ti.UI.createWindow({title:'FirstWindow',backgroundColor:'#fff'});varbutton=Ti.UI.createButton({style:Ti.UI.iPhone.SystemButtonStyle.BORDERED,title:'touch!',font:{fontSize:16,fontWeight:'bold'},height:30,width:100});first.add(button);/*次のの画面(window)*/varsecond=Ti.UI.createWindow({title:'SecondWindow',backgroundColor:'#fff'});varimage=Ti.UI.createImageView({image:'/4008/4196452707_485b66a9a3_m.jpg'});second.add(image);/*二つつの画面をを繋ぐwindow+navigationGroup*/varbase=Ti.UI.createWindow();varnav=Ti.UI.iPhone.createNavigationGroup({window:first});base.add(nav);base.open();/*ボタタンにイベベントを登登録*/button.addEventListener('click',function(){nav.open(second);});UI実装装の進め方方Ti.UI.createWindow()ややTi.UI.createButton()ででWindowややViewとといいっったたパパーーツツをを作作るるwindow.add(button)ななどどででくくっっつつけけるるフォォンントトのの大大ききささななどどははCSSののよよううにに指指定定動ききがが必必要要なな箇箇所所ははaddEventListener()ででイイベベンントトハハンンドドララをを登登録録いかかににももJavaScriptでききああががっっっったたアアププリリのの使使用用感感(実実機機でではは触触れれてていいまませせんんがが)ちちゃゃんんととネネイイテティィブブ期待待通通りり、、ぬぬるるりりとと動動くくJavaScriptだだかからら、、とといいうう妥妥協協ししたた動動ききににははななららなないいこんんななののもも作作れれまますすCoverFlowViewvarwin=Ti.UI.currentWindow;varview=Ti.UI.createCoverFlowView({images:['../images/01.jpg','../images/02.jpg','../images/03.jpg','../images/04.jpg','../images/05.jpg'],backgroundColor:'#000'});win.add(view);ネットワークク呼び出しははXHR同様様varhttp=Titanium.Network.createHTTPClient();http.open('GET','/search.json?q=%23titanium');http.onload=function(){data=JSON.parse(this.responseText);};http.send();/*TCPSocketやBonjourServiceななどもありまます*/デバイスの機機能もばっちちりTitanium.Geolocationvarmapview=Ti.Map.createView({mapType:Ti.Map.STANDARD_TYPE,animate:true,regionFit:true,userLocation:true});(function(e){mapview.setLocation({latitude:e.coords.latitude,longitude:e.coords.longitude,latitudeDelta:0.01,longitudeDelta:0.0,animate:true});}TitaniumAPIいいろいろろTi.Geolocation.getCurrentPosition()Ti.Media.showCamera()Ti.Media.createVideoPlayer()Ti.DataBase.open()Ti.App.Properties.setString()Ti.FileSystem.getFile()Ti.Network.createHTTPClient()Ti.Gesture.addEventListener('shake',...)Ti.Facebook.publishStream()Ti.UI.iPhone.appBadge=20...TitaniumAPIざざっくくり基本的ななUIはほほぼサポポート(と思いいます)CoverFlow、、地図、、WebViewももありカメラ,位置情情報,加加速度セセンサななどハーードウェェアアククセスOKデータははsqlite、Propertiesに保保存可能能FacebookややYQLをを扱うAPIなどどもあるるAPIはは拡張張モジュュールをを書くとと自分でで追加でできる(っぽぽい)作ったももの(1):FlickrViewerFlickrののJSONをScrollableViewで表表示するるだけででOKコードはは100行未満満(/SimpleFlickr)左右フリリックでで写真がが切り替替わりまます/*FlickrかからHTTPClientででJSONととっててきて・・・・*/varwin=Titanium.UI.currentWindow;varloader=Titanium.Network.createHTTPClient();loader.open('GET',this.url);loader.onload=function(){Ti.API.info(this.responseText);vardata=JSON.parse(this.responseText);win.add(Flickr.createPhotoView(data));};loader.send()/*ImageView作作っててScrollabeViewにに流しし込む・・・・・*/varviews=data.items.map(function(item){・・・varimageView=Titanium.UI.createImageView({image:item.media.m,・・・});baseView.add(imageView);baseView.add(title);baseView.add(date);returnbaseView;});varscrollable=Titanium.UI.createScrollableView({views:views

});全く同じじコードドでAndroidアアプリ作ったももの(2):RSSリーダダーPerlサーババでRSS→→JSON,HTTPClientでアアクセススFacebookConnect,ははてなブブックママーク連連携機能能も250行行くらいい(/naoya/RSSV)ここはWebViewvarloader=Ti.Network.createHTTPClient();/*ロローカルルに立ててたサーーバーががRSSをJSONにに変換ししてくれれるのでで、それれを取得得*/loader.open('GET','http://localhost:3000/feed?url='+row.url);loader.onload=function(){vardata=JSON.parse(this.responseText);/*読読み取っったJSONをTableViewで整整形*/vartable=Titanium.UI.createTableView({data:data.map(createItemRow)});win.add(table);/*TableViewががクリリックさされたららWebViewでで開くく*/table.addEventListener('click',function(e){openWebWindow(data[e.index]);});};雑感など典型的なiPhoneアプリななら十分開発発できるGUIプロググラミングととJavaScriptのイベントトドリブンススタイルの相相性が良いマルチプラッットフォームムとは言え、、if文でのの切り分けははそれなりにに必要UIパーツツの違い、解解像度の違いいさすがに動ききのあるゲーームはちょっっと難しい?(いえ、わわかりませせん)そのほかAppStore申申請はOKららしい過去に話題題に上ったたことはああるそうビルド後ののファイルルに.xcodeprojがあるるので、Xcodeから読読み込んででいじるこことができきるXib2Jsを使使うとInterfaceBuilderでで作ったたモックををJavaScriptにに変換でできるTitaniumAPIででできなないことはは、Objective-CやJavaでで拡張モモジュールルを書いててしまえばば良い?Titaniumでで開発してていくにはは@donayamaさん日本本語wikiは必見見PDF印印刷して一一通り読めめば大まかかなところろはすぐわわかるサンプルががあって公公式ドキュュメントよより親切公式ドキュュメントよより、KitchenSinkをを見ようオフィシャャルのカタタログ実装装エミュレーータで動かかす→ややりたいいこと見つつける→→gitgrep→ココード見見るAPIリリファレンンスは/mobile/latest/ににSDocああり(by@masuidrive)公式のよりり検索しややすいご清聴ありりがとうごございましした【PR】採用してまます!google:GREE+採採用iPhone/Androidプロジジェクト、、ありますす9、静夜夜四无无邻，，荒居居旧业业贫。。。1月-231月-23Friday,January6,202310、雨中黄叶叶树，灯下下白头人。。。01:24:2701:24:2701:241/6/20231:24:27AM11、以我我独沈沈久，，愧君君相见见频。。。1月-2301:24:2701:24Jan-2306-Jan-2312、故故人人江江海海别别，，几几度度隔隔山山川川。。。。01:24:2801:24:2801:24Friday,January6,202313、乍见翻疑梦梦，相悲各问问年。。1月-231月-2301:24:2801:24:28January6,202314、他乡生白白发，旧国国见青山。。。06一月月20231:24:28上上午01:24:281月-2315、比不了了得就不不比，得得不到的的就不要要。。。一月231:24上午午1月-2301:24January6,202316、行动出出成果，，工作出出财富。。。2023/1/61:24:2801:24:2806January202317、做前，能能够环视四四周；做时时，你只能能或者最好好沿着以脚脚为起点的的射线向前前。。1:24:28上上午1:24上上午01:24:281月-239、没有失败，，只有暂时停停止成功！。。1月-231月-23Friday,January6,202310、很多多事情情努力力了未未必有有结果果，但但是不不努力力却什什么改改变也也没有有。。。01:24:2801:24:2801:241/6/20231:24:28AM11、成功就就是日复复一日那那一点点点小小努努力的积积累。。。1月-2301:24:2801:24Jan-2306-Jan-2312、世间成成事，不不求其绝绝对圆满满，留一一份不足足，可得得无限完完美。。。01:24:2801:24:2801:24Friday,January6,202313、不知香积积寺，数里里入云峰。。。1月-231月-2301:24:2801:24:28January6,202314、意志坚坚强的人人能把世世界放在在手中像像泥块一一样任意意揉捏。。06一一月20231:24:28上午午01:24:281月-2315、楚塞三湘湘接，荆门门九派通。。。。一月231:24上上午1月-2301:24January6,202316、少年十十五二十十时，步步行夺得得胡马骑骑。。2023/1/