IT坊主でいこう!

坊主をしながらITのことに詳しくなりたい!
iphoneアプリ、Webアプリ等頑張る!

Kitchen Sink等からTitaniumを学ぶ 共通部分その2[Windows]

2012年05月29日 20時02分40秒 | Titanium
昨日続き書こうとしたら眠気やらディスプレイの故障やらでできませんでした。

引き続きapp.jsの調査

TabGroupの表示箇所を変えようと色々いじるけど上手くいかない・・・。

とりあえずラベルを表示してみることに
var sampleLabel = Titanium.UI.createLabel({
text:'sample label',
backgroundColor:'#F00',
textAlign: Titanium.UI.TEXT_ALIGNMENT_CENTER

});
sampleLabel.show();
win3.add(sampleLabel);


で実行



こんな感じで表示された。


Titanium.UI.TabGroupはopen()メソッドで表示するのに
Titanium.UI.Labelとかは設置するUIに対してadd()メソッドとかでいれるのか・・・。
どういう違いがあるんだろう・・・。
アプリのメインウインドウみたいなのがあってそこにadd()とかできないのかな。
this.add()とかTitanium.app.add()みたいな。

TabGroupを二つ表示させるとどうなるかと思い
tabGroup.open({
transition: Titanium.UI.iPhone && Titanium.UI.iPhone.AnimationStyle.FLIP_FROM_LEFT

});

tabGroup2.open({
transition: Titanium.UI.iPhone && Titanium.UI.iPhone.AnimationStyle.FLIP_FROM_LEFT

});


としてみたら二つ目のTabGroupが表示された。

裏で動いてるのかな、と

tabGroup.addEventListener('click',function(){
tabGroup.close();

})


とクリックイベントで表示されてるTabGroupをクローズする。







になった。
表示がなんかおかしい・・・(タブの数が違うのは見た目にわかりやすくするためのものです)
裏でいるけど再描画されてないっぽい。

open()ってしたからclose()としたけど、メソッドの説明みるとTabGroup自体を削除してるみたい。
クリックしてイベントでopen()走らせたけどもcloseしたTabGroupが表示されなかった。

じゃあ、close()ではなくvisibleならどうだってことで試す。

tabGroup.addEventListener('click',function(){
// tabGroup.close();
tabGroup.visible=false;

})


結果はこう



この黒い背景は消したTabGroupの背景なのかな・・・。

動作もろともまだまだ調べないといけないみたい。
TabGroupの切り替えもガクついていて微妙、アプリによくある切り替えってどうやってるんだろう
裏に置いとくとかじゃなく、その度に描写してるのかな


半端だけど今日はここまで。

Kitchen Sink等からTitaniumを学ぶ 共通部分その1[Windows]

2012年05月28日 19時10分41秒 | Titanium
今日からTitaniumの中身をもりもり見ていきます。

参考にするサイト

Titaniumで始めるモバイルアプリ作成の基礎知識 -新規Titaniumアプリの作成
Titanium Mobile APIリファレンス(非公式)

tiapp.xml:プロジェクト作成時に入力した内容をまとめている、基本いじる値は入っていない
app.js:Titanium Mobile 1.0から導入された。まずこのファイルを読んでアプリの初期化を行うらしい

var tab1 = Titanium.UI.createTab({
id:'tab1',
window:win1

});

Windowオブジェクト簡単にセットできるのか


var win2 = Titanium.UI.createWindow({
url:'main_windows/controls.js',
titleid:'controls_win_title'

});

作成したウィンドウで呼び出すJSを指定できる

ちなみにWindowsオブジェクトは
w.alertMessage = message;
で警告メッセージを入れておけるらしい、後でやってみよう。

var window2 = Titanium.UI.createWindow({url:'foo.js'});
var t = Ti.UI.iPhone.AnimationStyle.FLIP_FROM_LEFT;
window1.animate({view:window2,transition:t});

でウィンドウ開くときのアニメーションも設定できるのかな

tabGroup.addTab(tab1);
tabGroup.addTab(tab2);
tabGroup.addTab(tab3);
tabGroup.addTab(tab4);
tabGroup.addTab(tab5);

tabGroup.addEventListener('open',function()
{
// set background color back to white after tab group transition
Titanium.UI.setBackgroundColor('#fff');

});

tabGroup.setActiveTab(1);


として実行すれば


こんな感じになる。
何も設定してないとタブグループを上に表示するのだろうか
下に表示するためにはどうすればいいのか後で調べる。

とりあえず一旦ここまで、後で続きを書きます。

