福井スマートフォンハッカソン titanium mobileの紹介

49
Titanium Mobile を超簡単に紹介するよ Shingo Mori ConnectionWorks Inc.

Upload: mori-shingo

Post on 24-May-2015

1.479 views

Category:

Documents


4 download

TRANSCRIPT

Page 1: 福井スマートフォンハッカソン Titanium Mobileの紹介

Titanium Mobileを超簡単に紹介するよ

Shingo MoriConnectionWorks Inc.

Page 2: 福井スマートフォンハッカソン Titanium Mobileの紹介

自己紹介

Page 3: 福井スマートフォンハッカソン Titanium Mobileの紹介

•ConnectionWorks Inc. from Nagoya•(株)コネクションワークス

•@sngmr

•ソフトウェアエンジニア• 兼営業兼企画兼コンサル兼経理

•Titanium Certified Application Developer

Shingo Mori森 真 吾

Page 4: 福井スマートフォンハッカソン Titanium Mobileの紹介

Titanium Mobileってなに?

Page 5: 福井スマートフォンハッカソン Titanium Mobileの紹介

JavaScript

Page 6: 福井スマートフォンハッカソン Titanium Mobileの紹介

int main (int argc, const char * argv[]) { NSAutoreleasePool * pool = [[NSAutoreleasePool alloc] init];

// insert code here... MyClass *obj = [[MyClass alloc] init]; int value = [obj add:1 val2:2]; [obj release]; [pool drain]; return 0;}

Page 7: 福井スマートフォンハッカソン Titanium Mobileの紹介

ヤダ… (´・ω・`)

括弧ばっかりで

気持ち悪い…

Page 8: 福井スマートフォンハッカソン Titanium Mobileの紹介

function main() {var obj = new MyClass();var value = obj(1, 2);

}

Page 9: 福井スマートフォンハッカソン Titanium Mobileの紹介

( ・∀・)イイ!!

Page 10: 福井スマートフォンハッカソン Titanium Mobileの紹介

しかも

iOSとAndroidが

両方イケる(バイ)

Page 11: 福井スマートフォンハッカソン Titanium Mobileの紹介

‣クロスプラットフォーム・モバイルアプリケーション開発環境‣ iOS (iPhone, iPad, iPod touch)‣Android‣Brackberry (beta)‣Mobile Web (beta)

‣開発元は‣Appcelerator Inc.‣アメリカ・マウンテンビュー(シリコンバレー)

‣オープンソース‣Titanium Mobile SDKはGithubでOpenに開発

Page 12: 福井スマートフォンハッカソン Titanium Mobileの紹介

どうやって動くの?

Page 13: 福井スマートフォンハッカソン Titanium Mobileの紹介

Titanium Mobileのアーキテクチャ

iOS

JSインタプリタ

APIs Modules

アプリケーションコード

Android OS

JSインタプリタ

APIs Modules

Native iOS app Native Android app

Page 14: 福井スマートフォンハッカソン Titanium Mobileの紹介

実際に使われてるの?

Page 15: 福井スマートフォンハッカソン Titanium Mobileの紹介

1.5 MILLION DEVELOPERS

Page 16: 福井スマートフォンハッカソン Titanium Mobileの紹介
Page 17: 福井スマートフォンハッカソン Titanium Mobileの紹介
Page 18: 福井スマートフォンハッカソン Titanium Mobileの紹介

Japan?

Page 19: 福井スマートフォンハッカソン Titanium Mobileの紹介
Page 20: 福井スマートフォンハッカソン Titanium Mobileの紹介
Page 21: 福井スマートフォンハッカソン Titanium Mobileの紹介
Page 22: 福井スマートフォンハッカソン Titanium Mobileの紹介
Page 23: 福井スマートフォンハッカソン Titanium Mobileの紹介
Page 24: 福井スマートフォンハッカソン Titanium Mobileの紹介
Page 25: 福井スマートフォンハッカソン Titanium Mobileの紹介
Page 26: 福井スマートフォンハッカソン Titanium Mobileの紹介
Page 27: 福井スマートフォンハッカソン Titanium Mobileの紹介
Page 28: 福井スマートフォンハッカソン Titanium Mobileの紹介

なにがすごいの?

どこまでやれるの?

Page 29: 福井スマートフォンハッカソン Titanium Mobileの紹介

Native UI が使える•User Experience !!!•慣れ親しんだUIが使える

Page 30: 福井スマートフォンハッカソン Titanium Mobileの紹介

機能は(だいたい)全部使えますNative User ExperienceNative performance + Native UI (tables, animations, gestures, etc).

Location-based ServicesAugmented reality, geo-location, compass, native maps

Social SharingAuthenticated access to Facebook, Twitter, Yahoo YQL. Native email/address book.

DataAccess online / device data, embedded SQL database, filesystem, web services

MultimediaCamera, video camera, streaming / device audio/video

AnalyticsIntegrated user, session, and custom analytics. Interactive web-based analysis tools. Geo-analytics.

Titanium PlusAdd any native Obj. C (iPhone) or Java (Android) module into Titanium

Development ToolsCreate, test, and publish your app

Page 31: 福井スマートフォンハッカソン Titanium Mobileの紹介

なにが苦手?•リアルタイム性が要求されるものは厳しい•メモリも少し食う•UIデザイナがないよー•CSSを直打ちするイメージでデザイン

Page 32: 福井スマートフォンハッカソン Titanium Mobileの紹介

TitaniumのAPIに無い機能が使いたい !!•Objective-C(iOS)またはJava(Android)で拡張Moduleが作れる!•Open Mobile Marketplaceで買う事も!

Page 33: 福井スマートフォンハッカソン Titanium Mobileの紹介

Open Mobile Marketplace

Page 34: 福井スマートフォンハッカソン Titanium Mobileの紹介

なにがいるの?

Page 35: 福井スマートフォンハッカソン Titanium Mobileの紹介

‣開発にはMacが必須です

‣Lionの場合は必須ではありませんが、iOS Dev Centerに登録しましょう。捗ります。Freeです。

‣XcodeをAppStoreからダウンロード

‣Command Line Tools for XcodeもAppleからダウンロード

‣Gitがあると便利なので

‣実機に転送したい場合は、iOS Developer Programへの加入が必要(年8,400円のお布施)

iOSアプリを作る場合

Page 36: 福井スマートフォンハッカソン Titanium Mobileの紹介

Androidアプリを作る場合

‣WindowsでもいいけどMacのがいい・・・かも

‣Android SDK をダウンロード

‣Android SDK ManagerでターゲットバージョンのSDKをダウンロード

‣ ごめんなさい。Androidあんまりやってないのでちょっと曖昧です

Page 37: 福井スマートフォンハッカソン Titanium Mobileの紹介

どちらの場合でも‣JDK(Java Development Kit)のインストール

‣Appceleratorへ開発者登録

‣Titanium Studioのダウンロード

‣Titanium Studio内からTitanium Mobile SDKのダウンロード

‣開発マシンは・・・

‣速いCPUと富豪なメモリがあった方がいいです

Page 38: 福井スマートフォンハッカソン Titanium Mobileの紹介

お高いんでしょ?

Page 39: 福井スマートフォンハッカソン Titanium Mobileの紹介

(基本)無料です!!

Page 40: 福井スマートフォンハッカソン Titanium Mobileの紹介

デバッグめんどそう

Page 41: 福井スマートフォンハッカソン Titanium Mobileの紹介
Page 42: 福井スマートフォンハッカソン Titanium Mobileの紹介

‣Titanium Studio上からデバッグ可能‣ただしシミュレータのみ‣実機デバッグは開発中だそうです

‣break point で変数の中身を確認できる

‣iPhoneシュミレータは普通に動く‣Androidシュミレータは・・・まぁ動く(遅い)

Page 43: 福井スマートフォンハッカソン Titanium Mobileの紹介

どういうふうに書くの?

Page 44: 福井スマートフォンハッカソン Titanium Mobileの紹介

var win = Ti.UI.createWindow({ layout: 'vertical', backgroundColor: '#666'});win.add(Ti.UI.createLabel({ text: 'about @sngmr', color: '#FFF'}));win.add(Ti.UI.createTableView({ data: [ { title: '名前', hasDetail: true }, { title: '生年月日', hasDetail: true }, { title: '性別', hasDetail: true }, { title: '身長', hasDetail: true }, { title: '体重', hasDetail: true }, { title: '年収(別料金が必要)', hasDetail: true } ], style: Ti.UI.iPhone.TableViewStyle.GROUPED}));win.open();

win

createLabel

createTableView

open

Page 45: 福井スマートフォンハッカソン Titanium Mobileの紹介
Page 46: 福井スマートフォンハッカソン Titanium Mobileの紹介

Reference

Page 47: 福井スマートフォンハッカソン Titanium Mobileの紹介

‣Download‣http://www.appcelerator.com/

‣Documents‣http://docs.appcelerator.com/

‣Sample‣Titanium Studio -> Samples‣KitchenSink (UI部品の使い方のみ参考に!!)‣その他(コードの組み方とか全般)

Page 48: 福井スマートフォンハッカソン Titanium Mobileの紹介

Question?

Page 49: 福井スマートフォンハッカソン Titanium Mobileの紹介

ありがとうございました