2013年7月14日 星期日

android 基本圖庫瀏覽

在APP中,多少都一定會使用到圖片,所以這邊就先教簡單的圖片使用。

1.一開始先去專案的檔案區的res資料夾底下建立一個drawable資料夾

不知道在哪可以在你的專案名稱上按滑鼠右鍵,選Properties(或 Alt+Enter),之後選Resource就可以看到Location: 路徑

2.把要放的圖片放進去(建議圖檔不要太大,不然很吃模擬器的記憶體)

3.之後回到編輯器上,在專題上按滑鼠右鍵重整,就會多一個drawable資料夾還有圖片

這樣圖片就進來圖庫區,並且也都有建立R.java的ID識別碼,沒有的話請關掉編輯器再重開看看,或是建立時路徑錯誤。

都完成之後就可以開始建立檔案和面版了

首先先建立Layout面版

1.先在左方元件庫,選擇Images & Media類別區裡的ImageView元件
(注意,這是一個圖片元件而不是單純圖片)

2.之後拉到右方的版子上,會出現對話視窗,圖片先隨便選,之後按OK。

之後再加幾顆Button元件,然後再把版面稍為排版一下

版面排版的程式碼,有標記比較要注意的地方。


都排版完之後就建立程式碼,並把所有要用到的元件都給抓到。

先看程式的架構

Tip重點
(1) 
int[] imges={R.drawable.a1,R.drawable.a2,R.drawable.a3,R.drawable.a4,R.drawable.a5,R.drawable.a6};
由於R檔的識別碼是屬於整數型態,所以要用整數陣列來裝圖片
R.drawable.a1 因為是在drawable資料夾下,有點像是物件導向。
private p=0 是用來作為旗標值用。

(2)
bt1.setOnClickListener(new mylistener());
bt2.setOnClickListener(new mylistener());
按鈕事件可以設定給它同一個函數,這樣可以不用寫太多函數。

(3)
switch(v.getId())
因為點選Button之後會啟動mylistener()裡面的onClick(View v),而這個View v就是代表onClick事件處發時的元件id。
case R.id.button1
case R.id.button2
到R檔裡面抓取 元件的id來對應switch的值,判斷是哪顆Button被觸發

這是比較有技巧性的寫法,如果要一個按鈕事件對應一個函數也是可以。

基本架構完成後,就開始寫觸發事件的內容

Tip重點
iv1.setImageResource(imgs[p]);
對iv1圖片元件設定它的圖檔來源,由於已經把圖檔來源都放在imgs[]陣列裡了,所以直接用陣列來取出。
imgs.length-1 
因為imgs.length是取陣列長度,但陣列索引值是從0開始,所以要-1。

之後就啟動模擬器看成果
按上一張

按下一張

到最後一張再繼續按下一張

這樣就完成了圖片的基本瀏覽

沒有留言:

張貼留言