全新的tvOS中引進了一個很重要的東東苞轿，叫 top sheft 耍铜，top shelf 是什么呢越妈？先上圖
有圖好說話错沃，簡單來說，top shelf 就是一個可以像App Store 一樣用卡牌style向用戶進行內容推薦的這么一個東東雀瓢，當然枢析，不僅僅可以顯示推薦內容，動態(tài)的top shelf 還可以顯示用戶最近瀏覽刃麸，收藏等醒叁，如果是游戲的話，可以顯示存檔信息泊业。選中某個卡片把沼，點擊play按鍵，即可直接進行內容瀏覽或者開始游戲吁伺，非常方便饮睬。
Top shelf大大增加了應用的存在感，給app的交互帶來新的方式箱蝠，然而一切并沒有開發(fā)者心中想的那么美好：只有位于列表第一行的app才有資格顯示top shelf续捂，其他的app都只能顯示一個孤零零的圖標垦垂。怎樣才能讓用戶心甘情愿地把自己的app放在第一行呢宦搬，你們自己想去吧，反正我是不用管這事劫拗，嘿嘿间校。
另外需要說明的是，tvOS沒有本地持久化存儲页慷，因此憔足，所有的數據都要從服務器獲取，so酒繁，使用cloudKit或者自己搭建服務器吧滓彰。
廢話不多說，下面開始教大家使用 top shelf州袒。
靜態(tài)圖像
這個沒什么好說的揭绑，把圖片直接拖進assets里面就OK了，注意分辨率一定要是1920x720郎哭。
動態(tài)顯示
動態(tài)顯示是個大頭他匪，沒有誰愿意看著一成不變的圖片放在首頁上亮瞎狗眼，下面開始隆重介紹動態(tài)顯示的 top shelf夸研。
創(chuàng)建一個tvOS的app邦蜜，這很簡單，不介紹了亥至。
-
創(chuàng)見完畢后悼沈，File->New->Target贱迟，選擇tvOS下面的Application Extension -> TV Services Extension
-
輸入名稱，建議使用topshelf就OK
-
點擊 Activate
這時主項目中會出現一個名稱為topshelf的文件夾絮供，里面有一個叫做ServiceProvider的文件关筒，編輯它的代碼如下：
import Foundation
import TVServices
class ServiceProvider: NSObject, TVTopShelfProvider {
override init() {
super.init()
}
var topShelfStyle: TVTopShelfContentStyle {
return .Sectioned //
}
var topShelfItems: [TVContentItem] {
let ID = TVContentIdentifier(identifier: "identifier1", container: nil)!
let Item = TVContentItem(contentIdentifier: ID)!
var Items = [TVContentItem]()
for (var i = 0; i < 8; i++)
{
let identifier = TVContentIdentifier(identifier: "identifier2", container: ID)!
let contentItem = TVContentItem(contentIdentifier: identifier )!
if let url = NSURL(string: ["https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=1416240957,410020165&fm=58","https://ss2.baidu.com/6ONYsjip0QIZ8tyhnq/it/u=216248366,1253432148&fm=58","https://ss2.baidu.com/6ONYsjip0QIZ8tyhnq/it/u=3314685794,229436694&fm=58","https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=1316079114,162208842&fm=58","https://ss2.baidu.com/6ONYsjip0QIZ8tyhnq/it/u=470891324,227323529&fm=58","https://ss1.baidu.com/6ONXsjip0QIZ8tyhnq/it/u=3495368848,1024610533&fm=58","https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3305383698,853442007&fm=58","https://ss1.baidu.com/6ONXsjip0QIZ8tyhnq/it/u=1778394871,4237479606&fm=58"][i])
{
contentItem.imageURL = url
contentItem.imageShape = .Poster
contentItem.title = ["星球大戰(zhàn)","老炮兒","尋龍訣","我滴個神啊","神探夏洛克","夏洛特煩惱","游戲","不可思異"][i]
contentItem.displayURL = NSURL(string: "hehe://\(i)")
contentItem.playURL = NSURL(string: "hehe://\(i)")
}
Items.append(contentItem)
}
Item.title = "熱門電影"
Item.topShelfItems = Items
return [Item]
}
}
對上面的程序的解釋
- topShelfStyle : 控制顯示的方式，有兩種杯缺，.Inset 和 .Sectioned 蒸播，前者會讓卡片鋪滿視圖。
- topShelfItems : 它的getter控制top shelf 顯示的內容萍肆，參數如下：
- ID ： 一個獨一無二的ID
- imageURL : 圖片在網絡上的地址
- imageShape : 圖片形狀袍榆，有三種，.Poster,.Square,.HDTV,圖片按照順序逐漸變大
- title : 每張卡片對應的標題塘揣，標題只會顯示一個
- displayURL ： 用戶點擊聚焦的卡片時發(fā)送給主app的URL
- playURL : 用戶點擊播放按鈕時發(fā)送給主app的URL
此時運行程序包雀，我們應該就能看見效果了，如下圖亲铡，如果你看不到圖片才写，可能是圖片網址已經失效，可以嘗試更換一個圖片地址試試奖蔓。
好了赞草，現在我們就可以通過top shelf來向用戶展示數據了。但是還是有個問題吆鹤，top shelf 是可以點擊的厨疙，但是我們無論用大力金剛手還是粗壯的麒麟臂來點這些圖片，卻什么都沒有發(fā)生疑务，這是因為我們沒有加入 deep link沾凄，下面開始加入deep link。
在主app的info中添加以下項目
好了知允，現在點擊某個卡片元素就能直接打開app了撒蟀，在app中獲取打開的是哪個卡片的辦法：在appdelegate中添加下面這個函數
func application(app: UIApplication, openURL url: NSURL, options: [String : AnyObject]) -> Bool {
//url即為傳進來的信息，進行解析并執(zhí)行相應的操作
return true
}
上面的函數對url進行解析并執(zhí)行相應的操作即可温鸽，這里就不再往下寫了保屯。
如此，一個簡單的top shelf就制作好了嗤朴，第一次發(fā)文配椭，求贊！
