Titanium系列－－利用Titanium開發android App實戰總結

標籤：android   style   blog   http   io   ar   color   os   使用   

1. Titanium中，通過ImageView Controller 顯示圖片，圖片地址要放在app/assets下，然後自己建一個檔案夾，把圖片放在這裡。如，然後alloy代碼：<ImageView image="/lib/welcome.png" />　完事。

2. 圖片沒有佔滿整個螢幕？－－沒關係，在tss檔案中，　width: Ti.UI.FILL 即可。

3.弄登陸視窗　－－第一次嘗試，說不讓在<window>中嵌套<window>

－－解決方案：

<View id="login_welcome" backgroundImage="/lib/welcome.png">

<ImageView id="login_background" image="/lib/login/login_background.png"></ImageView>

</View>

4.設定button，visible為隱藏，調整位置　　－－設定為隱藏的話，按鈕不能用了

－－解決方案：添加個登陸按鈕圖片，給圖片設定onClick事件

<ImageView id="btn_login" onClick="do_login"></ImageView>

tss:

"#btn_login":{

top:234,

width:120,

height:30

}

js: function do_login(e){

alert("welcome");

}

5.點擊登陸按鈕，跳轉到主介面,在index.js頁面寫調轉方法

js: function do_login(e){

var main_win = Alloy.createController(‘main‘).getView();

main_win.open();

}

6.給各個表徵圖添加點擊事件：這裡只能用button了，因為用圖片的話，重疊部分被點擊了可能會悲劇。

　　　遇到了一個問題：Message: Uncaught TypeError: Object #<View> has no method ‘open‘

　　　－－解決辦法：這是因為在新建立的xml檔案中，沒有window對象，所以不能使用open方法。添加window對象後，成功解決。

7.將button 按鈕隱藏：backgroundColor:‘transparent‘

8.用ScrollView實現圖片滾動效果

　　設定scrollView的contentWidth和width，則只允許為垂直滾動。

<ScrollView id="scroll_view" contentWidth="auto" width="100%">

<ImageView id="back" image="/lib/back.png"></ImageView>

<ImageView id="in_house_image" image="/lib/main_page/in_house_image.png" width="100%"></ImageView>

</ScrollView>

9.設定返回按鈕，這裡有一個問題，按鈕圖片被別的圖片蓋住了？－－通過查官方文檔，瞭解到這裡有一個　　zIndex屬性，該屬性的值為number類型，值越大，它的對象的顯示層級越高，也就是會蓋住比它值小的　　元素，不定義該屬性，預設zIndex值為0。所以設定一下這個屬性就完美解決這個問題了。

10.點擊返回按鈕，返回上級視窗－－

function back(e){

　　Alloy.createController(‘main‘).getView().open();

}

這樣寫雖然實現了功能，但是這樣寫點一下返回，是重新建立一個介面，而不是返回到原來的界 面，目前還沒找到更好的解決方案。

這樣寫的話到後邊會造成OutofMemory問題，然後就會閃退。做返回效果，也可以這麼做：

Ti.App.addEventListener(‘close_house‘,function(){

$.house.close();

});

Ti.App.fireEvent(‘close_house‘);

注意：只有window對象才有close方法，所以不要把元素的ID設定的和檔案名稱相同，否則$.的對象就不是window對象了

11.設定元素為隱藏，也可以用opacity屬性透明度，值為0.0(transparent)-1.0

12.設定文字框輸入文字的屬性，在tss中這樣寫：font:{ fontSize:10 }

13.取消Textfield 底線，用backgroundColor:‘transparent‘

14.當圖片顯示不出來時，有可能是寬高的問題，可以和顯示出來的圖片比較下，改變寬高

15.取消Titanium導航條logo和文字：參考https://developer.appcelerator.com/question/178314/www.appcelerator.com/blog/2014/08/hiding-the-android-actionbar/

直接找到：build/android/res/values下的theme.xml檔案，在項目的tiapp.xml中，寫入下列代碼：<android xmlns:android="http://schemas.android.com/apk/res/android">

<manifest>

<application android:theme="@style/Theme.AppCompat.Translucent.NoTitleBar.Fullscreen">

<!-- Add whatever else you need here -->

</application>

</manifest>

　 </android>

16:Titanium代碼整理：ctrl + shift + F

Titanium系列－－利用Titanium開發android App實戰總結