iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 9
0

今天來介紹一下開發 Android TV 時所需要用到的 Android Leanback Library

Leanback 顧名思義就是 躺著看 的意思
最早是被 YouTube 拿來用,但兩者的用意都是針對客廳電視族群
希望使用者們可以當顆沙發馬鈴薯,翹腳髯嘴鬚的躺在客廳沙發上觀看他們喜歡的影音服務

不知道大家有沒有發現
在 TV 上的 Google Play Store 中,有很多 App 的樣子都長得差不多
像是:TED、LINE TV、Vidol、friDay
https://ithelp.ithome.com.tw/upload/images/20200924/201071654p4Gs2EpYU.jpg
是大家抄來抄去嗎?
其實這是 Leanback Library 中提供的 UI 介面讓開發者可以快速開發
以下介紹幾個比較常用的:

BrowsSupportFragment

https://ithelp.ithome.com.tw/upload/images/20200924/20107165NKwVWppsMM.jpg
Brows 從字面上來看,就是瀏覽的意思,像瀏覽器也叫做 Browser
這會是 Android TV App 的進入點,它包含了

  • 左側的選單 (HeaderSupportFragment)
  • 右側的內容 (RowsSupportFragment)

RowsSupportFragment

https://ithelp.ithome.com.tw/upload/images/20200924/20107165GWqBWFhq5r.jpg
RowsSupportFragment 是一列一列不同分類(Category)及內容所組成,若分類中的內容超過螢幕範圍,則是繼續往右滑動,那如同上面所說,RowsSupportFragment 是負責在 BrowsSupportFragment 中呈現內容的,但它也可以單獨存在任何你想要讓他出現的地方,不僅僅只限於 BrowsSupportFragment 中唷

DetailsSupportFragment

https://ithelp.ithome.com.tw/upload/images/20200924/20107165qjYsGB4FbD.jpg
可以從上圖看的出來,DetailsSupportFragment 是用來顯示影片詳細資訊的
在 Fragment 中可以放入影片的主視覺、影片名稱等等詳細資訊,主視覺旁也可以規劃放上幾種 Action 讓使用者來操作

VerticalGridSupportFragment

https://ithelp.ithome.com.tw/upload/images/20200924/201071653wfTTYkANb.png
VerticalGridSupportFragment 看起來跟 RowsSupportFragment 有點類似
但不同的點在於如果有多個分類要顯示在同一頁面,而各分類的內容不會太多,就會使用 RowsSupportFragment,反之如果一個分類中的內容多到一個滑不完的境界,就建議使用 VerticalGridSupportFragment,因為其實 VerticalGridSupportFragment 的 Base 就是固定寬度的 Recyclerview,該分類所有內容顯示在同一頁面,向下滑動一次瀏覽多個項目,可以讓使用者快速找到想看的影片

SearchSupportFragment

https://ithelp.ithome.com.tw/upload/images/20200924/20107165oVseqVBrE7.jpg
SearchSupportFragment 中內含有 Google 厲害的語音輸入,可以減輕使用者使用遙控器輸入文字的困難

GuidedStepSupportFragment

https://ithelp.ithome.com.tw/upload/images/20200924/20107165AgXJChb7e3.png
GuidedStepSupportFragment 就像是設定或是步驟操作的頁面,像是引導使用者如何做帳號註冊、登入、設定 Wifi 等等的流程操作,都可以使用 GuidedStepSupportFragment 來完成

之後幾天我們會一一的來做教學

當然可能你會想說 一定要用 Leanback Library 提供的 UI 來開發 TV App 嗎?
這沒有一定,像 Netflix、LiTV、愛奇藝或是其他不適合這種結構的 App 也都是自己開發,讓開發者自由創造的喔
個人小小的發現,最近越來越多 App 長的越來越像 Netflix 了
可見得 Netflix 的操作流暢度及設計深得使用者的喜愛,因此其他 App 也都仿效 Netflix 的設計囉

明天我們來實作我們第一個 Android TV App 吧


上一篇
Day 8 - 常用 adb 指令及實用小技巧
下一篇
Day 10 - My First Android TV App (使用 Kotlin)
系列文
宅經濟起飛,想當顆沙發馬鈴薯嗎??智慧電視會是未來的趨勢嗎??讓我們一探 Android TV 的神秘世界30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言