Titanium Studioの環境構築[Windows]

2012年05月27日 20時33分03秒 | Titanium
大本となるお手本のサイトは
チャゲってる日々 –僕とTitanium Developerの3日間戦争 – 導入まで
となります、こちらを見てもできると思いますが細部が異なるため補足していきます。

最初にこの記事の当時で用意できた環境は

Windows XP SP3 32bit
SDK 1.6.0_32
Titanium Studio 2.0.1

となります。

1.SDK6をインストールする
SDK5では作成したアプリが起動しないことを確認しています。
また、SDK7でもコンパイル時にエラーが出ることを確認しました。
現状では必ずSDK6を入れるようにしてください。


2.環境変数のパスを設定する
他サイトを参考にして
JAVA_HOME: C:\Program Files\Java\jdk1.6.0_32
PATH: C:\Program Files\Java\jdk1.6.0_32\bin;
を追加(編集)しました。
前の記事でもあげてますが、PATHを%JAVA_HOME%\binともできると思うのですが私の環境では上手くいきませんでした。


3.Titanium Studioをインストールする
こちらからユーザ登録する必要があります。
インストールする場所はデフォルト(Program Files以下)でも大丈夫でした。
floatingdays -Windows XPに Titanium Studioをインストール
こちらに「?」と書かれていますが、パスにスペースが入っていると上手く動かないという情報が
流れてるみたいなのでCドライブ直下等に変更したほうがいかもしれません。
WorkSpaceもデフォルトで起動しましたがパスが長くなりすぎるorスペースを含むとエラーが出るという記事をどこかでみました。


4.Android SDKをインストール
Android Developers -Download the Android SDKからWindowsをダウンロード。
はこもあいして! - 2011-07-25
floatingdays -Windows XPに Titanium Studioをインストール
設置するディレクトリは上記サイトに書いてある通りにパスにスペースが入らないようにする。
私は「C:\applications\android」というディレクトリを作成してその下に置きました。


5.Android SDKのパスを環境変数に設定する
ANDROID_SDK: C:\applications\android\android-sdk
PATH: C:\applications\android\android-sdk\tools;C:\applications\android\android-sdk\platform-tools;
を追加する。
適宜4.で設定したディレクトリに変換してください。



6.再起動する

7.環境変数の確認をする
java -version
adb version
path

をプロンプトに打ち込んで反応が返ってくるか確認する


8.Titaniumに必要なSDKを入れる
Titanium StudioのDashboardから
Configure」→「Let's get things set up!」ボタン→「ドロイド君」ボタン→「Install or Update Android SDK
初回はAndroid SDKのインストールディレクトリを指定するダイアログが出るので指定
Choose Package to Install」ダイアログが出るので必要なSDKを指定
他サイトによると部分的に入れたら動くようですが、はっきりしてない+時間がかかりすぎるので
私は全て入れました。
その場合、Accept Allラジオボタンにチェック→Install
注:全て入れる場合、トータルで5GBほどになるうえ、3時間はかかると思います。


9.Titanium Studioを再起動する

10.adb.exeをコピーする(不要)
floatingdays -Windows XPに Titanium Studioをインストール
などに書いてある
platform-toolsフォルダ内のadb.exeを、toolsフォルダにコピー
以前はtoolsフォルダにあり、Titanium Studioがそれに合わせた動きをするため

ですが、これをしなくても実行できました。
おそらくTitaniumのバージョンがあがったことで対応されたのでしょう。


11.builder.pyを書き換える(不要)
10.と同様にこちらも書き換えなくても動作確認済みです。


12.適当に動作確認をする
「File」→「New」→「Titanium Mobile Project」からプロジェクト作成
「Deployment Target」にAndroidを指定して作成。
「Run」→「Run Configurations」より「Titnaium Android Emulator」を選択
Platform内
Android APIAndroid 2.2
にして「Apply」→「Run」(他未確認)
Screen等はどれでもよい(HVGA、Info)

時間はかかるが実行されれば

が表示されるはず


13.Kitchen Sinkを動かす
Dashboardから
「Develop」→「Kitchen Sink」の「IMPORT」→ダイアログの「Finish」
「Run」→「Run Configurations」より「Titnaium Android Emulator」を選択
Platform内
Android APIGoogle APIs Android 4.0.3
を選択する。
Sawalog -Titanium StudioでAndroid SDKを設定する方法
などでGoogle APIs Android 2.2が指定されていますが、4.0.3でも動きました。

12.よりもはるかに時間をかけ(4分ほど)起動すれば

