第七堂 youtube 播放 app (2)

25
第第第Youtube 第第 APP (2) 第第第 Jason Ko Jason 第 Android 第第第第第第第第第

Upload: -

Post on 07-Aug-2015

106 views

Category:

Software


1 download

TRANSCRIPT

Page 1: 第七堂 Youtube 播放 app (2)

第七堂:Youtube 播放 APP (2)

柯力中 Jason Ko

Jason 的 Android 快樂應用程式學習班

Page 2: 第七堂 Youtube 播放 app (2)

課程內容• 使用 ImageLoader 顯示圖片

• 建立 VideoActivity 的 layout_video

• 使用 Intent 跳轉 Activity

• VideoActivity 的程式碼

Jason 的 Android 快樂應用程式學習班

Page 3: 第七堂 Youtube 播放 app (2)

使用 ImageLoader 顯示圖片

Jason 的 Android 快樂應用程式學習班

Page 4: 第七堂 Youtube 播放 app (2)

• ImageLoader 是一個好用的讀取網路圖片的工具

• 要使用時 , 須將之檔案複製到我們自己的專案下

Jason 的 Android 快樂應用程式學習班

關於 ImageLoader

Page 5: 第七堂 Youtube 播放 app (2)

建立 package: imageloader

Jason 的 Android 快樂應用程式學習班

Page 6: 第七堂 Youtube 播放 app (2)

複製 ImageLoader 的元件到 Package 下

Jason 的 Android 快樂應用程式學習班

1. 下載 imageloader.zip https://drive.google.com/file/d/0B-Z1UBSQ9xtTdlJpTzluUURhT2s/view?usp=sharing

2. 解壓縮後將 ImageLoader 放在 package 下 , 如下圖

Page 7: 第七堂 Youtube 播放 app (2)

使用 ImageLoader

Jason 的 Android 快樂應用程式學習班

1. 宣告 ImageLoader

2. 指向元件

3. 使用 ImageLoader 讀取圖片

url 的路徑

ImageView

Page 8: 第七堂 Youtube 播放 app (2)

加 Write To SD card 的 Permission

Jason 的 Android 快樂應用程式學習班

1. 在 AndroidManifest.xml 加入寫入 SD 卡的 permission, 因為 ImageLoader 會把圖片的緩存寫道 SD 卡上

Page 9: 第七堂 Youtube 播放 app (2)

完成圖片的讀取

Jason 的 Android 快樂應用程式學習班

Page 10: 第七堂 Youtube 播放 app (2)

VideoActivity 與 layout_video

Jason 的 Android 快樂應用程式學習班

Page 11: 第七堂 Youtube 播放 app (2)

• VideoActivity 是 YoutubePlay 的內頁 , 用來顯示影片的 detail 資訊

• 在這 VideoActivity 裡 , 一樣要先用 VideoAPI 讀取影片詳細資料 , 然後顯示出來

Jason 的 Android 快樂應用程式學習班

關於 VideoActivity

Page 12: 第七堂 Youtube 播放 app (2)

Jason 的 Android 快樂應用程式學習班

先做 layout_video

Page 13: 第七堂 Youtube 播放 app (2)

Jason 的 Android 快樂應用程式學習班

建立 VideoActivity

• 建立一個 Normal 的 Activity ( 可以從 MainActivity copy 過來再修 )

Page 14: 第七堂 Youtube 播放 app (2)

使用 Intent 跳轉 Activity

Jason 的 Android 快樂應用程式學習班

Page 15: 第七堂 Youtube 播放 app (2)

Jason 的 Android 快樂應用程式學習班

修改 ListVideoAdapter

• 讓每個 View 點擊時會跳轉 , 並帶有 Video ID 的訊息

Page 16: 第七堂 Youtube 播放 app (2)

Jason 的 Android 快樂應用程式學習班

修改 AndroidManifest

• 在 AndroidManifest 增加 VideoActivity 的宣告

Page 17: 第七堂 Youtube 播放 app (2)

Jason 的 Android 快樂應用程式學習班

修改 ListVideoAdapter

• 讓每個 View 點擊時會跳轉 , 並帶有 Video ID 的訊息

Page 18: 第七堂 Youtube 播放 app (2)

VideoActivity 的程式碼

Jason 的 Android 快樂應用程式學習班

Page 19: 第七堂 Youtube 播放 app (2)

Jason 的 Android 快樂應用程式學習班

從 Intent 取得 Video ID

Page 20: 第七堂 Youtube 播放 app (2)

Jason 的 Android 快樂應用程式學習班

取得 layout_video.xml 的各元件

Page 21: 第七堂 Youtube 播放 app (2)

Jason 的 Android 快樂應用程式學習班

使用 AsyncTask 取得 Video 資料並顯示

Page 22: 第七堂 Youtube 播放 app (2)

Jason 的 Android 快樂應用程式學習班

Button 分享

Page 23: 第七堂 Youtube 播放 app (2)

Jason 的 Android 快樂應用程式學習班

Button 前往 Youtube

Page 24: 第七堂 Youtube 播放 app (2)

Jason 的 Android 快樂應用程式學習班

成果

Page 25: 第七堂 Youtube 播放 app (2)

完整程式碼

https://github.com/KosbrotherSchool/Teach_YoutubePlayAPP_Part2

Jason 的 Android 快樂應用程式學習班