Titanium Studioを使った アプリ開発 Vol.1

Presentation on theme: "Titanium Studioを使った アプリ開発 Vol.1"— Presentation transcript:

1 Titanium Studioを使った アプリ開発 Vol.1
GroovyMedia Inc. Shota Watanabe

2 目次 環境のセットアップ iPhone/Androidアプリケーションを動かす タイトルや、細かいところを修正する

3 環境のセットアップ＿事前 JDKをインストール
JDK1.6をインストール。 「jdk 1.6」で検索 Java SE DownloadsからJDK

4 環境のセットアップ＿事前 JDKをインストール
JAVA_HOME JDKをインストールしたフォルダに指定 例) C:¥Program Files¥Java¥jdk_xxxx¥ Path Pathのすでにある値に、「;%JAVA_HOME%¥bin」を追加する コマンドプロンプトから「javac –version」と記入し、バージョン番号がでればOK!

5 環境のセットアップ1 Titanium Studio インストール
「Titanium Mobile」で検索

6 環境のセットアップ1 Titanium Studio インストール
登録後メールアドレスを確認する

7 環境のセットアップ1 Titanium Studio インストール
アンケートに回答

8 環境のセットアップ1 Titanium Studio インストール
ダウンロード

9 環境のセットアップ2 Android SDKインストール
「Android SDK」で検索 ＆ダウンロード，解凍

10 環境のセットアップ2 Android SDKインストール
「Android SDK」で検索＆ダウンロード，解凍 ※削除しないような、後で指定可能な場所に設置すべき。WindowsならC:¥、OSXなら/Applications など

11 環境のセットアップ2 Android SDK 各種インストール
OSXの場合：Android SDKをインストールしたフォルダの「tools」→「android」を起動 Windowsノ場合：

12 環境のセットアップ2 Android SDK 各種インストール
Installed Packageを選択し、「Install x Packages」をクリック。 ※注意）一旦全部のチェックを外して、もう一度チェックしなおすこと ※注意２）Android2系を使うため、必ず2.1、2.2、2.3.3は全てインストールすること （2.1が入っていないと動かないことがあります。）

13 環境のセットアップ2 Android SDK 各種インストール
同封のGoogle APISを入れる必要があります。 これは、バージョンをチェックしておけば問題なくインストール可能です。

14 環境のセットアップ2 iPhone SDK インストール
OSXのユーザはiPhone SDKをインストールすることでクロス環境での開発ができます iPhone SDKには年1万800円（2011年11月28日現在）の費用が必要です。 ※イントラ用のアプリ開発には別途ライセンスが用意されてます。

15 iPhone/Androidアプリケーションを動かす Titanium Studioを起動
先ほど登録したID/password でログイン

16 iPhone/Androidアプリケーションを動かす プロジェクトを作成
App IDにはcom.example.appのように自分の所有しているドメインを逆から記載（なければjp.ac.keio.sfc.neuro.***を利用) プロジェクト名は自由に記載

17 iPhone/Androidアプリケーションを動かす 起動！

18 起動に際しての問題点 起動しない プロジェクトファイルの場所からbuild/Androidを削除してみる エミュレーターを再起動する
Android SDKが正しくインストールされているかどうか

19 Java Scriptの簡単なルールと、Titanium MOBILEの作り方

20 JavaScriptのシンタックス

21 簡単な言語特性 全てオブジェクトである 命令の終わりは「;」で区切る リスト []　と ハッシュテーブル {}

22 Titanium Mobileのコード 標準的なレイアウトアプリ
① tabGroupを作る ② tab/windowを作り、タブグループに追加する

23 Titanium Mobileのコード 標準的なレイアウトアプリ
③ tabGroupを開く ここまでの流れで「タブ」に属性を追加したり、 作成した「ウィンドウ」に文字を追加したりなどして、 色々なアプリを作っていきます

24 Titanium Mobileのコード ウィンドウのコードを別に分ける
windowを作成する際に、urlというパラメーターを渡すことで、 別のファイルにウィンドウのファイルを指定可能 ※これによってウィンドウ毎にわかれた綺麗な処理を書くことが可能に！

25 Titanium Mobileのコード ウィンドウのコードを別に分ける
ラベルを作成して、Ti.UI.currentWindowから追加する例 Ti.UI.currentWindowを追加する

26 Titanium Mobileのコードの注意点
iPhone/iPad … 画面解像度 = px Android … 設定で画面解像度を指定する または、「dp」指定をすることで画面解像度ベースの幅・高さ・フォントサイズなどにできる

27 わからないことがあったら 渡邊まで