が表示されます。



以上で終了です。


注意点として、様々なサイトで挙げられていますが
タスクマネージャにadb.exeのプロセスが残っていた場合
[ERROR] Timed out waiting for emulator to be ready, you may need to close the emulator and try again
というエラーがコンソールに表示されて実行できません。
毎回起動前に、このプロセスを切ったほうがよいです。
にしても面倒なのでバッチとか作って起動の度にプロセス切る処理入れられないかなー。

Titanium Studioでサンプル(Kitchen Sink)を実行してみる[Windows] その4

2012年05月27日 02時06分05秒 | Titanium
もう4日目くらいになるけどついにできた!

色々なページを調べたけど、結局のところ

JDKを1.6にしたらできた


ほんとに申し訳ない。
散々いろんなサイトで1.6って書かれていたのに
自分の環境が1.5とはちゃんと確認してなかった・・・


色々試したけどこれをあげたら



試しに作ったらサンプルも起動したし




散々起動しなかったKitchenSinkも起動した!

長かった、明日からようやくサンプルごりごり動かせる


次回はつらつらと書いたけど一連の流れとして起動までの方法を環境構築手順書風にまとめます
すでにまとめてくれて参考にしたサイトもあるけど少し古いし

それではお疲れ様でした。

Titanium Studioでサンプル(Kitchen Sink)を実行してみる[Windows] その3

2012年05月25日 20時03分41秒 | Titanium
前回の続き

参考にさせていただいたサイト
titanium-studioではじめるandroidアプリ開発/開発環境をつくるべし
を見て、アンドロイドのSDKを入れなおしてパスを通したんだけど
きちんとパスが通ってない

ちょっと見てみると、ANDROID_SDKの最後にセミコロン入ってた、凡ミスすぎる。
それでももう一回実行してみたがダメ。

追加したパスをよく見てると
%JAVA_HOME%\bin;%ANDROID_SDK%\tools;%ANDROID_SDK%\platform-tools;
赤くなってる箇所が大文字っぽい\になってた
コピペしたはずなんだけどなー。
・修正して再起動しても直らない
・テキスト、プロンプトに出力したときには正常な文字

環境変数の中に環境変数を使用するのがおかしいのかってことで全部直で書いたら上手くいった。
どんどん原因不明なことが増えていってるけど、とりあえずスルーで。

パスは通ったけどDashboardにはまだこんなエラー文が。
Missing the Android SDK that is needed for the Android deployment target

根気よく調べていくと
Titanium StudioでAndroid SDKを設定する方法
やら
Titanium Studio をアップデートしたら Android SDK を認識しなくなった件
というので一個仮説。

もしかしてある程度いろんなSDKを入れておかないとわけわからんエラー出るの?

ってことで結局全部入れることに。
動作する最低限のアドオンを確認したかったんだけど、時間がかかりすぎる。
HDDに余裕があるのであれば全部入れてしまったほうが手っ取り早い。

数時間かけてまたAPIを全部いれて起動



きたー!!

起動にどんだけ時間かけてるんだ!

だが、Kitchen Sinkが起動しない!!!

いい加減にしてくれ!
早くサンプルいじりたいんだ!

Dashboard見てみると
Add-on Google APIs version 8
が入ってないみたいな忠告文が。

全部チェックいれたのに・・・。
なんか前回丸ごと入れたときより2GくらいAPIの容量少ないし・・・。

W/PackageManager( 60): Unknown permission com.google.android.googleapps.permission.GOOGLE_AUTH.mail in package com.android.contacts

警告だけどこんなのが表示されてるってことはGoogle APIが入ってないってことなのかな。
アドオン入れてて思ってたのが、ログで
https://dl-ssl.google.com/android/repository/addon.xml
というリポジトリをチェックするときに必ず
Line 147:43, Error: org.xml.sax.SAXParseException: InvalidRegex: Pattern value '[a-zA-Z0-9_-]+' is not a valid regular expression. The reported error was: ''-' is an invalid character range. Write '\-'.'.
っていうエラーが出てるんだよね。
ログにはなぜかURLの最後のxmlの最後に.(コロン)が入ってるし。

これでチェックひっかかってるせいでGoogle APIが全部取れてないのかな。
今日はこれで終わり!

いい加減サンプル動かしたい!


-------------------------

titanium-studioではじめるandroidアプリ開発/開発環境をつくるべし
を読むと
Android API:Google APIs Android 2.2(重要!)
って書いてある。
そして確認してみるとやっぱり自分のところには入っていない。
原因はこれに違いない