天天看點

使用Titanium Mobile開發iPhone/Android應用(07)- Twitter用戶端之照相機

[size=large][b]使用照相機[/b][/size]

在前一篇我們說了一下iPhone中的幾個功能,GPS和地圖的表示,這篇我們将說說照相機的使用。能夠從已經照好的照片中選擇照片,而且選擇的方式通過Option Dialog羅列,然後将照片釋出到TwitPic。

[size=large][b]ImageView的準備[/b][/size]

要能夠預覽選擇的照片,我們需要準備表示照片的View。這部分和前一篇中的表示地圖部分是一樣的。

我們在前一篇中作成的message_window.js中追加一下代碼:

和前一篇地圖的表示一樣,在們有必要顯示時候先通過hide方法将其隐藏。而且,注意一下width被設定為'auto'。講width設定為'auto',在之後設定照片的資料時候,就能夠維持原有圖檔的比例自動調整大小。

[size=large][b]準備OptionDialog[/b][/size]

添加圖檔包含照相和從已有的相冊中選擇照片。調用OptionDialog隻有為使用者提供照片添加方式的選擇。

[img]http://dl.iteye.com/upload/attachment/609070/25df2764-fb53-3fef-bd25-7f2e51f7e3e9.png[/img]

在Titanium.UI.createOptionDialog傳遞的參數options中設定,表示的文字。然後,為做好的optionDialog對象設定click事件的監聽。其中從事件對象e的e.index能夠取到按下按鈕的index。這裡我們對「照相」「從相冊選擇」兩個按鈕分别調用擷取照片的函數。

在後半部分中,作成了一個為了打開Dialog的photoButton按鈕。當按下該按鈕後,将Dialog顯示出來:photoButton.addEventListener中調用sourceSelect.show()

[size=large][b]取得照片[/b][/size]

上邊的代碼中調用了兩個函數:startCamera,selectFromPhotoGallery。

首先我們編寫startCamera方法來啟動照相機。

其中Titanium.Media.showCamer是啟動照相機的方法。參數中是指定照完向後的處理和照相的種類等的設定。

成功照完相後的回調函數指定到success參數中。往該函數傳遞的event對象的media參數就是我們照好的照片對象。将該照片對象設定到我們剛才做好的imageView當中後講imageView表示出來。最後通過uploadToTwitPic函數講該照片發送到TwitPic。至于uploadToTwitPic函數我們最後再說明。

照相的取消,出錯處理指定到cancel, error參數中。我們沒有取消的具體處理内容,是以這裡代碼被注釋了。出錯的進行中,判斷了是否是沒有照相機引起的錯誤。

在mediaTypes參數指定了Ti.Media.MEDIA_TYPE_PHOTO後,我們将隻能照相不能錄像。如果不指定的話。預設是可以錄像的。

以下是從相冊中擷取照片的代碼:

基本上和啟動照相機的代碼是一樣的。

這樣在點下photo按鈕後,将表示出來Dialog,選擇圖檔後表示在頁面上。

[img]http://dl.iteye.com/upload/attachment/609072/c62cf6f2-2217-3ba6-978f-6207b9a0fd21.png[/img]

[size=large][b]往Twitter發送照片[/b][/size]

上邊我們已經能夠取得照片,下邊的事就是想辦法把照片釋出到Twitter上去。Twitter自身沒有專門的發送圖檔的功能,是以隻能利用圖檔發送服務将圖檔傳到伺服器,然後将上傳的圖檔的URL釋出到Twitter。

這裡說一下剛才的uploadToTwitPic函數。通過TwitPic的OAuth Echo認證方法,利用Twitter的OAuth和TwitPic的APIkey就能夠發資訊。也就是說不用申請TwitPic的賬戶,也不用将Twitter的ID和密碼登陸到TwitPic.

twitterApi.oAuthAdapter.createOAuthHeader()方法中,生成OAuth Echo用的HTTP請求的Header。xhr.onload中指定上傳完了後講圖像URL顯示到文本框的回調函數。xhr.open中指定TwitPic發信用URL。之後通過xhr.setRequestHeader設定OAuth Echo認證的必須HTTPHeader。xhr.setRequestHeader在xhr.open之前調用的話也不會出錯誤或者警告。但是實際中要注意調用的順序。

最後在xhr.send中,指定APIkey,media中指定要發送的圖檔,message中指定說明文字後,TwitPic的頁面就能表示出來了。在'YOUR_TWITPIC_API_KEY'指定你自己從http://dev.twitpic.com/apps/new擷取的TwitPic的APIkey。

繼續閱讀